WCAG 2.1 · Level A · Understandable

WCAG 3.3.2 — Labels or Instructions, explained with examples

Labels or instructions must be provided when content requires user input. Placeholder-only inputs lose their label as soon as the user starts typing — and screen readers vary on whether they announce them at all. Visible labels are the WCAG-compliant default.

Number
3.3.2
Level
A
Principle
Understandable
Guideline
3.3 Input Assistance

Why this criterion exists

Placeholder-only inputs lose their label as soon as the user starts typing — and screen readers vary on whether they announce them at all. Visible labels are the WCAG-compliant default.

If you only remember one thing: labels or instructions must be provided when content requires user input. Everything else on this page is detail.

Who feels it when this fails

Accessibility criteria sometimes feel abstract until you see who pays the cost when a site ignores them. Labels or Instructions affects:

  • Screen reader users

  • Cognitive accessibility

  • Voice control users

How sites typically fail it

These are the patterns we see week after week. None are intentional — they are accidents of how teams build interfaces under deadline. Knowing the failure modes is the fastest path to writing them out of your component library.

  • Placeholder used as label

  • Required-field markers shown only with color

  • Date format unstated

How to test for it

  • Empty every input; the label must remain visible.

Automated scanners catch this criterion most of the time, but never all of the time. Manual testing with the keyboard and a screen reader closes the gap.

A code fix you can copy

Visible label, programmatic association, accessible required marker — all three together.

The problem

HTML
<input type="email" placeholder="Email">

The fix

HTML
<label for="email">Email <span aria-hidden="true">*</span><span class="sr-only">(required)</span></label>
<input id="email" type="email" required>

Visible label, programmatic association, accessible required marker — all three together.

Other Understandable criteria

Find every accessibility issue on your site in 60 seconds.

Free public scan. No card. AI-generated fixes for every issue we find.