輔助功能測試功能

  • 發行項

本文列出測試網頁的一般輔助功能層面，以及 Microsoft DevTools 中的對應功能。

影像的替換文字

要檢查的輔助功能層面 DevTools 的功能 文章
確認影像具有替換文字 報表的 [問題工具>輔助功能] 區段 確認影像在[自動測試網頁的輔助功能問題] 中有替換文字
確認影像具有替換文字 Lighthouse 工具 > 關於 alt-text 的問題 使用 Lighthouse 測試輔助功能

鍵盤支援

要檢查的輔助功能層面 DevTools 的功能 文章
確認鍵盤支援 檢查 重疊的工具 >輔助功能 區段 使用檢查工具來偵測輔助功能問題，方法是將滑鼠停留在網頁上 ，並 使用檢查工具分析 HTML 頁面
確認鍵盤支援 Tab、 Shift+Tab 和 Enter 鍵 使用索引標籤和 Enter 鍵檢查鍵盤支援
確認鍵盤支援：確認已指出焦點 檢查 工具、 樣式索引 標籤和 來源 工具 分析鍵盤焦點的不足指示
驗證鍵盤支援：確認窗體按鈕可以與鍵盤搭配使用 檢查工具、[元素] 工具中的 DOM 樹狀結構，以及 [事件接聽程式] 索引標籤 分析表單中缺少鍵盤支援
驗證鍵盤支援：確認 Tab 鍵順序 元素 工具 >輔助功能索引 標籤 >來源順序查看器 使用來源順序查看器測試鍵盤支援
確認鍵盤支援 Lighthouse 工具 > 鍵盤支持的相關問題 使用 Lighthouse 測試輔助功能

文字對比

要檢查的輔助功能層面 DevTools 的功能 文章
確認文字對於整個頁面的 (自動有足夠的對比) 報表的 [問題工具>輔助功能] 區段 確認文字色彩在自動測試網頁的輔助功能問題中有足夠的對比
確認文字有足夠的對比 元素 工具 >樣式索引 標籤 >色彩選擇器 使用色彩選擇器測試文字色彩對比
確認文字有足夠的對比 檢查重迭>對比度數據列的工具>輔助功能區段 使用檢查工具來偵測輔助功能問題，方法是將滑鼠停留在網頁上 ，並 使用檢查工具分析 HTML 頁面
確認文字有足夠的對比：處於暫留狀態 專案 工具 樣 >式 索引標籤 >切換項目狀態 (顯示 [強制元素狀態 ] 複選框) 確認元素所有狀態的存取範圍
確認文字有足夠的對比：深色主題 (深色模式) 和淺色主題 轉譯 工具 >模擬 CSS 媒體功能偏好色彩配置 檢查深色主題和淺色主題的對比問題
確認文字對於整個頁面的 (自動有足夠的對比) Lighthouse 工具 > 文字對比的相關問題 使用 Lighthouse 測試輔助功能

螢幕助讀程序支援

要檢查的輔助功能層面 DevTools 的功能 文章
驗證螢幕助讀程式支援：確認輸入欄位具有標籤 報表的 [問題工具>輔助功能] 區段 確認輸入欄位在自動測試網頁是否有輔助功能問題中具有標籤
確認螢幕助讀程序支援 檢查重疊>名稱和角色的工具>輔助功能區段 使用檢查工具來偵測輔助功能問題，方法是將滑鼠停留在網頁上 ，並 使用檢查工具分析 HTML 頁面
確認螢幕助讀程序支援 元素 工具 >輔助功能索引 標籤 >輔助功能樹狀結構 檢查輔助功能樹狀結構以取得鍵盤和螢幕助讀程序支援，並 使用 [輔助功能] 索引卷標測試輔助功能
確認螢幕助讀程序支援 Lighthouse 工具 > 螢幕助讀程式支援的相關問題 使用 Lighthouse 測試輔助功能

視覺缺陷

要檢查的輔助功能層面 DevTools 的功能 文章
確認網頁可供色盲人士使用 轉譯 工具 >模擬視覺缺陷 下拉式清單 確認頁面可供色盲人士使用
確認網頁可搭配模糊視覺使用 轉譯 工具 >模擬視覺缺陷 下拉式清單 確認頁面可搭配模糊視覺使用
確認網頁可使用，並關閉UI動畫 (減少動作) 轉譯 工具 >模擬 CSS 媒體功能偏好精簡動作 確認頁面可使用且已關閉UI動畫
確認具有視覺缺陷的人員可以使用網頁 Lighthouse 工具 > 關於視覺缺陷的問題 使用 Lighthouse 測試輔助功能

可在縮小時使用

要檢查的輔助功能層面 DevTools 的功能 文章
確認網頁版面配置可在縮小時使用 裝置模擬 工具 確認網頁版面設定可在縮小時使用，並 模擬行動裝置 (裝置模擬)

另請參閱