HTML5Boilerplate和圖像替換類text-indent -999em

Question

我一直在爲我的大部分項目使用HTML5Boilerplate，因爲它是一個很好的框架，但我和其他開發人員一直在來回地討論圖像替換類和使用文本縮進：-999em。

他給我發了這兩個環節：

http://luigimontanez.com/2010/stop-using-text-indent-css-trick/

http://www.youtube.com/watch?v=fBLvn_WkDJ4

我知道HTML5Boilerplate團隊做了很多的研究，當他們放在一起的樣式表，我知道這是一種常見的技術很多開發人員使用。你們想到了什麼？我是否應該開始使用其他技術，以便我們的網站不會受到處罰，還是可以繼續使用它？

謝謝！

Answer 1

這兩項環節的具體是指標誌，其中最語義的途徑是標誌與alt屬性添加爲一個圖像標記：

<img src="/path/to/logo.png" alt="Foo bar baz! The best way to fizz buzz" /> 

它們不包括什麼情況下，你可能想要使用普通的舊圖像替換。隨着嵌入字體變得越來越普遍和受到支持，圖像替換不太常見，但是，仍然有很多情況下，唯一的出路是使用替換圖像。

由於藝術家往往想要花哨的繁榮，所以它在標題上特別常見。

如果可能，請使用帶有alt屬性的內嵌圖像，因爲這是顯示它的最有語義的方式。問題在於，如果您使用的是CMS，您可能有或沒有直接訪問標記，因此在很多情況下，出路在於使用CSS或JS映像替換。

如果你必須使用CSS，不要太擔心text-indent: -9999px;。一個合法的替代品不會讓你被Google列入黑名單，只是不要試圖通過試圖隱藏只有谷歌才能看到的用戶內容來遊戲系統。