跳至主要內容區
:::
:::
鍵盤操作說明

認識無障礙網頁設計規範- 無障礙網頁設計

請以左、右方向鍵切換「前言、WCAG 1.0、WCAG 2.0、無障礙網頁設計規範 2.0」之頁籤

就如同人行道、騎樓、公共設施提供的「無障礙空間」,讓身心障礙人士可以自由的進出於各個地方,網站也需要提供「無障礙網頁設計」(Web Accessibility),以保障身心障礙者獲取資訊的權利。

無障礙網頁主要是擴展對網頁設計的規範,希望網頁設計人員能以更嚴謹的態度及條件來設計網頁,以確保任何人 ( 包括視覺,聽覺,身體,說話,認知,語言,學習和神經障礙 ) 都有辦法取得放在網頁上的內容,也就是讓網站上的內容易於親近、易於取得和利用。

要設計無障礙網頁,就必需遵守「無障礙網頁設計規範」( Web Content Accessibility Guidelines,簡稱 WCAG ),它是由 W3C 底下的 WAI 組織所訂定,是全球無障礙網頁設計的指導原則。

1999 年 5 月發佈,共有 14 條規範 ( guidelines ),每條規範下設立一或多項的檢測要點 ( Checkpoint ),並依符合檢測要點數量的多寡,制定了 A、AA、AAA 三個符合等級。

WCAG 1.0 的 14 條規範

  • 規範一
    對於聽覺及視覺的內容要提供相等的替代文字內容。Provide equivalent alternatives to auditory and visual content.
  • 規範二
    不要單獨靠色彩來提供特殊資訊。Don’t rely on color alone.
  • 規範三
    適當地使用標記語言和樣式表單。Use markup and style sheets and do so properly.
  • 規範四
    闡明自然語言的使用。Clarify natural language usage.
  • 規範五
    建立編排良好的表格。Create tables that transform gracefully.
  • 規範六
    確保網頁能在新科技下良好地呈現。Ensure that pages featuring new technologies transform gracefully.
  • 規範七
    確保使用者能處理時間敏感內容的改變。 Ensure user control of time-sensitive content changes.
  • 規範八
    確保嵌入式使用者介面具有直接可及性。Ensure direct accessibility of embedded user interfaces.
  • 規範九
    設計裝置獨立網頁。Design for device-independence.
  • 規範十
    使用過渡的解決方案。Use interim solutions.
  • 規範十一
    使用國際與國內官方訂定的技術和規範。Use W3C technologies and guidelines.
  • 規範十二
    提供內容導引資訊。Provide context and orientation information.
  • 規範十三
    提供清楚的瀏覽網站機制。Provide clear navigation mechanisms.
  • 規範十四
    確保簡單清楚的網頁內容。Ensure that documents are clear and simple.

備註:為避免產生混淆,以上的中文翻譯節錄自國家通訊傳播委員會 - 無障礙網路空間服務網

參考資料:

於 2008 年 12 月發佈,WCAG 2.0 更廣泛的適用於不同類型的網站技術。 有別於 WCAG 1.0 圍繞在 14 條規範,WCAG 2.0 則以 4 個原則、12 條指引、56 個成功準則、以及 3 個符合等級為架構。

4 個原則 ( principle )

  • 可感知Perceivable
    資訊及使用者介面元件應以使用者能察覺之方式呈現。Information and user interface components must be presentable to users in ways they can perceive.
  • 可操作Operable
    使用者介面元件及導覽功能應具可操作性。User interface components and navigation must be operable.
  • 可理解understandable
    資訊及使用者介面之操作應具可理解性。Information and the operation of user interface must be understandable.
  • 穩健性robust
    網頁內容應可供身心障礙者以輔助工具讀取,並具有相容性。Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

備註:為避免產生混淆,以上的中文翻譯節錄自國家通訊傳播委員會 - 無障礙網路空間服務網

12 條指引 ( guidelines )

在 4 個原則下的則是 12 條指引,提供網頁設計人員應努力實現的基本目標,以便為身心障礙人士提供更易於取得的網頁內容。

  • 1. 可感知 Perceivable
    • 1.1 為任何非文字的內容提供相等意義的替代文字,使這些內容能依人們的需求,轉變成大字版、點字、語音、符號或簡化過的語言等不同型態。 Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.
    • 1.2 針對時序媒體提供替代內容。 Provide alternatives for time-based media.
    • 1.3 建立能以不同方式(例如簡化的版面)呈現,而仍不會喪失資訊或結構的內容。 Create content that can be presented in different ways (for example simpler layout) without losing information or structure.
    • 1.4 讓使用者能更容易地看見及聽到內容、區分前景和背景。 Make it easier for users to see and hear content including separating foreground from background.
  • 2. 可操作 Operable
    • 2.1 讓所有的功能都能透過鍵盤使用。 Make all functionality available from a keyboard.
    • 2.2 提供使用者充分的時間來閱讀及使用內容。 Provide users enough time to read and use content.
    • 2.3 不要用任何已知會引發痙攣的方式來設計內容。 Do not design content in a way that is known to cause seizures.
    • 2.4 提供協助使用者導覽、尋找內容及判斷所在的方法。 Provide ways to help users navigate, find content, and determine where they are.
  • 3. 可理解 Understandable
    • 3.1 讓文字內容可讀並可理解。 Make text content readable and understandable.
    • 3.2 讓網頁以可預期的方式來呈現及運作。 Provide users enough time to read and use content.
    • 3.3 幫助使用者避開及更正錯誤。 Help users avoid and correct mistakes.
  • 4. 穩健性 Robust
    • 4.1 針對目前及未來的使用者代理與輔助科技,最大化其相容性。 Maximize compatibility with current and future user agents, including assistive technologies.

備註:為避免產生混淆,以上的中文翻譯節錄自國家通訊傳播委員會 - 無障礙網路空間服務網

56 個成功準則 ( Success Criteria )

針對每條指引,WCAG 2.0 都提供了一或多個可測試的成功準則,您可以把成功準則視為檢查無障礙網頁內容的項目,這些檢查項目透過機器和人工檢驗,就可知道網頁內容是否符合成功準則。

3 個符合等級 ( Conformance Level )

依據網站內容符合 WCAG 2.0 成功準則的多寡程度,提供了三個等級: A ( 最低 )、AA 和 AAA ( 最高 )。

參考資料:

2013 年 8 月行政院「研究發展考核委員會」以 WCAG 1.0 為範本,配合國內身心障礙者保護政策等相關措施,訂定出屬於我國的無障礙網頁空間開發規範。經過部份的修改與增加,也維持與 WCAG 1.0 相同的 14 條規範,而規範內容再更加細分為 90 條檢測碼,並核定主管機關為「國家通訊傳播委員會」。

2017 年 2 月「國家通訊傳播委員會」依據 WCAG 2.0 訂定「網站無障礙規範 2.0 版」,提供 4 原則、 12 指引,以及 3 個檢測等級,提供網站在規劃、設計、檢測、自我評量和認證等五個階段時,對於網站無障礙開發的需要提供相關的指引。

更多有關「網站無障礙規範 2.0 版」的相關內容,請至:

國家通訊傳播委員會 - 無障礙網路空間服務網

:::
Top