跳转到使用指南
wcag-audit-patterns作者 Seth Hobson

WCAG Audit Patterns Skill.

Claude Code 和 Codex 的设计审查 skill:WCAG 2.2 审计,包含自动化测试、手动检查和修复指南。

  • Design Review & Accessibility
  • 审查报告
wshobson/agents · plugins/accessibility-compliance/skills/wcag-audit-patterns/SKILL.mdSKILL.md
--- name: wcag-audit-patterns description: Conduct WCAG 2.2 accessibility audits with automated testing, manual verification, and remediation guidance. Use when auditing websites for accessibility, fixing WCAG violations, or implementing accessible design patterns. --- ## When to Use This Skill ## Core Concepts ## Detailed patterns and worked examples ## Best Practices
从上游文件读取的 front matter 和章节标题,日期 2026-09-14 · 完整内容 2,439 字符

01 功能说明

wcag-audit-patterns Skill 在 Claude Code 和 Codex 中的作用

摘要、工作流与产物,均读自该 skill 的 SKILL.md。

来自 SKILL.md读取于 2026-09-14 · 非实际运行记录

以 skill 自身的术语

该 skill 结合自动化测试、人工验证与修复指导,进行 WCAG 2.2 无障碍审查。它按影响程度对违规问题分类(严重/阻断项,重大,中等),涵盖三个合规级别(A 为法律基线,AA 适用于大多数法规,AAA 面向专项需求),并应用 POUR 原则(可感知、可操作、可理解、健壮性)。

该 skill 处理常见违规问题,包括缺失的替代文本、键盘访问问题、色彩对比度不足以及标题层级不当。它强调语义化 HTML、与残障用户进行真实用户测试,并构建可访问的组件库,同时认识到仅有 30%–50% 的问题可通过自动化检测发现。

它产出什么

  • 针对已识别违规问题的可执行修复策略
  • 可访问组件库文档
查看示例提示词 ↗

工作方式

  1. 01
    按影响程度对违规问题分类

    问题被分类为严重(阻断项,如缺失替代文本和无键盘访问)、重大(对比度不足、缺失跳转链接)或中等(缺失语言属性、链接文本不明确)。

  2. 02
    应用 POUR 原则

    依据四项原则进行审查:可感知(用户能否感知内容)、可操作(用户能否操作界面)、可理解(用户能否理解内容)以及健壮性(是否兼容辅助技术)。

  3. 03
    结合自动化测试与人工测试

    自动化工具可检测 30%–50% 的问题,但要实现全面覆盖,仍需人工测试。

  4. 04
    参考详细的模式文档

    当核心概念不足以解决问题时,该 skill 会引导至 references/details.md,查阅实例与深入的模式指导。

02 找到适合场景

何时使用 wcag-audit-patterns Skill

当工作是此类设计审查时,在 Claude Code 或 Codex 中使用 wcag-audit-patterns skill。适用范围和限制如下,取自该 skill 自己的文件。

