audit-accessibility-wcag

Audit and remediate JSX and HTML for WCAG 2.2 AA accessibility compliance.

9|3|Updated Jun 13, 2026
One-click install
npx skills add https://github.com/Sir-chawakorn/sanook-cli --skill audit-accessibility-wcag
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: audit-accessibility-wcag
Source: https://github.com/Sir-chawakorn/sanook-cli/tree/main/skills/audit-accessibility-wcag
Command: npx skills add https://github.com/Sir-chawakorn/sanook-cli --skill audit-accessibility-wcag

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses the complexity of maintaining web accessibility standards, helping developers identify and resolve barriers that prevent users with disabilities from effectively interacting with digital interfaces.

Core Features & Use Cases

  • Comprehensive Auditing: Scans markup and JSX for common accessibility failures including contrast, focus management, and semantic structure.
  • Actionable Remediation: Provides specific, copy-pasteable code fixes for identified blockers like missing alt text, incorrect heading hierarchies, or keyboard traps.
  • Use Case: Before deploying a new feature, use this skill to verify that your custom modal components are fully keyboard-operable and screen-reader friendly according to WCAG 2.2 AA guidelines.

Quick Start

Use the audit-accessibility-wcag skill to perform a full accessibility audit on the current directory and provide a prioritized list of fixes.

Frequently Asked Questions about audit-accessibility-wcag

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit my web UI components for WCAG 2.2 AA compliance?

To audit web UI components for WCAG 2.2 AA compliance, scan your JSX and HTML markup to identify issues with screen reader support, keyboard navigation, color contrast, focus management, and semantic structure. The process validates ARIA usage and provides actionable code fixes.

How do I fix keyboard navigation and focus management issues in my modal components?

Fix keyboard navigation and focus management issues by remediating JSX and HTML markup to resolve keyboard traps and ensure proper focus shifts. You achieve this by validating semantic structure and correcting ARIA usage to make custom modals fully keyboard-operable.

What are the common accessibility barriers in frontend JSX and HTML markup?

Common accessibility barriers in frontend JSX and HTML markup include missing alt text, incorrect heading hierarchies, insufficient color contrast, and improper ARIA usage. These barriers prevent users with disabilities from effectively interacting with digital interfaces using screen readers or keyboards.

Can I use this accessibility audit on existing frontend projects without extra dependencies?

Yes, you can perform a full accessibility audit on your current directory without extra dependencies. The process analyzes your existing JSX and HTML markup directly to identify and resolve WCAG 2.2 AA failures across your UI components.

What's the best way to ensure screen reader support for custom web components?

The best way to ensure screen reader support is to validate semantic structure and ARIA usage within your JSX and HTML markup. Correcting these elements provides specific, copy-pasteable code fixes that resolve blockers and ensure inclusive user experiences across diverse input methods.