Skill 广场
网页无障碍WCAG合规审查 Skill

网页无障碍WCAG合规审查.Skill

@wshobson/wcag-audit-patterns

4.5优秀AI 评分基础检查通过源自 GitHub

输入前端页面代码或界面链接,按WCAG 2.2标准筛查A至AAA级无障碍缺陷,输出包含代码修复示例的整改建议。

编程前端开发工程师UI/UX设计师软件测试工程师2026-09-29 更新main

网页无障碍WCAG合规审查

本功能用于帮助团队排查并修复网页与应用中的无障碍可访问性缺陷。用户只需提供前端代码片段、页面URL或组件交互设计,系统即可对照WCAG 2.2标准及POUR原则,识别键盘导航、色彩对比度、ARIA标签等维度的违规项,并生成具体的HTML与脚本修复代码。适用于应对海外合规要求、通过VPAT审查及提升残障人士使用体验。

常见场景

它能帮你做什么?

01

出海网站ADA合规排查:针对面向欧美市场的商业网站,检查是否存在高危无障碍漏洞,规避法律诉讼风险。

02

前端组件可访问性修复:分析自定义下拉框或弹窗组件,补齐键盘焦点管理与ARIA属性,生成符合规范的源码。

03

色彩对比度与字体排版校验:检测页面文本与背景色对比度及字号缩放表现,给出符合WCAG AA级标准的配色调整方案。

三步完成

怎么使用

1安装 Skill

把右侧安装请求发给你的 AI。

2说清楚目标

告诉 AI 你想完成什么,或直接贴入内容。

3检查结果

按需要继续调整语气、范围或格式。

复制就能用

你可以直接这样说

“请审查这段自定义模态框的Vue代码,指出不符合WCAG 2.2键盘交互规范的问题并给出修复版。”

“排查登录表单中缺少label与错误提示无法被屏幕阅读器读取的问题,并提供语义化HTML整改方案。”

“当前按钮文字颜色为 #767676,背景色为 #EAEAEA,请核算对比度并给出达到WCAG AA级的修改色值。”

适用人群

适合谁?

前端开发工程师UI/UX设计师软件测试工程师海外合规与法务审核员

上手门槛

使用难度

进阶

需要了解任务流程,页面已整理好使用步骤。

兼容范围

支持哪些 AI?

Codex可直接使用
Claude Code可直接使用
OpenClaw可直接使用
Hermes Agent可直接使用
国内 Agent可直接使用

中文用户增强

Skill Px 做了什么?

中文说明简化使用方式补充中文案例整理安装流程降低理解难度