• Success Criterion 1.3.1
  • Conformance level A
  • W3C reference F17 (legacy)

Duplicate Element IDs Breaking Form Label Connections

1.3.1 — Info and Relationships

Scenario

Setting

A government tax-filing portal

What’s wrong

Two elements share the same id, so a label points at the wrong field (or none) — screen readers announce the wrong name. (Old WCAG 2.0 failure — still fails this rule when it breaks label associations.).

Example

Here's a real case from a government tax-filing portal: two elements share the same id, so a label points at the wrong field (or none) — screen readers announce the wrong name. (Old WCAG 2.0 failure — still fails this rule when it breaks label associations.).

Why it matters

Screen-reader, braille, and reading-tool users who depend on coded structure rather than visual layout. On a government tax-filing portal, this barrier means they can't tell what's going on without extra effort.

How to test

Click a label and confirm focus moves to its paired field, then check DevTools for matching for/id values with no duplicate ids elsewhere on the page.

How to fix

Make every id unique so labels and associations resolve to the right element.

Outcome

Corrected, a government tax-filing portal now lets a visitor move through the content with confidence.

Who is affected

Screen-reader, braille, and reading-tool users who depend on coded structure rather than visual layout.

Learn more