用途:Web Accessibility(无障碍)技能面向需要构建或审计无障碍界面的开发者与设计者,提供 Web 无障碍模式及 WCAG 2.1/2.2 合规指导。目标是让有视觉、运动、听觉或认知障碍的用户也能感知、导航并操作应用,同时提升键盘用户、弱网用户及临时受伤用户的整体可用性。
主要能力:
- 解释无障碍在法务(ADA、EAA、Section 508、EN 301 549)、伦理、业务与技术质量层面的意义。
- 梳理 WCAG 的 POUR 四原则:可感知(Perceivable)、可操作(Operable)、可理解(Understandable)、健壮性(Robust)。
- 说明 A、AA、AAA 三个合规等级,多数项目以 AA 为目标。
- 提供语义 HTML 用法对照:用 button、a、header/nav/main/footer、ul/ol、table/th、原生表单控件替代样式化 div,以获得焦点、角色与屏幕阅读器支持。
- 说明标题层级规则:每页一个 h1,不跳级,标题仅用于结构。
- 汇总常见问题及修复:缺失 alt、对比度不足、缺少键盘访问、表单标签缺失、自动播放媒体、缺少跳转链接、无焦点指示、缺少页面语言、动态内容不可访问、缺少文档标题、触摸目标过小、动画与运动。
- 无障碍表单:label 的显式(for/id)与隐式(包裹)关联、内联错误提示、aria-describedby、aria-invalid、required/aria-required、错误文案具体化。
- 颜色与对比度:信息不能仅靠颜色传达;AA 要求普通文本 4.5:1、大文本 3:1、UI 组件与图形 3:1;用浏览器开发者工具检测,适配 prefers-color-scheme,模拟色盲测试。
- 参考文件覆盖 ARIA 模式、键盘与焦点、测试策略等。
使用方式:当用户要求构建无障碍组件或审计 UI 无障碍性时使用本技能。可参考其参考文件(ARIA 模式、键盘与焦点、测试策略)进行具体实现与验证。资料中提及可安装同一作者 code-virtuoso 下的 knowledge-virtuoso 以获取 API 设计、安全模式、测试策略、性能指导等关联内容。
适用场景:构建无障碍组件、对 UI 进行无障碍审计、表单无障碍改造、对比度与键盘访问检查、动态内容与 live region 设计等。
限制:资料未提供该技能的安装命令、价格、收费方式、平台支持、具体版本号或效果数据,暂未提供;参考文件如 ARIA 模式、键盘与焦点、测试策略的具体细节也未给出,暂未提供。