詳細講解CSS中alt和title屬性的困惑

瀏覽器賣主扭曲了標準並且自顧自的不按規則去做一些事，他們可能會造成一些問題，或者至少產生了混淆。例子之一就是一些瀏覽器處理alt屬性（一般會被錯誤的稱作alt標籤）的方式，比如擁有大量使用者的Windows的IE瀏覽器。
替換文字（alt text）並不是用來做提示（tool tip），或者更加確切的說，它並不是為圖片提供額外說明資訊的。相反地，title屬性才應該用來為元素提供額外說明資訊。這些資訊在大部分映像瀏覽器裡顯示為提示（tool tip），雖然製造商可以任意採取其他方式渲染title屬性的文字。
很多人看來對這兩個屬性感到迷惑（最近這個問題在Web Standards Group郵件清單裡變多了）， 所以我寫下我的想法，如何去用它們。
alt屬性
為不能顯示映像、表單或applets的使用者代理程式（UA），alt屬性用來指定替換文字。替換文字的語言由lang屬性指定。來源：How to specify alternate text.
Alt屬性（注意是“屬性”而不是“標籤”）包括替換說明，對於映像和映像熱點是必須的。它只能用在img、area和input元素中（包括applet元素）。對於input元素，alt屬性意在用來替換提交按鈕的圖片。比如：<input type="image" src="image.gif" alt="Submit" />.
使用alt屬性是為了給那些不能看到你文檔中映像的瀏覽者提供文字說明。這包括那些使用本來就不支援映像顯示或者映像顯示被關閉的瀏覽器的使用者，視覺障礙的使用者和使用螢幕助讀程式的使用者。替換文字是用來替代映像而不是提供額外解說文字的。
在寫替換文字前仔細想想，保證那些文字確實為那些看不到映像的人提供了說明資訊，並且在上下文中有意義。對於那些裝飾性的圖片可以使用空的值（alt=""，引號中間沒有空格），而不是使用不相關的替換文字比如“blue bullet”或者“spacer.gif”。不要忽略它，如果你忽略了，那麼一些螢幕助讀程式會直接閱讀影像檔的檔案名稱，那些文字瀏覽器，比如Lynx會顯示影像檔的檔案名稱，而那對於你的瀏覽者就沒什麼用了。
包含文字的映像圖片設定替換文字是最簡單的，映像中包含的文字一般來說就可以作為alt屬性值。
至於替換文字的長度，看看WCAG 2.0（網站內容可用性指南2.0）是怎麼說的：
Alt屬性值得長度必須少於100個英文字元或者使用者必須保證替換文字儘可能的短。
我把它理解為“儘可能短，盡需要長”。
即使你想讓它顯示為提示（tool tip），也不要給文字元素使用alt屬性，這並不是它的用法。至今據我所知，那樣做僅能在Windows的IE瀏覽器和古老的Netscape 4.*（windows版本）有效。沒有一個Mac的瀏覽器會將它顯示為提示（tool tip）。