Web Accessibility Patterns for React & Next.js

Documentation

This skill provides web-specific accessibility patterns for the YourCompany web monorepo:

• Production Examples - Real-world code examples from the codebase
• Testing Patterns - Automated a11y testing with axe-core and jest-axe
• WCAG Guidelines - WCAG 2.1 AA compliance rules and configuration

Core Principles

Provide semantic HTML, ARIA attributes, and automated accessibility testing for all components. Use translated strings for labels and test with axe-core in Jest tests.

Why: Web accessibility ensures the application is usable by everyone, including users with visual, auditory, motor, or cognitive disabilities. WCAG 2.1 AA compliance is required by law in many jurisdictions and improves SEO and overall user experience.

When to Use This Skill

Use these patterns when: