正確的使用alt text屬性和title屬性不僅可以提高圖片的搜索能力，對(duì)用戶(hù)體驗(yàn)上也是很有幫助。
alt text
替換文字（alt text）是為了給那些不能看到你文檔中圖像的瀏覽者提供文字說(shuō)明。這包括那些使用本來(lái)就不支持圖像顯示或者圖像顯示被關(guān)閉的瀏覽器的用戶(hù)，視覺(jué)障礙的用戶(hù)和使用屏幕閱讀器的用戶(hù)。所以替換文字是用來(lái)替代圖像而不是提供額外說(shuō)明文字的。Alt text在IE瀏覽器中還起到了title的作用――鼠標(biāo)經(jīng)過(guò)時(shí)的文字提示。IE瀏覽器給了大家一個(gè)誤導(dǎo)，在IE中ALT會(huì)變成文字提示是因?yàn)镮E不標(biāo)準(zhǔn)。這一點(diǎn)Firefox做的就比較好。
title
title是對(duì)圖片的說(shuō)明和額外補(bǔ)充，如果需要在鼠標(biāo)經(jīng)過(guò)圖片時(shí)出現(xiàn)文字提示應(yīng)該用屬性title。title屬性的優(yōu)先級(jí)高于alt text。但由于錯(cuò)誤的引導(dǎo)，很多初學(xué)者就在img標(biāo)簽內(nèi)只加了alt屬性。
下面看個(gè)例子，我們可以更清楚的看清alt text和 title之間的區(qū)別：
//*圖片不顯示
<img src="sj33.jpg" width="400" height="104"alt="設(shè)計(jì)之家">
<img src="sj33.jpg" width="239" height="104" title="設(shè)計(jì)之家" />
//*圖片顯示
<img src="sj33.png" title="設(shè)計(jì)之家" />
<img src="sj33.png" />
在IE瀏覽器中，這四句代碼，鼠標(biāo)經(jīng)過(guò)圖片時(shí)，都會(huì)出現(xiàn)文字提示。
而在Firefox瀏覽器中，前三句代碼，鼠標(biāo)經(jīng)過(guò)圖片時(shí)，都會(huì)出現(xiàn)文字提示，最后一句代碼，鼠標(biāo)經(jīng)過(guò)圖片不會(huì)顯示文字提示。
也就是說(shuō)當(dāng)圖片不能顯示時(shí)，鼠標(biāo)經(jīng)過(guò)圖片時(shí)會(huì)顯示替換文字的內(nèi)容，而當(dāng)圖片可以顯示時(shí)，鼠標(biāo)經(jīng)過(guò)圖片時(shí)，替換文字就不會(huì)顯示出來(lái)了。
現(xiàn)在我們已經(jīng)知道alt text和title有什么不同了，那么我們?cè)鯓硬拍苷_使用它們呢？
1. alt text和title對(duì)訪問(wèn)者都很重要（alt text對(duì)搜索引擎會(huì)更重要一些），所以在定義img對(duì)象時(shí)，最好將alt text和title屬性都寫(xiě)全，保證在各種瀏覽器中都能正常使用。
2. 在alt text和title中包含關(guān)鍵字，并且二者內(nèi)容最好不一樣。
3. 不要在alt text和title中堆積關(guān)鍵字，否則可能會(huì)導(dǎo)致搜索引擎懲罰。
