圖片alt屬性最佳做法

Question

<img>標籤上的alt屬性的預期用途究竟是什麼？

它應該描述圖像，還是應該爲屏幕閱讀器（以及關閉圖像的人）提供有意義的替換文本？例如，如果我的網站上有一個人的簡歷，並且包含他們的一張小照片，那麼視障用戶是否會向他們宣讀「約翰史密斯的照片」真的有意義嗎？

Answer 1

的HTML 5規範對這個huge section更換。

基本上，alt屬性應該是那裏將作爲文本，如果你根本沒有使用圖像。如果您的圖片純粹是裝飾性的，您可以使用alt=""。描述進入title屬性。

Answer 2

如果由於某些原因無法加載圖像，它會提供「備用」文本。在你的例子中，我會說是的，這將是適當的。

Answer 3

它應該是任何可以幫助用戶的圖像不顯示。

順便說一句，當你將鼠標懸停在IE中的圖像上，並且工具提示顯示ALT不是ALT的正確行爲時的「特徵」。標題應該用於此。

Answer 4

第一次打在谷歌這[img alt無障礙]給考慮什麼頁面看起來像或聽起來像當圖像沒有顯示。然後，爲每個圖像寫一個替代文字，作爲替代品可以發揮最佳效果（Guidelines on alt texts in img elements）

Answer 5

簡潔地描述圖像，就好像您正在與盲人聊天一樣。很簡單。

我確定Google使用此屬性值爲圖片搜索建立索引。

Answer 6

從w3.org：

雖然替代文本可以是非常有益的，但必須小心處理。作者應遵守以下準則：

• 包括準備設置頁面格式的圖像，例如當，ALT =「紅球」將是不恰當的，增加了一個紅球裝飾圖像不指定無關的替代文本標題或段落。在這種情況下，替代文本應該是空字符串（「」）。無論如何建議作者避免使用圖像來格式化頁面;應該使用樣式表。
• 不要指定無意義的替代文本（例如「虛擬文本」）。這不僅會阻礙用戶，還會減慢必須將文本轉換爲語音或盲文輸出的用戶代理。

Answer 7

我認爲這個想法是使用alt文本來傳達與圖像預期相同的信息。這取決於圖像是什麼。

導航元素可能比它們的外觀（「右箭頭」）更好地描述其功能（「下一頁」，「後退」）。

約翰·史密斯的照片可能與約翰·史密斯的描述，或者事件發生的描述等

Answer 8

「alt」屬性是圖像語義的替代（文本）表示。這不僅適用於無法加載的圖像：它還用於屏幕閱讀器或純文本瀏覽器。

在您的特定情況下，包括alt-text類型取決於您是否認爲重要的是要注意該頁面包含該人的照片。如果它是一個純粹的視覺項目，你可能不需要任何alt文本。如果它也被用作某種鏈接，那麼你可能需要一些alt-text，以便使用屏幕閱讀器的人對鏈接後面的內容有一些線索。

Answer 9

，如果我有一個 人在我的網站上的短傳，並把它們包含的 小照片，是不是真的 有意義的視障用戶 有「約翰·史密斯的照片」讀出 給他們？

如果你沒有那個ALT文本，你認爲他們會認爲圖像是什麼？ 「約翰史密斯和他的妻子的照片」？ 「約翰史密斯接受他的奧斯卡的照片」？ 「約翰史密斯暗殺肯尼迪的照片」？ 「約翰史密斯被他的寵物大象殺害後躺在自己的露臺上的照片」？

如果是約翰史密斯的照片，是的，這樣說。如果是別的東西，請這麼說。

Answer 10

Alt屬性與img標籤一起使用。

alt表示替代

它用於圖像的簡短說明。

據顯示在屏幕上的情況下，瀏覽器是無法加載圖像

Click to Know more