网页无障碍合规诊断与修复清单
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_fccf428b/china-design-accessibility-compliance-accessibility-audit。
技能介绍
要解决的痛点
国内团队在交付网页时,常常把无障碍当成“加分项”而不是“必选项”。设计稿通过了视觉评审,开发也按图还原了,但屏幕阅读器用户依然卡在表单提交上——因为 aria-label 没加,focus 状态被全局样式覆盖,或者对比度刚好踩在 AA 线下方。更麻烦的是,合规要求散落在 WCAG 2.1、《信息无障碍 身体机能差异人群 Web 内容无障碍设计指南》等多份文档里,团队很难判断当前页面到底属于哪个级别、缺了哪些关键项、修复优先级怎么排。
这个技能把“无障碍审计”从一次性的外部检查,变成一个可嵌入日常交付流程的结构化工作流。
技能如何工作
核心能力
- 以 WCAG 合规、包容性设计和辅助技术兼容性为专业基准,输出审计结果和修复建议
- 将“网页无障碍合规诊断与修复清单”拆为可检查、可执行的模块
- 每一项建议都关联到负责人、动作、时间或检查标准
关键步骤
- 信息确认:收集设计目标、受众、渠道、尺寸、品牌规范、交付格式、技术约束和版权边界,同时梳理与无障碍直接相关的现状和历史失败案例。信息不足时先列缺口和影响,不自行补写。
- 目标拆解:明确本次审计的业务目标、使用对象、成功标准和停止条件,把任务拆为诊断和修复两个可检查模块,确定优先级和依赖。
- 执行审计:基于 WCAG 标准进行审计,识别障碍并提供修复方案,涵盖语义结构、键盘导航、对比度、表单标签、多媒体替代文本等维度。
- 交付制作包:生成设计规范与制作包,同时列出事实依据、风险、缺失信息和人工确认项,标注哪些是事实、哪些是推断、哪些是待确认。
- 发布前复核:按目标、事实、可执行性、合规和交付完整性做最终检查。任一硬门槛不满足时输出“暂不可交付”,并说明需要补充的信息和下一步。
适用边界与注意点
- 不使用无授权的图片、字体、肖像或商标素材
- 不将本地模板或建议冒充为已执行的平台操作
- 不读取或输出密钥、Token 和无关个人信息
- 涉及真实发布、付费、删除或生产变更时,必须由用户明确授权
- 合规建议以 WCAG 和国内无障碍标准为依据,但最终合规认定仍需人工复核
使用场景
- 营销团队上线新活动页前,需对页面进行无障碍合规诊断并输出修复清单。
- 电商平台商品详情页需要排查键盘导航和对比度问题,生成可执行修复方案。
- 设计团队交付界面给开发前,要对语义结构和表单标签做合规检查并标注优先级。
- 品牌方发布演示材料时,需确认图片替代文本和多媒体可访问性是否符合要求。
适合人员
- 品牌设计师,需要在交付前对界面做无障碍检查并明确修复优先级。
- 电商前端工程师,需对照 WCAG 标准排查页面障碍并生成可执行的修复建议。
- 产品团队成员,负责在发布前审核无障碍合规结果并确认缺失信息。
- 内容运营人员,需要在发布网页素材前确认替代文本和对比度是否达标。