无障碍 — 所有文章和教程

数字无障碍首先通过专用工具进行衡量（axe-core、Lighthouse、Pa11y），它们检查 DOM 结构与 ARIA 角色。但WCAG规范中相当一部分规则同样需要从视觉层面进行验证：文本与背景的对比度比例需符合 AA 标准、键盘焦点状态需足够清晰可见、触摸目标尺寸需达到 44 像素、视觉层级需如实反映语义层级。视觉测试并非无障碍审计的替代方案，而是其自然且常被忽视的补充。

本页文章正是探讨这一交叉领域：如何检测调色板重构所引入的对比度回归、如何确认 CSS 更新后焦点状态未消失、如何系统化地从无障碍角度测试深色模式与替代主题、如何将 CI 中的 axe-core 检查与专门针对交互状态的视觉测试相结合。我们也坦诚地讨论其边界——视觉测试无法判断某个aria-label是否措辞恰当，也无法判断屏幕阅读器是否能正确解读结构——但它能有效捕捉那一类代码合法、渲染却已不可用的缺陷。这是一种与专门无障碍工具相辅相成的互补方法，而非彼此竞争的关系。