Checklist 網站無障礙規範 2.0 版 A 級

tags: a11y, 國家通訊傳播委員會, 無障礙設計, 無障礙

網站整體評量
通過所有檢測等級 A 之檢測程序,相關稽核評量碼 EV1000000。

相關連結


一、可感知

1.「替代文字」:為任何非文字的內容提供相等意義的替代文字,使這些內容能依人們的需求,轉變成大字版、點字、語音、符號或簡化過的語言等不同型態。

1.1

如果非文字的內容是個控制元件或接受使用者輸入的元件,那麼它就會有個用來描述其目的的名稱(這種情況請參考規範12)。

  • XH1010100:圖片組件需有替代文字屬性
  • XH1010101:影像地圖的區域組件需有替代文字屬性,且其值不得為空字串或空白
  • XH1010102:圖片組件之長描述屬性值需為有效之URI,且其目的資源末端能以超連結回到此圖片組件
  • XH1010103:字符圖案、表情符號、其他挪用文字外型作為表意功能之語言形式等內容,需透過合適組件的標題屬性來提供替代文字,且其值不得為空字串或空白
  • XH1010104:型別屬性值為圖片之輸入組件,需有替代文字屬性,且其值不得為空字串或空白
  • EV1010100:圖片需要加上有意義、可代替圖片在文件脈絡中的功能及內容的替代文字
  • EV1010101:僅在一組緊連圖片中的其中一個項目使用替代文字,描述該組圖片的所有項目
  • EV1010102:提供影像地圖區域的替代文字,並要能確實表達這些地圖區域的功能與目的
  • EV1010103:圖片無法以替代文字清晰表達時,利用長描述提供更詳盡的說明網頁網址,利用整個說明網頁的篇幅來詳盡描述,最後並要能連結回原本的圖片
  • EV1010104:提供字符圖案、表情符號、其他挪用文字外型作為表意功能之語言形式的替代文字,且其替代文字需有意義、可代替前述內容之目的與功能
  • EV1010105:圖片以外的非文字內容需要有替代文字或長描述,並需具有與該內容或物件相同目的、呈現相同資訊,或者可提供概略描述、俗名、描述性名稱
  • EV1010106:作為「送出」按鈕之用的圖片需提供替代文字,且此替代文字需能充分表達此按鈕之意義與功能

1.2

如果非文字的內容是個時序媒體,那麼替代文字至少要為此非文字內容提供描述性的識別資訊(這種情況請參考規範2)。

  • XH1010200:物件組件需加入替代物件、替代媒體、替代文字內容
  • EV1010200:提供可描述現場純音訊內容目的及現場純視訊內容目的的描述性標籤

1.3

如果非文字的內容改以文字呈現即會導致測驗或習題無效,那麼替代文字至少要為此非文字內容提供描述性的識別資訊。

  • EV1010301:提供物件的文字替代內容與非文字替代內容,且要能完整表達該物件的意義與功能

1.4

如果非文字的內容主要是為了創造特定的知覺體驗,那麼替代文字至少要為此非文字內容提供描述性的識別資訊。

  • EV1010400:針對虛擬實境、立體成像、或環場空間等知覺體驗的非文字內容需要有替代文字或長描述,並至少要為這些非文字內容提供描述性的識別資訊。

1.5

如果非文字的內容,是為了要確認取用內容的是人而非電腦,那麼首先要以替代文字來指出及描述此非文字內容的目的,接著還要提供替代的CAPTCHA驗證,採不同感官感知類型的輸出模式,以顧及不同的障礙。

  • EV1010500:任何CAPTCHA驗證均需提供描述CAPTCHA驗證目的的替代文字
  • EV1010501:網頁上任何一個CAPTCHA驗證均至少有另一個運用不同形式的CAPTCHA驗證,且具有相同的目的與功能

1.6

