:::
給開發者的 ARIA Patterns:先用原生 HTML,再補 ARIA
ARIA 可以補足複雜元件語意,但錯誤 ARIA 會更糟。用 W3C APG Patterns 檢查 tabs、dialog、accordion、menu button 等互動模式。
重點摘要
- No ARIA is better than Bad ARIA。
- 能用原生 HTML 就先用原生 HTML;只有原生語意不足時才補 ARIA。
- 使用 APG Patterns 時,要同時實作鍵盤操作、焦點管理與狀態更新。
不要只複製 role
ARIA 只改變輔助科技接收到的語意,不會自動補上鍵盤操作。role="button" 不會讓 div 自動支援 Enter 或 Space。
建議做法
從 W3C APG Patterns 找到對應模式,再確認鍵盤、焦點、名稱、角色與狀態都和實際互動一致。
相關頁面
- Accesserty DevCheck
用瀏覽器內工具檢查本機、測試站、登入後頁面與互動狀態。
- ARIA 術語頁
- Accesserty UI Kit