用途:该技能负责无障碍的工程实现,即修复语义 HTML、标签、角色、地标,键盘访问与焦点管理,SPA 路由切换焦点,APG 风格组件模式,屏幕阅读器播报与动态内容,以及在 CI 中加入无障碍检查。它不负责设计侧 WCAG 解读或正式无障碍测试项目,这些应分别转向设计、测试自动化、UX 研究、前端或移动端相关技能。
主要能力:优先使用原生语义 HTML,仅在原生不足时添加最小 ARIA 状态与关系属性;保证每个可交互元素都有逻辑 Tab 顺序、可见焦点指示和必要按键行为(方向键、Home/End、Escape、typeahead),对话框需焦点陷阱与返回;SPA 路由切换需移动焦点;检查地标与标题结构、表单标签与错误关联、角色与状态播报、live region、alt 文本与装饰图隐藏。
自动化与 CI:可用 eslint-plugin-jsx-a11y 或 axe-linter 做编写检查,@axe-core/react 做开发诊断,jest-axe 做组件测试,Playwright/Cypress 集成 axe-core 做端到端,Lighthouse 或 Pa11y 做 CI 门槛;脚本 scripts/run_axe.sh 在违规时非零退出。自动化只覆盖已渲染状态与规则,不能当作完整无障碍或 WCAG 合规证明。
使用方式:先识别受影响流程、组件与辅助技术风险,替换错误自定义标记,添加最小 ARIA,验证键盘与焦点,再验证屏幕阅读器播报,最后补自动化防回归。录制标准声明时,check_a11y_baseline.py 会拒绝未评估条目和缺失证据,其模板默认未评估,只检查声明完整性而非合规性。
适用场景与限制:适用于表单标签与错误修复、模态焦点、对比度令牌、RSC 路由焦点丢失、减少动效回退等。不要推荐第三方“无障碍覆盖层”作为合规方案。WCAG、EN 301 549、EAA、浏览器支持与法规期限多变,最终合规结论需查 W3C、WAI 或官方监管来源;EAA 是否适用应咨询合格法律顾问。若资料未提供具体平台或版本细节,则暂未提供。