用途
该技能面向无障碍网页开发场景，用于在 HTML 结构语义审计、ARIA 属性设置、键盘导航实现、对比度检查、无障碍表单设计、媒体无障碍、BFSG 合规核查以及既有界面无障碍审计中提供绑定规则与检查依据。资料强调无障碍并非特殊功能，而是法律、道德与商业上的强制要求，且应从概念、设计、开发、测试各阶段就纳入，而非后期改造。
主要能力
技能以规则清单与模式说明的形式覆盖以下方面：
- 语义化 HTML：原生元素按用途使用（button 用于操作、a 用于导航、nav/main/article），保持逻辑标题层级（每页恰好一个 h1、不跳级），使用 landmark 元素（header、nav、main、aside、footer），禁止使用 div/span 承载交互元素，禁止用标题做样式。
- ARIA 属性：仅在没有原生 HTML 元素满足用途时使用 ARIA；为无可见文本的交互元素加 aria-label；动态内容用 aria-live="polite"；错误消息用 role="alert"；避免 ARIA 过载与冗余，禁止在可见可交互元素上设置 aria-hidden="true"。
- 键盘导航：所有交互元素可通过 Tab、Enter、Space、Escape、方向键到达；提供可见焦点指示（最小 3:1 对比度、2-3px 轮廓）；模态中实现焦点陷阱；第一个可聚焦元素为跳转到内容链接；Tab 顺序与视觉阅读顺序一致；tabindex 仅使用 0 或 -1，禁止大于 0；禁止移除 outline 而无适当替代。
- 对比度与颜色：正文文本最小 4.5:1（WCAG AA），大文本（≥24px 或 ≥18.66px 粗体）最小 3:1，UI 组件最小 3:1；颜色不得作为唯一信号，需文本、图标或图案等第二信号；需测试色觉缺陷（Chrome DevTools > Rendering > Emulate vision deficiencies）；关键信息不得依赖红绿区分。
- 图片与媒体：信息性图片提供描述内容的 alt 文本，装饰性图片 alt=""；视频带字幕，音频带文字转录；动画可暂停，CSS 中尊重 prefers-reduced-motion；禁止闪烁内容（每秒超过 3 次闪烁可能诱发光敏性癫痫）。
- 表单：每个字段通过 for/id 关联可见 label；必填字段用文本加 aria-required="true"；错误消息直接置于字段旁并用 aria-describedby；标准字段使用 autocomplete 属性；禁止用 placeholder 替代 label；CAPTCHA 需提供可访问替代方案。
- 响应式与触摸：触摸目标最小 44x44px（WCAG），建议 48x48px；目标间距最小 8px；支持最高 200% 缩放且功能不丢失；禁止阻止缩放。
- 动效与动画：尊重 prefers-reduced-motion，减少或移除动画；自动运动（轮播、视频）可暂停；视差或大幅动效需提供 prefers-reduced-motion 回退。
使用方式
资料以规则（DO/DON'T）和检查清单形式组织，并引用 references/patterns.md 获取详细模式描述与代码示例。技能中列出的具体模式包括：
- 跳过导航：第一个可聚焦链接为“Skip to content”，视觉隐藏、聚焦可见，指向 main。
- 可访问模态：role="dialog" 加 aria-modal="true" 加 aria-labelledby，实现焦点陷阱，Escape 关闭，焦点返回触发元素。
- 错误摘要：表单顶部错误摘要并链接到受影响字段，role="alert"，同时提供内联错误。
- 可访问手风琴：用 button 作为触发器并带 aria-expanded，内容用 aria-labelledby，方向键导航。
反模式部分列出 Div Soup、不可见焦点指示、placeholder 当 label、自动播放媒体、ARIA 过载、阻止缩放等问题及其解决方向。
检查清单覆盖结构语义、对比度颜色、键盘交互、图片媒体、表单、移动响应式与法律等维度，用于逐项核查。
适用场景
适用于需要在网页开发流程各阶段落实无障碍要求的团队与个人，包括前端开发、设计、测试及合规核查。资料提到 BFSG（德国无障碍强化法）自 2025 年 6 月 28 日生效，要求许多公司提供数字无障碍，并建议评估 BFSG 相关性、以 WCAG 2.1 AA 为最低标准、提供无障碍声明。
限制
资料未提供该技能的具体安装命令、运行环境、依赖或价格信息，暂未提供。资料未说明适用的具体技术栈或框架版本，暂未提供。资料未列出完整的 references/patterns.md 内容，暂未提供其中代码示例的细节。