Web Accessibility Auditor 综合评估
核心用法
本 Skill 专注于 WCAG 2.1（Web Content Accessibility Guidelines）合规性审计，覆盖四大关键维度：
1. 色彩对比度检测
- 自动计算文本与背景色的对比度比值
- 依据 WCAG AA（4.5:1 正文，3:1 大文本）与 AAA（7:1/4.5:1）标准分级
- 输出具体数值与修复建议色值
2. ARIA 标签审计
- 验证
role属性的语义正确性 - 检查
aria-label、aria-labelledby、aria-describedby的关联完整性 - 识别冗余 ARIA（如原生 HTML 元素已具备语义时）
- 检测动态内容区域的
aria-live配置
3. 键盘导航测试
- 验证 tabindex 逻辑与焦点顺序
- 检测焦点可见性（focus indicator）
- 确认所有交互元素可通过键盘触发
- 识别键盘陷阱（keyboard trap）
4. 屏幕阅读器支持
- 检查表单标签关联（
<label>与for属性） - 验证图像替代文本（alt 属性）
- 分析标题层级（heading outline）的连续性
- 检测链接/按钮的上下文独立性
显著优点
| 优势 | 说明 |
|------|------|
| **法律合规性** | 直接对应 ADA（美国）、EAA（欧盟）等法规要求，降低诉讼风险 |
| **用户体验提升** | 不仅服务残障用户，也优化老年用户、临时性障碍（如手臂受伤）场景 |
| **SEO 协同效应** | ARIA 标签与语义化 HTML 同时提升搜索引擎理解 |
| **可量化输出** | 提供具体对比度数值、违规代码定位，便于工程排期 |
潜在缺点与局限性
1. 自动化边界：仅能检测约 25-30% 的 WCAG 准则（主要为 1.4.3 对比度、4.1.2 名称-角色-值等），复杂交互逻辑（如自定义下拉菜单的行为一致性）需人工测试
2. 动态内容盲区：SPA 框架（React/Vue）中异步渲染的内容可能不在初始审计范围内
3. 假阳性问题：某些设计意图下的"违规"（如装饰性元素的 alt=""）需人工复核
4. 框架适配成本：原生 HTML 审计规则与组件库（如 Material-UI、Ant Design）的封装层级存在映射差距
适合人群
- 前端工程师：在 CI/CD 中集成自动化门禁
- UX/UI 设计师：验收阶段的合规预检
- 产品经理：法务驱动的 accessibility roadmap 规划
- 测试工程师：补充自动化测试套件的可访问性维度
常规风险
| 风险等级 | 场景 | 缓解建议 |
|---------|------|---------|
| 中 | 过度依赖自动化结果，忽略真实辅助技术测试 | 结合 NVDA/JAWS/VoiceOver 实际走查 |
| 低 | 修复建议与品牌视觉规范冲突 | 提供多档合规配色方案供设计选择 |
| 中 | 遗留系统的渐进式改造 ROI 争议 | 优先修复阻断性障碍（blocking issues）|