Frontend Accessibility (WCAG 2.2)

Practical accessibility for Next.js applications.

Baseline Standards (WCAG 2.2 Level AA)

1. Semantic HTML

Use native HTML elements before ARIA. Correct semantics solve most accessibility issues.

// ❌ Div soup
<div onClick={...} role="button" tabIndex={0}>Click me</div>

// ✅ Native button
<button onClick={...}>Click me</button>

// ❌ Nav as generic div
<div className="nav"><a href="/">Home</a></div>