accessibility-check
审查或改进前端 UI 的语义结构、键盘支持、焦点管理、标签以及常见的 WCAG 相关问题,并将报告保存为 Markdown 文件。当用户提到无障碍、accessibility、a11y、WCAG,或在实现交互组件时自动激活。
Install via CLI (Recommended)
clawhub install openclaw/skills/skills/bovinphang/accessibility-checkWhat This Skill Does
The accessibility-check skill is a dedicated diagnostic tool for frontend developers and UI engineers to ensure their web applications meet WCAG 2.1 AA standards. Instead of relying on manual checklists, this skill programmatically inspects your DOM, HTML structure, and interactive components. It identifies common pitfalls such as missing alt text for images, broken keyboard navigation, poor focus management, and misuse of ARIA attributes. Once the inspection is complete, the skill generates a comprehensive, structured Markdown report in the reports/ directory, complete with actionable recommendations for code fixes.
Installation
To integrate this skill into your OpenClaw environment, execute the following command in your terminal:
clawhub install openclaw/skills/skills/bovinphang/accessibility-check
Ensure that your project environment has the necessary write permissions for the file system to allow the skill to save reports.
Use Cases
- Pre-deployment QA: Run a full accessibility scan on production-ready code before shipping to ensure compliance.
- Component Development: Use the skill during the creation of complex UI widgets like modals, menus, or custom tree views to verify focus trapping and keyboard shortcuts.
- Accessibility Remediation: Pass the skill a codebase that has received negative feedback on its a11y support, and let it map out the high-priority issues that need immediate attention.
Example Prompts
- "Run an accessibility check on my current registration form component and tell me if the labels are properly associated with the inputs."
- "I just finished building a new modal. Can you perform an a11y review to ensure it handles Escape keys and focus trapping correctly?"
- "Please scan the header and navigation menu of this project for WCAG 2.1 AA compliance and save the report to my logs."
Tips & Limitations
- Native First: Always prioritize native HTML elements (like
<button>or<nav>) over complex ARIA patterns. The skill is designed to flag where developers have overly complicated their markup. - Report Management: The skill generates files with timestamps. Keep an eye on your
reports/folder and periodically clean up old scans to keep your repository organized. - Scope: While the tool is highly effective at identifying structural and functional a11y issues, it is not a substitute for human user testing with screen readers like NVDA or VoiceOver. Use this as your primary automation layer, then verify the user experience manually.
Metadata
Not sure this is the right skill?
Describe what you want to build — we'll match you to the best skill from 16,000+ options.
Find the right skillPaste this into your clawhub.json to enable this plugin.
{
"plugins": {
"official-bovinphang-accessibility-check": {
"enabled": true,
"auto_update": true
}
}
}Tags(AI)
Flags: file-write, file-read
Related Skills
frontend-code-review
从架构、可维护性、类型安全、可访问性、样式一致性、性能和可测试性等角度审查前端代码,并将报告保存为 Markdown 文件。当用户要求代码审查、Review、评审代码质量时自动激活。
legacy-web-standard
针对 JavaScript + jQuery + HTML/CSS 传统前端项目的开发与维护规范。当用户在非框架项目中工作,涉及 jQuery、原生 JS、传统多页面应用(MPA)、模板引擎渲染页面、或维护遗留代码时自动激活。
security-review
前端代码安全审查,检测 XSS、CSRF、敏感数据泄露、不安全的用户输入处理和依赖风险,并将报告保存为 Markdown 文件。当用户要求安全检查、安全审查,或代码涉及用户输入、认证、支付、文件上传等敏感操作时自动激活。
test-and-fix
执行项目校验命令(lint、type-check、test、build),分析失败原因,安全修复问题,并将总结报告保存为 Markdown 文件。当用户要求检查、验证、测试代码改动时自动激活。
nextjs-project-standard
Next.js 14+ 项目规范,涵盖 App Router、SSR/SSG、流式渲染、路由与布局、数据获取、中间件、元数据与 SEO。当用户在 Next.js 项目中创建、修改页面或模块时自动激活。