優質網頁小貼士

使用 alt 屬性描述每幅圖像

alt 屬性有什麼用？

alt 屬性可以在一系列標籤中使用（如 img，area 和 input 以及 applet），它能為該物件提供一個替代文本。

替代文本在下列常見的情況下，能為你的網站和訪客提供一些好處：

• 現在，各種不同平臺都有功能不一的網頁流覽器，有些根本無法顯示圖像，或只能顯示特定的幾種圖像；有些能夠設定為不載入圖像。如果你的圖像代碼中包含 alt 屬性，在這種情況下，絕大多數的流覽器都能顯示該屬性的內容來代替缺失的圖像
• 你的一些訪客無法看清圖像，比如他們患有弱視、色盲，或近視，alt 屬性對他們的幫助就很大了。他們可以根據該屬性中的內容來瞭解你頁面中的資訊
• 搜索引擎機器人就屬於上述兩種類型：如果你想讓你的網站被完整收錄到搜索引擎中，使用 alt 屬性可以保證搜索引擎機器人不會錯過你頁面中的重要部分。

我應該在 alt 屬性中放置什麼？

alt 屬性內容的一般規則是：使用與圖片具有相同功能的文字。

一些更具體的規則：

• 如果該圖片用於配合少量文字，則將這些文字放置到 alt 屬性中
• 如果該圖片用於列表符、水平線等類似的裝飾效果，alt 屬性可以留空（例如 alt=""），但如果能在 CSS 中使用 list-style-image 則更好
• 如果該圖片代表許多重要資訊，則最好能概括出一小行文字放入 alt 屬性中，然後添加一個 longdesc 鏈結，指向更詳細的描述

延伸閱讀

• Web Content Accessibility Guidelines and the specific section on alternate content
• Core Techniques, section 2 Text equivalents
• Excerpts from the National Braille Association Tape Recording Manual, Third Edition. provides guidance to write descriptions of maps, charts, and other images that contain a lot of information.
• HTML 4.01 and the specific section on the alt attribute
• Providing text equivalents for images and Ignoring spacer images in the Dive Into Accessibility series

關於“優質小貼士”

The W3C 優質小貼士 是為網頁開發者和設計者提供的一些有用的小短文，由 W3C 的 Quality Assurance Interest Group 負責管理和輯寫。中文版由 ZDYX（張杜一雄）維護。

雖然這些小貼士都被小組成員認真審查過，但這只是我們向你提供的點滴技巧。請注意，它們 不能 被認為是 W3C 的技術規範。

學習更多的技巧，瞭解怎樣提交你自己的智慧點滴，以及閱讀其他的優質小貼士，盡在 小貼士索引。