Next.js fix guide
Fix Duplicate IDs on Next.js
IDs must be unique in the DOM.
Check your live page
Canonical issue page: Duplicate IDs →
What this issue means
Fix
Rename duplicates; generate stable unique ids for lists rendered in loops.
How to fix on Next.js
In Next.js, verify both server and client components: hydration can change roles/names. Use `next/image` with meaningful `alt`, and ensure dynamic imports do not drop focus management.
How to fix
Ensure ids are unique per document; generate stable unique ids in lists.
Fix templates so duplicated components do not reuse hard-coded ids.
Related: 4.1.1 Parsing (historically); best practice for robustness.
Other platforms
TestAccessibility · Programmatic fix page · localhost:3001