适合场景

  • 对网页内容进行无障碍审查
  • 修复现有界面中的 WCAG 违规问题
  • 满足 ADA 或 Section 508 法规要求
  • 为无障碍诉讼做准备
  • 完成 VPAT 合规文档

    03 Skill 内部

    wcag-audit-patterns Skill 给 Claude Code 和 Codex 的规则

    SKILL.md 为 Agent 设定的 8 条具体指令、默认值与限制——文件中真正改变结果的部分。

    1. 在设计阶段就开始考虑无障碍

      无障碍性必须在设计阶段早期纳入,而不是作为事后补救。

    2. 优先使用语义化 HTML

      原生 HTML 元素应作为默认选择,因为它们能减少对 ARIA 的依赖,并提供更好的无障碍支持。

    3. 永远不要仅依赖自动化测试

      由于自动化工具只能检测出 30%–50% 的无障碍问题,因此必须进行人工测试。

    4. 原生 HTML 优先于 ARIA

      不应将 ARIA 作为首选方案,应尽可能优先使用原生 HTML 元素。

    5. 保留焦点轮廓

      焦点轮廓不能被隐藏,因为键盘用户依赖它们进行导航。

    6. 永远不要禁用缩放

      用户必须能够调整内容大小,因此不能禁用缩放功能。

    7. 除颜色外的多重指示

      不能仅用颜色传达信息,必须提供多重指示。

    8. 与残障用户一起测试

      残障用户的真实反馈最有价值,测试时应纳入他们。

    04 投入使用

    在 Claude Code 或 Codex 中安装 wcag-audit-patterns

    一条 npx skills add 命令,然后在你的 Agent 中执行第一个任务和对结果的清单检查。

    将 wcag-audit-patterns 添加到 Claude Code、Codex 或您的 Agent

    在你的项目中运行;安装程序会询问要把它添加到哪个 Agent。

    Terminal
    npx skills add https://github.com/wshobson/agents --skill wcag-audit-patterns

    针对 plugins/accessibility-compliance/skills/wcag-audit-patterns/SKILL.md 的通用 skills CLI 形式;仓库可能会记录其自身路径。

    为 Skill 提供第一个设计审查任务

    按 skill 自身的术语撰写;把括号中的部分换成你的内容。

    Starter prompt
    Audit [website URL or component name] against WCAG 2.2 AA standards. Identify all Critical and Serious violations including missing alt text, keyboard access issues, and color contrast failures. For each violation, provide the specific WCAG success criterion, the impact on users with disabilities, and concrete remediation code. Prioritize issues that would block screen reader users.

    来源:依据 SKILL.md,按 skill 自身的术语撰写。

    检查首次结果

    SKILL.md 本身如何描述正确的结果:

    • 验证与辅助技术的兼容性,以实现稳健的实现

    在 OpenDesign 中通过其 SKILL.md 链接导入 wcag-audit-patterns:Plugins → Add → Skill → Import from link,然后在顶部栏中选择它。

    05 开源、可追溯

    来源、许可与验证

    本页面事实的来源,以及最后检查时间。

    Repository
    github.com/wshobson/agents 分支 main
    Skill 文件
    plugins/accessibility-compliance/skills/wcag-audit-patterns/SKILL.md 内容校验和已在验证时记录;提交 4236bb9
    License
    MIT 来自 LICENSE。
    仓库星标数
    39,635 GitHub 快照拍摄于 2026-09-14,涵盖整个 wshobson/agents 仓库,其中包含此目录中的 18 个 skill。这不是 wcag-audit-patterns 的评分或使用次数。
    已由 OpenDesign 验证
    2026-09-14 已检查源文件、路径、许可文本和 star 数量。未内置在 OpenDesign 主程序(检查日期 2026-08-28);本页面未记录实际运行。

    SKILL.md 内部

    1. 何时使用此 skill列出六种场景,包括审计、修复违规项以及满足监管要求
    2. 核心概念定义了三个合规级别、POUR 原则以及按影响分类的常见违规项
    3. WCAG 合规级别A 级为法律基线,AA 级为监管标准,AAA 级用于特殊需求
    4. POUR 原则四项原则:可感知、可操作、可理解、稳健,附带指导性问题
    5. 按影响分类的常见违规项将问题分类为严重阻断项、重大问题或中等问题,并给出具体示例
    6. 详细模式与实例指向 references/details.md 以获取深入的模式文档
    7. 最佳实践列出五项应做和五项不应做的无障碍开发事项
    Skill 自身的描述
    "通过自动化测试、人工验证和修复指导进行 WCAG 2.2 无障碍审计。适用于网站无障碍审计、修复 WCAG 违规问题或实现无障碍设计模式。"

    来自 SKILL.md 的前置描述。完整文件约 2,439 字符。在 GitHub 上阅读完整文件。

    06 安装之前

    关于 wcag-audit-patterns Skill 的常见问题

    以下回答来自 2026-09-14 读取到的 SKILL.md,而非某次实际运行的记录。

    我应该以哪个 WCAG 合规级别为目标?

    AA 级是大多数监管要求所需的标准合规级别。A 级是最低法律基线,而 AAA 级仅在特殊需求下才有必要。大多数 ADA 和 Section 508 要求在 AA 合规下即可满足。

    WCAG Audit Patterns

    在真实的设计审查任务中运行 wcag-audit-patterns。

    下载 OpenDesign,从 SKILL.md 链接导入 wcag-audit-patterns,粘贴上述提示,在查看结果前先阅读计划。

    终端
    npx skills add https://github.com/wshobson/agents --skill wcag-audit-patterns

    OpenDesign 桌面客户端

    一套设计系统,让每一次创作都保持品牌一致

    在完整的 Vibe Design Workspace 中,用同一套品牌规则生成网页、PPT、可交互原型、数据看板、图像与 HTML 视频。连接本地 Codex、Claude Code、Cursor 等编程助手,即可免费创作。

    • 覆盖网页、PPT、原型、数据看板、图像与视频
    • 140+ 设计系统,以及完整模板与技能库
    • 连接本地 Codex 与 21+ 款编程助手 · 免费使用
    免费下载

    支持 macOS 与 Windows