如果非文字的內容完全只有裝飾作用、僅用於視覺格式排版、或根本不會呈現在使用者面前,那麼就要用輔助科技能加以忽略的方式來實踐。

  • XH1010600:替代文字屬性值為空字串的圖片組件,不得有標題屬性
  • EV1010600:對於輔助科技應當要忽略的圖片,使用空字串作為替代文字,並且不可使用標題屬性
  • EV1010601:裝飾性圖片均透過CSS來置入
  • EV1010602:使用CSS方塊模型來處理版面設計,不要用佔位圖片

2.「時序媒體」:針對時序媒體提供替代內容。

2.1

除非音訊及視訊是文字內容的替代媒體,並且有明確地標示出來,否則就應該做到下列事項:

  • 2.1.1. 預先錄製的純音訊:提供時序媒體的替代內容來表達純音訊內容的等義資訊。
  • 2.1.2. 預先錄製的純視訊:提供時序媒體的替代內容或替代音軌來表達純視訊內容的等義資訊。
  • EV1020100:提供預先錄製之純音訊內容的時序媒體替代內容
  • EV1020101:提供預先錄製之純視訊內容的時序媒體替代內容
  • EV1020102:提供描述預先錄製之重要視訊內容的音訊,並描述其本身係用於描述重要視訊內容

2.2

除非在同步媒體中,預先錄製的音訊內容是文字內容的替代媒體,並且有明確地標示出來,否則就應該為所有的音訊內容提供字幕。

  • EV1020200:提供預先錄製之音訊內容的隱藏式或非隱藏式(永遠看得到的)字幕

2.3

除非同步媒體是文字內容的替代媒體,並且有明確地標示出來,否則就應該為這些同步媒體提供替代時序媒體,或預先錄製的視訊內容的音訊描述。

  • EV1020300:提供預先錄製之時序媒體的替代內容,並在時序媒體的非文字內容後馬上放置連往替代內容的鏈結
  • EV1020301:除非同步媒體是文字內容的替代媒體,並且有明確地標示出來,否則就提供具有音訊描述或額外音訊描述的電影,或提供使用者可選取、且含有音訊描述的第二音軌
  • EV1020302:影片畫面僅呈現講者頭部視訊時,提供靜態文字替代

3.「可調適」:建立能以不同方式(例如簡化的版面)呈現,而仍不會喪失資訊或結構的內容。

3.1

由呈現方式所傳達的資訊、結構與關連性要能以程式化的方式判讀,或者有對應的文字。

  • XH1030100:網頁中的標頭組件必須要按照正確的巢狀層次結構來配置
  • XH1030101:有多層標頭的表格,應使用範疇屬性,或使用對應標頭屬性,來建立表格標頭儲存格與資料儲存格之間的關連
  • XH1030102:表單控制元件組件需以欄位組組件來分群,並以說明文字組件來提供標題;表單選擇組件則需以選項分群組件來將選項組件加以分群
  • XH1030103:可見的表單控制元件均需有對應的標籤組件,或有標題屬性,且其內容或值均不得為空字串或空白
  • EV1030100:使用文字來傳達那些由不同文字呈現所傳達的資訊
  • EV1030101:使用色彩線索的時候就使用語意標記
  • EV1030102:從呈現當中抽離資訊與結構,以便啟用不同的呈現
  • EV1030103:文字的視覺呈現均以CSS來控制
  • EV1030104:適當使用巢狀標頭呈現文件結構
  • EV1030105:使用語意組件來標記結構
  • EV1030106:使用具語意的標記來標出強調的文字或特殊文字
  • EV1030107:使用表格標記來呈現表格資訊
  • EV1030108:以有意義的標記來提供資料表格的概觀
  • EV1030109:以有意義的標記來建立表格標題與資料表格的關連
  • EV1030110:對於複雜表格,以有意義的標記來建立表格標頭儲存格與資料儲存格之間的關連
  • EV1030111:將表單控制元件及表單內的選項予以適當地分群並提供相關的描述
  • EV1030112:使用標籤組件將文字標籤與表單控制元件建立關連
  • EV1030113:無法使用標籤組件的情況下,用標題屬性來指明表單控制元件

