Skip to content

Accessibility

Why duplicate element ids break accessibility

Label associations, ARIA references and in-page anchors all resolve to the first match. A repeated id means a label points at the wrong field, or a described-by reference reads out the wrong text, with nothing visibly broken.

What 13x checks

This is rule accessibility.duplicate-ids in the public registry: Element ids are unique. It runs on every audit, against the pages we actually fetched, and its result is derived from the response rather than estimated.

Surface
Accessibility
Score weight
3 of the readiness score
Scope
Reported as skipped when the page renders only with JavaScript
Applies
To every site

Registry version 2026-07-30. Every rule is published, and the audit is deterministic — the same page produces the same finding every time.

The fix

The same text the audit hands you when this check fails on your own site.

Duplicate element ids found, e.g. ``.

label[for], aria-labelledby, aria-controls and in-page anchors all resolve to the first match, so a duplicated id silently points assistive technology at the wrong element.

Usually a component rendered more than once with a hardcoded id. Generate one per instance:

tsx code
import { useId } from "react";

function Field({ label }: { label: string }) {
  const id = useId();
  return (
    <>
      <label htmlFor={id}>{label}</label>
      <input id={id} />
    </>
  );
}

Find them:

bash code
curl -s https://example.com | grep -o 'id="[^"]*"' | sort | uniq -d

Does your site have this problem?

13x checks this and 112 others against your live URL in about 30 seconds. No account, and every finding comes with the fix for your framework.

No signup. Results in 30 seconds.

More accessibility checks