Next.js accessibility checklist
Ship accessible pages by checking HTML output, hydration quirks, and interactive islands—not only Lighthouse scores.
Run a free scan
Scan key routes: marketing home, auth, settings, and any revenue-critical flow.
Checklist
Meaningful alt on next/image, logical heading order, visible focus styles, form labels on all inputs, skip link or clear main landmark.
Correct lang on html, no keyboard traps in nav or modals, error text associated with fields, dynamic routes tested individually.
Common issues
Client components that omit labels, layout shift hiding focus rings, and duplicate landmarks when composing layouts.
Fixes
Centralize layout and form primitives, run axe on preview deploys, and file tickets with public report links.
Questions people ask
- App Router?
- Same checklist applies to rendered pages.
- Metadata API?
- Good for SEO; still verify visible content and focus.