WCAG 3.3.2 Labels or Instructions: what it means and how to fix it
Short answer: Every form field needs a visible label, programmatically tied to the field, and any format requirements must be stated up front. Placeholder text alone does not count.
What it requires
Labels or instructions must be provided when content requires user input. In practice every input needs a label connected to it (label for, or a wrapping label), and formats such as "MM/YY" should be explained before the user types.
Who it affects
Screen reader users (an unlabeled field is announced as just "edit text"), people with cognitive disabilities, and anyone who forgets what a placeholder said once they start typing.
How it shows up in ADA website claims
Unlabeled fields in search boxes, newsletter sign-ups, login and checkout forms are among the most common barriers described in complaints, because they can make a purchase impossible with a screen reader.
How to check your site
- An automated scan flags inputs with no accessible name.
- Click on each visible label: focus should move into its field.
- Check the search box, newsletter field, quantity inputs and every checkout field.
How to fix it
<!-- Fails: placeholder only -->
<input type="email" placeholder="Email">
<!-- Passes -->
<label for="email">Email address</label>
<input id="email" type="email" autocomplete="email" required>
<!-- Compact search: visually hidden label -->
<label for="q" class="visually-hidden">Search products</label>
<input id="q" type="search">
If you use a visually hidden label, make sure the purpose is still visually obvious, for example with a search icon.
Frequently asked questions
Is placeholder text a label?
No. Placeholders disappear as you type, are often low-contrast, and are not reliably announced as labels.
Can I use aria-label instead of a visible label?
It gives the field an accessible name, which fixes the screen reader problem, but visible labels are better for everyone and are expected for most fields.
What about error messages?
Errors fall under 3.3.1 Error Identification: say which field is wrong and why, in text.
Automated rules that test this (axe-core): label, select-name, autocomplete-valid, label-title-only. Our scanner runs these checks.
Other commonly cited criteria
- 1.1.1 Non-text Content
- 1.2.2 Captions (Prerecorded)
- 1.3.1 Info and Relationships
- 1.4.3 Contrast (Minimum)
- 1.4.4 Resize Text
- 2.1.1 Keyboard
- 2.4.1 Bypass Blocks
- 2.4.2 Page Titled
- 2.4.4 Link Purpose (In Context)
- 2.4.7 Focus Visible
- 3.1.1 Language of Page
- 4.1.2 Name, Role, Value
Read the official WCAG 2.1 specification at W3C.
Proof of Access provides technical accessibility assessments. We are not a law firm and nothing on this page is legal advice. If you have received a demand letter or a lawsuit, talk to an attorney.