SuperAPI AI 工具集

accessibility-a11y

前端与建站

查看项目

更新于 10-15 22:39

技能介绍

用途:帮助开发者按 WCAG 标准实现 Web 无障碍,覆盖视觉、听觉、运动与认知障碍用户的可访问性需求。

主要能力:强调语义化 HTML(header、main、nav、article、section、aside 等,按钮用 button 而非 div/span),正确使用标题层级与地标;表单需用 for/id 关联标签、fieldset 与 legend 分组、清晰错误提示、合适 input 类型;ARIA 仅在语义 HTML 不足时补充,如 aria-label、aria-describedby、aria-live、aria-expanded、aria-hidden、aria-current、aria-labelledby;视觉方面要求文本对比度至少 4.5:1(大文本 3:1),不单靠颜色传递信息,保留清晰焦点样式与合理 tab 顺序;键盘导航需支持全部交互、避免键盘陷阱、触控目标不小于 44x44 像素,并支持 Enter/Space 与方向键;内容上要求图片 alt 文本、装饰图 alt=""、视频字幕与音频文字稿、描述性链接文本;排版用 rem/em、支持 200% 缩放、避免两端对齐,并尊重 prefers-reduced-motion 等偏好;响应式采用移动优先。

使用方式:将上述规则应用到代码审查与实现中,自动化测试可用 Lighthouse、axe-core 并集成到 CI/CD;人工测试使用 NVDA、JAWS、VoiceOver 屏幕阅读器、纯键盘导航、200% 浏览器缩放与无障碍检查工具,并尽量邀请真实残障用户参与。

适用场景与限制:适合前端开发、设计与质量保障流程中的无障碍审查和实现。资料未提供具体收费、价格、平台依赖或完整代码示例,相关细节暂未提供。