3.2

當內容中的呈現順序會影響其意義時,應該要能以程式化的方式,判讀正確的閱讀序列。

  • XH1030200:混用多國語言內容,出現已知文字走向不同的內容時,需有萬國碼的右至左標記(RLM)或左至右標記(LRM),或以行內組件搭配使用文字方向屬性
  • EV1030200:將內容依據有意義的序列來排序
  • EV1030201:使用萬國碼的右至左標記(RLM)或左至右標記(LRM)來即席混用文字走向,或在行內組件使用文字方向屬性以解決巢狀文字走向的問題
  • EV1030202:使用CSS來控制字詞內的字母間距
  • EV1030203:DOM物件順序需與視覺順序一致

3.3

用來理解及操作內容的指示,不可單獨依賴元件的形狀、尺寸、視覺位置、導向、聲音等知覺特徵。

  • EV1030300:針對若無文字項目識別則必須仰賴感官資訊才能理解的內容,提供文字項目識別

4.「可辨識」:讓使用者能更容易地看見及聽到內容、區分前景和背景。

4.1

色彩不可當做唯1能傳達資訊、提出動作、提請回應或區別視覺元件的視覺手段來使用。

  • EV1040100:確保所有藉由顏色所傳達出來的訊息,在沒有顏色後仍然能夠傳達出來
  • EV1040101:當使用者介面元件取得焦點時,使用CSS變更其呈現方式
  • EV1040102:對有顏色表單控制標題,提供文字線索提示

4.2

如果網頁上有任何音訊會自動播放達3秒鐘以上,那麼就該提供1套機制來暫停或中止音訊播放,或者要能在整體系統音量設定外,另外提供控制音量的機制。

  • EV1040200:除非聲音在三秒鐘內會自動關閉,或者在靠近頁面開頭處有提供可以關閉自動播放的聲音的控制元件,否則只有當使用者請求時才播放聲音

二、可操作

5.「鍵盤可操作」:讓所有的功能都能透過鍵盤使用。

5.1

內容的所有功能都能透過鍵盤介面來操作,而且不能額外要求在限定時間內完成按鍵操作。特殊目的的網頁(例如遊戲網頁要求在特定時間內完成指定操作)不在此限。

  • EV1050100:提供由鍵盤觸發的事件處理程式
  • EV1050101:確認所有功能都能透過鍵盤介面來操作

5.2

如果可以使用鍵盤介面,將鍵盤焦點移至頁面中的某個元件,則也要能僅用鍵盤介面就把焦點移開;如果移開焦點需要用到普通的方向鍵、跳位鍵以外的按鍵,或其他標準的離開方法,則需告知使用者如何操作。

  • EV1050200:確認使用者不會困在內容中

6.「充足時間」:提供使用者充分的時間來閱讀及使用內容。

6.1

對於每1個由內容所設定的時間限制來說,下列各款至少得做到其中1項:
1.使用者遇上時間限制之前就能把它關掉。
2.使用者遇上時間限制之前就能加以調整,而且可調整的範圍要很大,至少是預設設定的10倍以上。
3.計時截止之前先警告使用者,並保留至少20秒的時間,讓使用者用簡單的動作(例如「按空白鍵」)來延長時限,且使用者至少能延長時限10次以上。
4.當時間限制為即時事件(例如拍賣)中所需要的部份,而且不可能有任何替代的時限時,可不允許計時調整。
5.當時限為必要,且延長時限會使得活動無效時,可不允許計時調整。
6.當時限比20小時還長時,可不允許計時調整。

  • EV1060100:在多頁表單的第一頁提供一個核選框,讓使用者可以要求較寬鬆的階段時間限制,或者完全不要有階段時間限制
  • EV1060101:提供能讓使用者將時間限制設為預設時間限制十倍,或完全關閉時間限制的方法

