無障礙
在 Web 開發中,無障礙性(通常簡稱為 A11y — 發音為“a”,後面跟 11 個字元,最後是“y”)意味著儘可能讓更多的人能夠使用網站,即使這些人的能力在某些方面受到限制。
對許多人來說,技術讓生活更輕鬆。對於殘障人士來說,技術讓生活成為可能。無障礙性意味著要開發儘可能無障礙的內容,無論個人的身體和認知能力如何,以及他們如何訪問 Web。
Web 從根本上就是為了讓所有人都能使用而設計的,無論他們的硬體、軟體、語言、地點或能力如何。當 Web 達到這一目標時,它就能讓具有聽力、運動、視覺和認知能力多樣化的人們都能使用。
– (W3C - 無障礙性)
新手教程
我們的學習 Web 開發 無障礙性模組 包含現代、最新的教程,涵蓋無障礙性基礎知識。
- 什麼是可訪問性?
-
本文作為該模組的開篇,將深入探討什麼是無障礙性——包括我們需要考慮哪些人群以及為什麼,不同的人使用哪些工具與 Web 互動,以及我們如何將無障礙性納入我們的 Web 開發流程。
- 無障礙輔助工具和輔助技術
-
接下來,我們將關注無障礙性工具,提供有關可用於幫助解決無障礙性問題的工具種類,以及殘障人士在瀏覽 Web 時使用的輔助技術的資訊。您將在後續文章中一直使用這些工具。
- HTML:可訪問性的良好基礎
-
透過確保正確使用 HTML 元素來完成其應有的目的,可以使大量的 Web 內容變得無障礙。本文將詳細介紹如何使用 HTML 來確保最大的無障礙性。
- CSS 和 JavaScript 無障礙最佳實踐
-
CSS 和 JavaScript 在正確使用時,也有潛力實現無障礙的 Web 體驗,但如果使用不當,它們會嚴重損害無障礙性。本文概述了一些應考慮的 CSS 和 JavaScript 最佳實踐,以確保即使是複雜的內容也能儘可能無障礙。
- WAI-ARIA 基礎
-
承接上一篇文章,有時,製作涉及非語義化 HTML 和動態 JavaScript 更新內容的複雜 UI 控制元件可能會很困難。WAI-ARIA 是一種可以幫助解決此類問題的技術,它透過新增瀏覽器和輔助技術可以識別和使用的進一步語義,讓使用者瞭解正在發生的事情。在這裡,我們將展示如何以基本方式使用它來提高可訪問性。
- 可訪問的多媒體
-
另一類可能導致無障礙性問題的內容是多媒體——影片、音訊和影像內容需要提供適當的文字替代,以便輔助技術及其使用者能夠理解。本文將介紹如何實現這一點。
- 移動可訪問性
-
隨著移動裝置 Web 訪問的普及,以及 iOS 和 Android 等熱門平臺擁有功能齊全的無障礙工具,考慮您的 Web 內容在這些平臺上的無障礙性非常重要。本文探討了移動裝置特定的無障礙性注意事項。
無障礙性指南
無障礙性指南涵蓋了作者指南、WCAG 合規性、無障礙小部件和導航、移動裝置無障礙性以及其他關鍵主題,這些將幫助您理解為什麼無障礙性對 Web 至關重要以及如何在您的專案中進行改進。
-
本文件列出了有關檢查和修復網站無障礙性問題的指南、法規、操作方法和工具。
- 個性化以幫助安全瀏覽
-
本文討論瞭如何透過利用作業系統內建的個性化和無障礙設定,為患有前庭障礙的人以及支援他們的人使 Web 內容更具無障礙性。
- 無障礙的 Web 應用和元件
-
大多數 JavaScript 庫都提供了一個客戶端小部件庫,可以模仿熟悉的桌面介面的行為。雖然這會生成一個看起來像其桌面對應物的小部件,但標記中通常沒有足夠的語義資訊供輔助技術使用。本文件描述了提高此類小部件無障礙性的技術。
-
到目前為止,希望使基於樣式化的
<div>和<span>的小部件無障礙的 Web 開發人員一直缺乏適當的技術。鍵盤無障礙性是最低無障礙性要求的一部分,開發人員應該瞭解這一點。本文件描述了使 JavaScript 小部件在鍵盤上可訪問的技術。 - 移動裝置無障礙清單
-
本文件為移動應用開發人員提供了一份簡潔的無障礙性要求清單。
- 理解 Web 內容無障礙性指南 (WCAG)
-
一系列文章,提供簡明扼要的解釋,幫助您理解為符合 Web 內容無障礙性指南 (WCAG) 中概述的建議所需的步驟。
- 認知無障礙
-
認知無障礙涵蓋了針對認知和學習障礙人群的無障礙考量。本文介紹了認知無障礙以及如何改進網路對有認知和學習差異人群的無障礙性。
- 無障礙性和空間模式
-
本文件描述了可能導致患有光敏感性癲癇、前庭障礙或其他感知問題的人出現身體症狀的視覺模式。
- Web 可訪問性:理解顏色和亮度
-
雖然理解顏色、亮度和飽和度對所有有視力使用者的設計和可讀性都很重要,但它們對於視力受損、色覺缺陷以及有特定神經、認知和其他障礙的人來說至關重要。
- 網頁癲癇發作和身體反應的無障礙性
-
某些型別的視覺 Web 內容可能會誘發某些腦部疾病患者的癲癇發作。本文幫助您瞭解可能存在問題的內容型別,並找到工具和策略來幫助您避免它們。
- ARIA
-
這是一系列文章,教您如何使用無障礙富網際網路應用程式 (ARIA) 來使您的 HTML 文件更具無障礙性。
參考
- ARIA 參考
-
無障礙富網際網路應用程式 (ARIA) 屬性和角色的參考文件。