用途:对真实前端代码做可访问性审计,并按优先级实施修复,使键盘用户、屏幕阅读器用户和低视力用户可用。适用审计、WCAG合规、键盘与焦点行为、ARIA与屏幕阅读器支持、对比度失败、无障碍表单/弹窗/菜单、替代文本与字幕。若实际需求是配色体系设计、动作安全实现、错误文案UX或组件重构,应转交对应技能。
使用方式:先检查代码库——搜索 aria-、role=、alt=、tabIndex、<main、<nav、<button、div/span 上的 onClick、outline: none、label/htmlFor,并盘点表单、弹窗、菜单、选项卡、工具提示等交互面;若有可运行环境可跑 axe-core/Lighthouse 作基线。默认按 WCAG 2.2 AA 审计,除非用户有明确合规期限或特殊受众要求。
主要能力:按 POUR 检查点审计并标注严重度(阻断、严重、中等、轻微),按顺序修复。关键阈值:正文对比度≥4.5:1,大字≥3:1,非文本UI与焦点指示≥3:1;指针目标≥24×24 CSS px;全部操作可键盘完成、焦点可见、无 tabindex>0、无焦点陷阱(可逃逸弹窗除外);每秒闪烁不超过3次。修复规则:能用原生元素替代 div onClick 就替代;弹窗/菜单/组合框优先采用现有无头库或原生 dialog;对比度改在令牌源头;阻断性错误用 role="alert",后台状态用 aria-live="polite";可见 label for 优先于 aria-label。
交付物:已实现修复代码,加一份 Markdown 审计报告(范围与目标、发现表格含严重度/WCAG条款/位置/修复/状态、已验证项、未验证项与需用户操作项、反复出现的根因)。验证包括键盘走查、自动重扫、200%缩放与无障碍树检查,并如实说明未验证内容(如 VoiceOver/NVDA 实测)。
限制:自动扫描只能覆盖约三分之一到一半真实问题;不得由自动扫描宣称“符合WCAG”;不得在原生元素可用时堆叠ARIA;不得在无等价替代时移除焦点轮廓;不得为修对比度发明一次性颜色。参考资料 references/checkpoints.md 提供完整 POUR 检查表与规范模式。