6.2

對於會移動、閃動、捲動或自動更新的資訊來說,下列各款全部都要做到:
1.對於任何會移動、閃動或捲動,且為(1)會自動開始、(2)維持超過5秒鐘、(3)與其他內容平行呈現的資訊來說,除非這種移動、閃動或捲動乃是活動的1部分且不可或缺,否則就要有個機制來讓使用者可以暫停、中止或加以隱藏。
2.對於任何會自動更新,且為(1)會自動開始、(2)與其他內容平行呈現的資訊來說,除非這種自動更新是內容的1部分且不可或缺,否則就要有個機制來讓使用者可以暫停、中止或加以隱藏,或能控制更新的頻率。

  • EV1060200:讓內容能加以暫停,並可從暫停處重新開始
  • EV1060201:建立閃動少於5秒鐘的內容
  • EV1060202:在網頁內使用可以停止移動、閃動、自動更新等內容的控制元件
  • EV1060203:使用能由使用者代理關閉閃動內容的科技
  • EV1060204:提供鏈結、按鈕,或任何可以不閃動內容即重新載入頁面的機制
  • EV1060205:動畫GIF圖檔之閃動時間不超過五秒鐘

7.「防痙攣」:不要用任何已知會引發痙攣的方式來設計內容。

7.1

網頁上不可含有任何1個元件,其在任何1秒鐘之內,會閃爍超過3次且超出1般閃爍及紅閃爍閾值。

  • EV1070100:使用工具來確認內容不會超出一般閃爍閾值或紅閃爍閾值,或者確認在任何一秒鐘的週期內,沒有任何內容元素會閃爍超過三次
  • EV1070101:能讓閃爍區域保持夠小

8.「可導覽」:提供協助使用者導覽、尋找內容及判斷所在的方法。

8.1

有機制得以跳過在多頁中重複出現的內容區塊。

  • XH1080102:一串連續的鏈結組件需以清單組件或地圖組件來分群
  • EV1080100:在每一個頁面頂端加入一個鏈結,直接連往主要的內容區域
  • EV1080101:在重複內容的區塊開頭加入鏈結,連到該區塊結束之處,或用頁框來群聚重複出現的材料區塊
  • EV1080102:在頁面頂端加入鏈結,連到每一個內容區域
  • EV1080103:使用結構性組件來將鏈結分群
  • EV1080104:在每一個內容區段開頭處提供標頭組件
  • EV1080105:根據結構性標記來將內容定位

8.2

網頁有用標題來描述主旨或目的。

  • XH1080200:網頁需有標題組件,且其值不得為空字串或空白
  • EV1080200:提供網頁的描述性標題

8.3

如果網頁能依序導覽,且導覽順序將會影響到意義或操作,則可取得焦點的元件要以能保留意義與操作性的順序,來取得焦點。

  • EV1080300:按照內容的序列及關連性來安排互動元件的放置順序
  • EV1080301:在鏈結、表單控制元件、物件間建立合乎邏輯的跳位順序

8.4

每一個鏈結的目的可以透過鏈結本身的文字或以鏈結文字加上能以程式化判定的鏈結脈絡予以確認,除非鏈接的目的對整體使用者來說均不明確。

  • XH1080400:連往相同資源的毗鄰圖片與文字,其由文字內容及替代文字產生之鏈結文字只能有一份
  • XH1080401:具有連結目的之鏈結組件均需有鏈結文字,且其內容不得為空字串或空白;若此鏈結組件前後尚有其他內容,則亦需有標題屬性,且其值不得為空字串或空白
  • EV1080400:使用鏈結文字及前後的脈絡情境來指明鏈結目的
  • EV1080401:針對脈絡中的鏈結,提供描述鏈結目的的鏈結文字
  • EV1080402:合併相同資源的毗鄰圖片與文字鏈結
  • EV1080403:提供描述定位錨組件鏈結目的的鏈結文字
  • EV1080404:針對脈絡中的鏈結,用標題屬性來補充鏈結文字
  • EV1080405:在靠近網頁開頭處提供可以變更鏈結文字的控制元件,或使用CSS隱藏部分鏈結文字

