• Success Criterion 1.3.1
  • Conformance level A

Form Label Not Correctly Linked to Its Input Field

1.3.1 — Info and Relationships

Scenario

Setting

A news outlet's article page

What’s wrong

label present but for/id pairing (code tying a label to its field) mismatch or duplicate ids breaking the association.

Example

A news outlet's article page runs into this exact issue: label present but for/id pairing (code tying a label to its field) mismatch or duplicate ids breaking the association.

Why it matters

Screen-reader, braille, and reading-tool users who depend on coded structure rather than visual layout. In this case (a news outlet's article page), they can't tell what's going on without extra effort.

How to test

Click each visible label and confirm it visually and audibly (screen reader) jumps focus to the correct paired field, not a different one nearby.

How to fix

Fix the for/id pairing (code tying a label to its field) and make ids unique so each label resolves to its field.

Outcome

Once corrected, a news outlet's article page lets them navigate the content in a sensible order.

Who is affected

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

Learn more