Why Accessibility Matters
Over 1 billion people have disabilities. Accessible applications are ethically right, legally required, and improve SEO.
Semantic HTML First
// Bad<div onClick={handleClick} className="btn">Click me</div>// Good<button onClick={handleClick}>Click me</button>Keyboard Navigation
Tab order should match visual order
Focus indicators must be visible
Modals should trap focus
Escape should close overlays
Arrow keys should navigate composite widgets
ARIA Patterns
// Live region for dynamic updates<div aria-live="polite" aria-atomic="true"> {notification && <p>{notification}</p>}</div>// Skip navigation link<a href="#main-content" className="sr-only focus:not-sr-only"> Skip to main content</a>Testing Accessibility
axe-core: automated testing in CI/CD
Lighthouse: audit scores
Manual screen reader testing
Keyboard-only navigation testing
Color contrast checking