accessibility-review

用途

Accessibility Review 用于对网页内容、组件和应用进行人工无障碍审查，评估依据为 WCAG 2.1/2.2 AA 标准。审查聚焦于实用且现代的常见无障碍要求，避免过度吹毛求疵。

适用请求

当用户提出以下类型的问题时使用该技能：

"这个是否无障碍？"
"能帮我审查一下颜色对比度吗？"
"检查这个组件的无障碍问题"
"这符合无障碍标准吗？"
任何要求审查、检查或验证无障碍性的请求

主要能力

审查流程

1. 确定审查目标

确定需要审查的对象，可能是：特定组件（按钮、表单、模态框等）、完整页面或应用、代码文件或文件集合、设计稿或截图。

2. 执行人工审查

使用 references/wcag-checklist.md 中的 WCAG 检查清单，系统性对照现代无障碍标准审查目标。重点关注最常见且影响最大的问题：

可感知性：颜色对比度、文本替代、语义结构
可操作性：键盘导航、焦点管理、交互元素
可理解性：清晰标签、错误处理、一致导航
健壮性：有效 HTML、ARIA 使用、兼容性

3. 划分问题优先级

将每个问题分类：

严重问题（Critical）——阻止用户访问核心功能：

有意义的图片缺少替代文本
交互元素无法通过键盘访问
颜色对比度不足（普通文本低于 4.5:1，大号文本低于 3:1）
表单缺少正确标签
缺少焦点指示器
模态/对话框模式不可访问
自动播放媒体没有控件

警告（Warning）——会造成摩擦但不会完全阻断访问：

标题层级不理想（跳级）
缺少 ARIA 地标
脱离上下文后链接文本含义不清
冗余或不必要的 ARIA
触摸目标小于 44x44px
缺少跳转链接
错误信息描述不清

4. 分步审查（每次一个问题）

重要：不要一次呈现所有发现。逐个审查问题，等待用户决定后再继续。

4.1 从概览开始

先告知用户共发现多少问题：

Found [X] accessibility issues ([Y] critical, [Z] warnings).

Let's review them one at a time. I'll present each issue with a recommended fix, and you can decide to:

Fix — I'll implement the change
Ignore — Tell me why, and I'll note it

Starting with critical issues first.

4.2 逐个呈现问题

每个问题按以下格式单独呈现：

─────────────────────────────────── Issue [1/X]: [Critical/Warning] ───────────────────────────────────

Problem: [Clear description of the issue]

Location: file_path:line_number [Show the relevant code snippet]

Impact: [How this affects users — be specific about who and how]

Recommended Fix: [Specific code change or approach]

─────────────────────────────────── Fix this issue, or ignore? (If ignoring, please share why)

4.3 处理用户响应

若用户说 "fix"：实施修复，确认 "Fixed. [Brief description of what changed]"，进入下一个问题。

若用户说 "ignore" 并给出理由：确认 "Noted — ignoring because: [their reason]"，记录该决定，进入下一个问题。

若用户说 "ignore" 但未给理由：询问 "Got it. Quick note on why? (Helps for future reference)"，接受任何回复后继续。

4.4 跟踪决定

审查过程中持续记录计数，完成后给出汇总。

5. 最终汇总

审查完所有问题后，呈现汇总：