可認知

網站的內容是提供給感官-視覺,聽覺和/或觸覺

 

指引 1.1

替代文字:提供文字來替代任何非文字內容

成功標準

WebAIM的建議

1.1.1非文字內容
(A級)

所有圖片、表單的圖像按鈕和圖像地圖中的各個連結都有適當和相等的替代文字

不傳達內容的圖像,裝飾的圖像,或內容已經以文字轉達者,則給出空替代文字(ALT =“”)或使用以CSS實施的背景。所有圖像連結都有替代文字。

為複雜的圖像提供替代文字,可將替代文字放在獨立一頁中並以連結連接或用 longdesc)頁。

表單按鈕有描述值。

表單輸入項有文字標籤(text lable)。如果不能使用標籤,則使用描述性的標題屬性(title attribude)。

嵌入式多媒體以可訪問的文字內容標示。

框架有適當標題

 

指引 1.2

基於時間的媒體:為基於時間的媒體提供替代

注意:如果聲音或影片被指定為網頁內容的替代(如聲音或手語版的網頁),那麼網頁內容本身即已作為替代。

成功標準

WebAIM的建議

1.2.1預先錄製的純聲音和純影像的影片
(A級)

為非即時,基於網頁的聲音檔(播客,MP3文件等)提供文字翻譯(包括所有有關的視覺和聽覺的線索和指標)。

為非即時,基於網頁的影片(例如沒有音軌的影片)提供文字或口述影像。

1.2.2字幕(預錄)
(A級)

在非即時,基於網頁的影片(YouTube影片等)提供同步字幕。

1.2.3口述影像或替代媒體(預錄)
(A級)

在非即時,基於網頁的影片中提供文字翻譯或口述影像的音軌。

1.2.4字幕(即時)
(AA級)

同步字幕在所有即時多媒體聲音(只有聲音的廣播,網上廣播),視像會議,Flash動畫等中提供。

1.2.5口述影像 (預錄)
(AA級)

為所有的影片內容提供口述影像。
注意:只適用於當影片傳達的視覺內容在預設的音軌中不能取得時。

1.2.6手語(預錄)
(等級 AAA級)

為所有包含聲音的媒體提供一個手語版本。

1.2.7擴展的口述影像(預錄)
(等級 AAA級)

當一個口述影像音軌因時間限制而不能被添加到影片時(如,聲音沒有停頓),則提供另一個設有暫停以容許加入口述影像的影片。

1.2.8替代媒體(預錄)
(等級 AAA級)

為所有預先錄製而有影像的媒體提供文字說明翻譯。

1.2.9純聲音(即時)
(等級 AAA級)

為所有含有聲音的即時內容提供文字翻譯(例如,現場的講稿。)

 

指引 1.3

適應性:製作可以以不同的方式呈現的內容(例如簡單的佈局),而不會丟失訊息或結構

成功標準

WebAIM的建議

1.3.1資訊和關聯
(A級)

在適當地方使用相應的語義標記例如標題(<h1>),列表(<ul>,<ol>, 及<dl>),強調或特別文字(<strong>,<code>, <abbr>,<blockquote>),等。

以表格顯示數據。 如有需要,將數據單元與相應的表格頭關聯起來。在適當的地方使用表標題和摘要。

表單輸入項都附設有文字標籤。以fieldset或legend將相關表單項組合在一起。

1.3.2有意義的序列
(A級)

閱讀和導航順序(取決於代碼的次序) 是合乎邏輯和直觀的。

1.3.3感官特性
(A級)

不使用依賴於形狀,大小,或視覺位置的指示(例如不使用,“點擊方形圖繼續”或“說明在右邊欄”一類的指示)。

不使用依賴聲音的指示(例如不用,“嗶嗶聲表示您可以繼續。”一類的指示)。

 

指引 1.4

區別:讓用戶更容易看到和聽到內容,包括前景與背景分離

成功標準

WebAIM的建議

1.4.1使用顏色
(A級)

不以顏色作為唯一的方法來傳達內容或區別視覺元素。

不單用顏色來區分連結和周圍文字,除非連結和周圍的文字亮度對比至少是3:1和一個額外的分野(例如他在滑鼠移過或接收焦點時以底線區別。

1.4.2聲音控制
(A級)

為在網頁上自動播放超過3秒的聲音設立一個機制來停止,暫停,靜音,或調整音量。

1.4.3對比度(最低)
(AA級)

文字和圖像文字的對比度至少達4.5:1。

大字(超過 18點或14點,粗體)至少具有對比度3:1

1.4.4調整文字大小
(AA級)

在文字的大小增加了一倍時該網頁仍可讀和功能正常。

1.4.5圖像文字
(AA級)

如果相同的視覺效果可只使用文字而達到,則不使用圖像來表示該文字。

1.4.6對比(增強)
(等級 AAA級)

文字和圖像文字的對比度至少達7:1。

大文字(超過 18點或14點,粗體)至少具有對比度4.5:1。

1.4.7低或無背景聲音
(等級 AAA級)

說話的聲音沒有或只有非常低的背景噪音,使說話能很容易聽到。

1.4.8可視外觀
(等級 AAA級)

當文字塊的長度超過了一句話: 不超過80個字符寬。

不絕對對齊(無論是左對齊,右對齊)。

有足夠的行間距(至少文字的1 / 2倍高)和段落間距1.5倍於行距)。

有指定的前景色和背景色。 這可為特定元素指定,或使用CSS應用到整個網頁(從而由其他元素所繼承)。

當文字大小設定成兩倍大時不需要水平滾動進行閱讀

1.4.9圖像文字(無例外)
(等級 AAA級)

文字在圖像內僅作為裝飾用(圖像不傳達內容)或訊息不能只以文字表達。