什麼是可訪問性?
本文以深入瞭解什麼是無障礙性為開端,本概述涵蓋了我們需要考慮哪些群體以及原因、不同人群使用哪些工具與網路互動,以及如何將無障礙性納入我們的 Web 開發工作流程。
| 先決條件 | 對 HTML 和 CSS 的基本瞭解。 |
|---|---|
| 目標 | 熟悉無障礙性,包括什麼是無障礙性以及它如何影響您作為 Web 開發人員的工作。 |
什麼是可訪問性?
無障礙性是指使您的網站儘可能多的人都能使用。我們傳統上認為這是關於殘疾人的,但使網站無障礙的做法也惠及其他群體,例如使用移動裝置的人或網路連線速度慢的人。
您也可以將無障礙性視為平等對待所有人,並給予他們平等的機會,無論他們的能力或環境如何。正如將輪椅使用者排除在實體建築之外是錯誤的(現代公共建築通常設有輪椅坡道或電梯)一樣,將殘疾人排除在網站之外也是錯誤的。我們都有所不同,但我們都是人,因此擁有相同的人權。
無障礙性是應該做的事情。在某些國家,提供無障礙網站是法律義務,這可以開啟一些原本無法使用您的服務或購買您的產品的巨大市場。
構建無障礙網站對每個人都有利
- 語義化 HTML 既改善了無障礙性,也改善了 SEO,使您的網站更容易被發現。
- 關注無障礙性體現了良好的道德和道德,這將改善您的公眾形象。
- 其他改善無障礙性的良好做法也使您的網站更適合其他群體使用,例如手機使用者或網路速度慢的使用者。實際上,每個人都可以從許多這樣的改進中受益。
- 我們還提到它在某些地方是法律規定嗎?
我們關注哪些型別的殘疾?
殘疾人與非殘疾人一樣多樣化,他們的殘疾也是如此。這裡的主要教訓是,要跳出自己的電腦以及您如何使用網路的思維定勢,開始瞭解其他人如何使用網路 - *您不是您的使用者*。以下是主要型別的殘疾以及他們使用的一些特殊工具訪問 Web 內容(稱為**輔助技術**或**AT**)。
**注意:**世界衛生組織的 殘疾與健康 事實說明指出,“超過 10 億人,約佔世界人口的 15%,存在某種形式的殘疾”,並且“1.1 億至 1.9 億成年人存在嚴重的功能障礙”。
視障人士
視障人士包括盲人、弱視和色盲。許多視障人士使用螢幕放大鏡,可以是物理放大鏡或軟體縮放功能。如今,大多數瀏覽器和作業系統都具有縮放功能。一些使用者將依賴於螢幕閱讀器,螢幕閱讀器是一種將數字文字朗讀出來的軟體。一些螢幕閱讀器示例包括
- 付費商業產品,例如 JAWS(Windows)和 Dolphin Screen Reader(Windows)。
- 免費產品,例如 NVDA(Windows)、ChromeVox(Chrome)和 Orca(Linux)。
- 內置於作業系統中的軟體,例如 VoiceOver(macOS、iPadOS、iOS)、Narrator(Windows)、ChromeVox(在 ChromeOS 上)和 TalkBack(Android)。
熟悉螢幕閱讀器是一個好主意;您還應該設定一個螢幕閱讀器並進行試驗,以瞭解它的工作原理。有關使用它們的更多詳細資訊,請參閱我們的 跨瀏覽器測試螢幕閱讀器指南。以下影片還提供了一個簡要示例,說明了這種體驗。
在統計方面,世界衛生組織估計,“全球估計有 2.85 億人視力受損:3900 萬人失明,2.46 億人視力低下”。(見 視力障礙和失明)。這是一個龐大且重要的使用者群體,僅僅因為您的網站程式碼不正確而錯過他們——幾乎與美利堅合眾國的人口規模相同。
聽障人士
聾啞人和聽力障礙者 (DHH) 的聽力損失程度各不相同,從輕微到嚴重。儘管有些人確實使用 AT(見 聽力、語音、言語或語言障礙者的輔助裝置),但它們並不普遍。
為了提供訪問許可權,必須提供文字替代方案。影片應手動加字幕,並應為音訊內容提供文字記錄。此外,由於 DHH 人群中 語言剝奪 的高水平,應考慮 文字簡化。
聾啞人和聽力障礙者也代表著重要的使用者群——“全球有 4.66 億人存在致殘性聽力損失”,世界衛生組織的 聾啞和聽力損失 事實說明如是說。
有行動障礙的人
這些人存在運動方面的殘疾,這可能涉及純粹的物理問題(例如肢體喪失或癱瘓),也可能涉及導致肢體無力或失去控制的神經/遺傳疾病。有些人可能難以做出使用滑鼠所需的精確手部動作,而另一些人可能受到更嚴重的影響,也許是嚴重癱瘓,以至於需要使用 頭部指標 與電腦互動。
這種殘疾也可能是衰老而不是任何特定的創傷或疾病的結果,也可能是硬體限制造成的——一些使用者可能沒有滑鼠。
這通常影響 Web 開發工作的方式是要求透過鍵盤訪問控制元件——我們將在本模組的後續文章中討論鍵盤無障礙性,但最好嘗試使用鍵盤訪問一些網站,看看結果如何。例如,您可以使用 Tab 鍵在 Web 表單的不同控制元件之間移動嗎?您可以在我們的 跨瀏覽器測試使用原生鍵盤無障礙性 部分找到有關鍵盤控制元件的更多詳細資訊。
在統計方面,有行動障礙的人數不少。美國疾病控制與預防中心 殘疾和功能(18 歲及以上非機構化成年人) 報告美國“任何身體功能障礙的成年人百分比:16.1%”。
有認知障礙的人
認知障礙是指範圍廣泛的殘疾,從智力障礙者(他們擁有最有限的能力)到我們所有人隨著年齡的增長而遇到的思維和記憶困難。範圍包括患有精神疾病的人,例如 抑鬱症 和 精神分裂症。它還包括有學習障礙的人,例如 閱讀障礙 和 注意力缺陷多動障礙。重要的是,儘管認知障礙的臨床定義存在很大差異,但患有認知障礙的人會遇到一系列共同的功能問題。這些問題包括理解內容困難、記住如何完成任務以及網頁佈局不一致造成的困惑。
為有認知障礙的人建立一個良好的無障礙基礎包括
- 以多種方式提供內容,例如透過文字轉語音或影片。
- 易於理解的內容,例如使用普通語言標準編寫的文字。
- 將注意力集中在重要內容上。
- 最大程度地減少干擾,例如不必要的內容或廣告。
- 一致的網頁佈局和導航。
- 熟悉的元素,例如未訪問時為藍色、訪問後為紫色的帶下劃線的連結。
- 將流程劃分為邏輯的、必要的步驟,並提供進度指示器。
- 儘可能輕鬆地進行網站身份驗證,而不會損害安全性。
- 使表單易於填寫,例如提供清晰的錯誤訊息和簡單的錯誤恢復。
註釋
- 使用 認知無障礙性 進行設計將帶來良好的設計實踐。它們將使每個人受益。
- 許多有認知障礙的人也患有身體殘疾。網站必須符合 W3C 的 Web 內容無障礙指南,包括 認知無障礙指南。
- W3C 的 認知和學習障礙無障礙工作組 為有認知障礙的人制定 Web 無障礙指南。
- WebAIM 有一頁關於相關資訊和資源的 認知 頁面。
- 美國疾病控制與預防中心估計,截至 2018 年,四分之一的美國公民存在殘疾,而 認知障礙是年輕人中最常見的殘疾。
- 在美國,一些智力殘疾在歷史上被稱為“智力遲鈍”。現在許多人認為這個詞帶有貶義,因此應避免使用它。
- 在英國,一些智力殘疾被稱為“學習障礙”或“學習困難”。
在專案中實施可訪問性
一個常見的無障礙神話是,無障礙性是專案中要實施的昂貴的“額外附加”。這個神話實際上 *可以* 是真的,如果
- 您試圖將無障礙性“追溯地”應用到現有的存在重大無障礙問題網站上。
- 您只在專案後期才開始考慮無障礙性,並發現了相關問題。
但是,如果您從專案的開始就考慮無障礙性,那麼使大多數內容無障礙的成本應該相當低。
在規劃專案時,將無障礙測試納入您的測試流程,就像測試任何其他重要的目標受眾群體(例如,目標桌面或移動瀏覽器)一樣。儘早且頻繁地進行測試,理想情況下執行自動化測試來發現可透過程式設計檢測到的缺失功能(例如缺失的影像替代文字或不良連結文字 - 請參見元素關係和上下文)並與殘疾人使用者群體進行一些測試,以瞭解更復雜的網站功能對他們的適用性。例如
- 我的日期選擇器小部件能否被使用螢幕閱讀器的人使用?
- 如果內容動態更新,視障人士是否知道?
- 我的 UI 按鈕能否被鍵盤和觸控介面使用者訪問?
您可以並且應該記錄內容中需要進行工作以使其無障礙的潛在問題區域,確保對其進行徹底測試,並考慮解決方案/替代方案。文字內容(正如您將在下一篇文章中看到的那樣)很簡單,但是您的多媒體內容和炫酷的 3D 圖形呢?您應該檢視您的專案預算,並考慮哪些解決方案可以使此類內容無障礙。將所有多媒體內容轉錄是一個選項,儘管價格昂貴,但卻是可行的。
此外,要現實一點。“100% 無障礙”是一個無法實現的理想目標 - 您總能遇到某種邊緣情況,導致某些使用者發現某些內容難以使用 - 但您應該盡力而為。如果您計劃使用 WebGL 建立炫酷的 3D 餅圖圖形,您可能需要包含一個數據表作為資料的無障礙替代表示。或者,您可能只想包含表格並刪除 3D 餅圖 - 表格對每個人都可訪問,編碼更快,CPU 佔用率更低,並且更容易維護。
另一方面,如果您正在製作一個展示有趣 3D 藝術品的畫廊網站,那麼期望每一件藝術品都完全對視障人士無障礙是不合理的,因為這是一種完全視覺化的媒介。
為了表明您關心並已考慮了無障礙性,請在您的網站上釋出一份無障礙宣告,詳細說明您對無障礙性的政策以及您為使網站無障礙所採取的措施。如果有人通知您您的網站存在無障礙性問題,請與他們開始對話,要有同理心,並採取合理的措施來嘗試解決問題。
注意:我們的處理常見無障礙性問題文章涵蓋了應更詳細測試的無障礙性細節。
總結
- 從專案的開始就考慮無障礙性,並儘早且頻繁地進行測試。就像任何其他錯誤一樣,越晚發現無障礙性問題,修復成本就越高。
- 請記住,許多無障礙最佳實踐不僅對殘疾人使用者有利,對所有使用者都有利。例如,簡潔的語義化標記不僅對螢幕閱讀器有利,而且載入速度快,效能好。這對所有人都有利,尤其是那些使用移動裝置和/或網路連線速度慢的人。
- 在您的網站上釋出一份無障礙宣告,並與遇到問題的人員互動。
可訪問性指南和法律
有許多清單和指南集可用於進行無障礙性測試,乍一看可能會讓人不知所措。我們的建議是熟悉您需要注意的基本領域,並瞭解與您最相關的指南的高階結構。
- 首先,W3C 釋出了一份大型且非常詳細的文件,其中包含非常精確的、與技術無關的無障礙性一致性標準。這些標準被稱為Web 內容無障礙指南(WCAG),它們絕非短篇閱讀材料。這些標準被分成四個主要類別,這些類別指定了如何使實現變得可感知、可操作、可理解和健壯。瞭解入門和開始學習的最佳地方是WCAG 概覽。無需學習所有 WCAG 標準 - 瞭解主要關注領域,並使用各種技術和工具突出顯示任何不符合 WCAG 標準的領域(有關更多資訊,請參見下文)。
- 您的國家/地區也可能制定了特定法律,規定為其人口服務的網站必須無障礙 - 例如歐盟的EN 301 549,美國《康復法》第 508 條,德國《無障礙資訊科技聯邦條例》,英國《2018 年無障礙條例》,義大利Accessibilità,澳大利亞《殘疾歧視法》等等。W3C 會保留一份按國家/地區列出的網路無障礙法律和政策清單。
因此,雖然 WCAG 是一套指南,但您的國家/地區可能制定了有關網路無障礙性的法律,或者至少制定了有關向公眾提供服務的無障礙性的法律(可能包括網站、電視、物理空間等)。瞭解您的法律是件好事。如果您沒有努力檢查您的內容是否無障礙,如果有人投訴,您可能要承擔法律責任。
這聽起來很嚴重,但實際上您只需要將無障礙性視為網路開發實踐的主要優先事項,如上所述。如有疑問,請諮詢合格的律師。我們不會提供比這更多的建議,因為我們不是律師。
可訪問性 API
網路瀏覽器使用特殊的無障礙 API(由底層作業系統提供),這些 API 公開對輔助技術(AT)有用的資訊 - AT 通常利用語義資訊,因此此資訊不包括樣式資訊或 JavaScript。此資訊在稱為無障礙樹的資訊樹中進行組織。
不同的作業系統提供了不同的無障礙 API
- Windows:MSAA/IAccessible、UIAExpress、IAccessible2
- macOS:NSAccessibility
- Linux:AT-SPI
- Android:無障礙框架
- iOS:UIAccessibility
在您的網路應用程式中 HTML 元素提供的原生語義資訊不足的情況下,您可以使用來自WAI-ARIA 規範的功能對其進行補充,這些功能向無障礙樹新增語義資訊以改進無障礙性。您可以在我們的WAI-ARIA 基礎知識文章中瞭解更多有關 WAI-ARIA 的資訊。