accessibility

WCAG 2.1 AA 合规开发指南

🥥55总安装量 13评分人数 7
100% 的用户推荐

基于 WCAG 2.1 AA 标准,提供语义 HTML 与 ARIA 实践,助构建无障碍合规的数字界面。

A

基本安全,请在特定环境下使用

  • 来自社区或个人来源,建议先隔离验证
  • ✅ 纯文档型资产,无可执行脚本,零代码注入风险
  • ✅ 无网络通信与数据传输,本地离线使用保障隐私
  • ✅ 无危险函数调用(无 eval/exec/system),代码示例仅为教学演示
  • ⚠️ T3 来源(个人开发者),建议结合官方 WCAG 文档交叉验证
  • ⚠️ 代码示例需手动集成,使用前请根据项目实际技术栈调整适配

使用说明

Web Accessibility (WCAG 2.1 AA) 是一个专注于构建包容性数字体验的开发者指南技能,基于 W3C 权威标准提供系统化的无障碍开发解决方案。

核心用法:该技能通过五步流程法指导开发者实现 WCAG 2.1 AA 合规:首先强制使用语义化 HTML 替代通用 div,确保按钮、链接等交互元素具备原生可访问性;其次在 HTML 语义不足时补充 ARIA 属性(如 aria-label、aria-live);第三步实现完善的键盘导航系统,包括焦点陷阱、焦点恢复和逻辑 Tab 顺序;第四步确保颜色对比度达到 4.5:1(正文)和 3:1(大文字/UI 组件);最后构建带有关联标签、错误提示和实时区域的无障碍表单。配套提供的子代理 a11y-auditor 可对现有代码库进行自动化扫描,识别 12 类常见违规项(如缺失焦点指示器、跳级标题等)。

显著优点:作为纯文档型资产,该技能零执行风险,所有代码示例透明可查且经过安全审计。内容体系完整,涵盖从快速检查清单到复杂模式(对话框、标签页、数据表)的全场景实践,特别提供 React/TypeScript 现代框架示例。其决策树和"永不执行"清单能有效预防常见反模式,显著降低合规成本。

潜在局限:来源为 T3 级个人开发者项目,虽内容符合 W3C 标准,但缺乏大型企业或基金会的背书。所有代码示例需开发者手动集成到项目中,无法自动修复现有问题。此外,示例主要基于 Web 技术栈,对原生移动应用或 PDF 文档可访问性指导有限。

适用人群:前端开发工程师、UI/UX 设计师、需要满足法规合规(如 ADA、Section 508)的企业技术团队,以及希望提升产品包容性的产品经理。特别适合正在修复屏幕阅读器兼容性、键盘导航障碍或面临可访问性诉讼风险的团队。

使用风险:开发者需注意示例代码需根据实际技术栈调整,直接复制可能导致样式冲突。无障碍合规不能仅依赖自动化检查,必须配合 NVDA、VoiceOver 等真实辅助技术进行人工测试。此外,WCAG 2.1 AA 仅为最低合规标准,特定行业(医疗、金融)可能需要满足更严格的 AAA 级要求。

accessibility 内容

文件夹图标.claude-plugin文件夹
文件夹图标agents文件夹
文件夹图标references文件夹
文件夹图标rules文件夹
手动下载zip · 44.5 kB
plugin.jsonapplication/json
请选择文件