accessibility-wcag-expert

Audit web interfaces for WCAG 2.2 compliance and accessibility issues.

45|4|Updated Nov 25, 2025
One-click install
npx skills add https://github.com/martinholovsky/claude-skills-generator --skill accessibility-wcag-expert
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: accessibility-wcag-expert
Source: https://github.com/martinholovsky/claude-skills-generator/tree/main/skills/accessibility-wcag
Command: npx skills add https://github.com/martinholovsky/claude-skills-generator --skill accessibility-wcag-expert

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill ensures your web interfaces are usable by everyone, regardless of ability, by adhering to WCAG 2.2 guidelines and best practices for accessibility.

Core Features & Use Cases

  • WCAG Compliance Auditing: Identify and fix accessibility violations.
  • Accessible Component Implementation: Create keyboard-navigable, screen-reader-friendly UI elements.
  • Performance Optimization: Ensure assistive technologies can efficiently process content.
  • Use Case: Audit an existing e-commerce product page to ensure it meets WCAG AA standards for color contrast, keyboard navigation, and screen reader announcements before launch.

Quick Start

Audit the accessibility of the provided Vue component using jest-axe and provide a report.

Frequently Asked Questions about accessibility-wcag-expert

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

FAQPage Schema
How do I make my web interface WCAG 2.2 compliant for keyboard navigation and screen readers?

To make your web interface WCAG 2.2 compliant, implement semantic HTML, ARIA patterns, and POUR principles to ensure full keyboard navigation and screen reader support for assistive technologies.

What is the best way to audit a Vue component for accessibility violations before launch?

The best way to audit a Vue component for accessibility is to run automated checks using jest-axe, generating a report that identifies WCAG violations in color contrast, keyboard navigation, and screen reader announcements.

How does test-driven development for accessibility work with ARIA patterns?

Test-driven development for accessibility involves writing tests that validate ARIA patterns and semantic HTML against WCAG 2.2 standards, ensuring components meet keyboard navigation and screen reader requirements before implementation.

Can I use this approach to optimize e-commerce pages for screen reader announcements?

Yes, you can audit and optimize e-commerce pages to meet WCAG AA standards, ensuring efficient screen reader announcements, proper color contrast, and keyboard navigation for all users regardless of ability.

When do I need to use ARIA patterns instead of semantic HTML for inclusive design?

ARIA patterns are needed for inclusive design when semantic HTML alone cannot convey dynamic UI changes or complex widget states to assistive technologies, ensuring proper screen reader support and WCAG 2.2 compliance.