8.5

提供多種方法指出某一網頁在一組網頁之中的位置,除非此網頁是某個流程或步驟的結果

  • EV1080500:提供網站導覽、導覽工具或機制、搜尋功能、網頁清單鏈結等功能,協助使用者尋找內容

三、可理解

9.「可讀性」:讓文字內容可讀並可理解。

9.1

每1個網頁所使用的預設人類語言,都可以程式化的方式判讀。

  • XH1090100:網頁根組件需有語言屬性,且其值必須合於規範,不得為空字串或空白
  • EV1090100:明確指出網頁文字所使用的人類語言

10.「可預期性」:讓網頁以可預期的方式來呈現及運作。

10.1

當任何元件獲得焦點時,並不會使前後脈絡產生改變。

  • EV1100100:物件單純取得焦點時不要觸發脈絡變更,等使用者啟動該物件後才觸發脈絡變更

10.2

除非使用者在使用元件前已被告知過相關的程式行為,否則變更任何使用者介面元件的設定時,都不會自動變更脈絡。
相關檢測碼

  • ME1100200 提供下載之檔案格式應為開放格式如ODF、PDF、HTML等檔案格式
  • EV1100200:表單控制元件之行為將使網頁跳轉或變更,則在脈絡變更前需先明確描述將發生的事情
  • EV1100201:使用按鈕來做出行動並啟動脈絡變更
  • EV1100202:提供下載檔案格式不可為需依賴特定文書商用軟體即能開啟之檔案

11.「輸入協助」:幫助使用者避開及更正錯誤。

11.1

如果會自動偵測輸入的錯誤,則指明出錯的項目並以文字向使用者描述。

  • EV1110100:提供文字描述以指明未完成的必填欄位
  • EV1110101:使用者輸入的內容不在允許清單中,或格式未符合所需時,均提供文字描述
  • EV1110102:資料成功送出後,提供成功的回饋

11.2

當內容需要使用者輸入時,提供標籤或指引。

  • EV1110200:在使用者送出資料前,先描述會發生什麼事
  • EV1110201:提供文字描述以指明需填寫的必填欄位
  • EV1110202:提供預期的資料格式與範例
  • EV1110203:妥善定位描述性的標籤,使關連性的可預期性最大化
  • EV1110204:使用毗鄰的按鈕來標示輸入區目的
  • EV1110205:在表單或一組表單欄位開頭處提供文字指示來描述必要的輸入欄位
  • EV1110206:指出必需的表單控制元件

四、穩健性

12. 「相容性」:針對目前及未來的使用者代理與輔助科技,最大化其相容性。

12.1

對於用標記語言來實作的內容來說,除非經規格所容許,否則組件要有完整的開始與結束標籤、按規格巢狀編排、不得有重複的屬性,且任何ID都要獨一無二。

  • XH1120100:網頁完全符合W3C標準規格,並通過W3C驗證

12.2

對於所有的使用者介面元件(包括但不限於表單組件、鏈結及由腳本所產生的組件)來說,其名稱及角色要能用程式化的方法判定;其能由使用者所設定的狀態、屬性、值,則要能用程式化的方式設定;而使用者代理,包括輔助科技,則要有這些項目變更的通知。

  • XH1120201:頁框組件及內嵌式頁框組件需有標題屬性,且其值不得為空字串或空白
  • EV1120200:使用者介面元件應暴露名稱與角色,允許直接設定可由使用者設定的屬性,並在變更時提供通知
Select a repo