accessibility-a11y

Ensure WCAG 2.2 compliance with ARIA patterns and keyboard navigation.

88|22|Updated Dec 17, 2025
One-click install
npx skills add https://github.com/travisjneuman/.claude --skill accessibility-a11y-travisjneuman
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: accessibility-a11y
Source: https://github.com/travisjneuman/.claude/tree/main/skills/accessibility-a11y
Command: npx skills add https://github.com/travisjneuman/.claude --skill accessibility-a11y-travisjneuman

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the critical need to build web applications that are usable by everyone, regardless of their abilities, by ensuring compliance with accessibility standards and best practices.

Core Features & Use Cases

  • WCAG Compliance: Guides users on achieving WCAG 2.2 AA and AAA compliance.
  • ARIA Patterns: Demonstrates correct implementation of ARIA for custom components.
  • Assistive Technology Support: Focuses on keyboard navigation, screen reader compatibility, and focus management.
  • Automated Testing: Integrates tools like axe-core and Playwright for continuous accessibility checks.
  • Use Case: When developing a new complex UI component like a custom date picker, use this Skill to ensure it's fully navigable via keyboard and correctly announced by screen readers.

Quick Start

Use the accessibility-a11y skill to audit the current page for WCAG 2.2 AA violations.

Frequently Asked Questions about accessibility-a11y

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

FAQPage Schema
How do I check my web application for WCAG 2.2 compliance?

To check web application WCAG 2.2 compliance, audit pages for semantic HTML structure, ARIA pattern implementation, and keyboard navigation to ensure assistive technology compatibility and meet AA or AAA standards.

What is the best way to implement ARIA patterns for custom components?

Implementing ARIA patterns for custom components requires using correct semantic HTML alongside ARIA attributes to manage focus and states, ensuring complex UI elements like custom date pickers are fully navigable via keyboard and announced correctly by screen readers.

Can I integrate automated accessibility testing into my CI/CD pipeline?

You can integrate automated accessibility testing into CI/CD pipelines using tools like axe-core and Playwright to continuously check web applications for violations, ensuring ongoing assistive technology support and WCAG compliance during development.

How do I manage keyboard navigation and focus for complex UI elements?

Managing keyboard navigation and focus for complex UI elements involves implementing proper focus management techniques and ARIA patterns, ensuring users can navigate custom components entirely via keyboard without relying on a mouse.

Does semantic HTML alone guarantee screen reader compatibility?

Semantic HTML provides a strong foundation for screen reader compatibility, but complex custom components often require additional ARIA implementation and thorough keyboard navigation testing to ensure full assistive technology support and WCAG 2.2 compliance.