Frontend Accessibility Best Practices

A solid reference for keeping React components accessible without having to look up WCAG guidelines every time. Covers the practical stuff: semantic HTML landmarks, screen reader text with sr-only classes, ARIA live regions for dynamic content, keyboard navigation patterns, focus management in modals, and respecting reduced motion preferences. The examples are concrete and show both the wrong and right way to do things, which helps. Seven rules organized by priority, with references to react-aria-components doing the heavy lifting on modals and buttons. Most useful when you're building forms or interactive UI and want to catch accessibility issues during development rather than in an audit later.

Install to Claude Code

npx -y skills add sergiodxa/agent-skills --skill frontend-accessibility-best-practices --agent claude-code