Missing form labels
Placeholder text is not a substitute for labels.
See this on your site
Step-by-step fixes by platform
Programmatic guides combine the issue explanation with stack-specific notes and examples where we have them.
What this issue is
Every input needs an accessible name, usually via `<label for>` wrapping, or `aria-label` when design constraints require it.
Fixes
Prefer visible labels. If space is tight, use persistent labels or aria-labelledby pointing to visible text.
Examples
- Bad: placeholder="Email" with no label or aria-label.
- Good: `<label for="email">Email</label><input id="email" ...>`.
How to fix
Associate every input with a visible label, aria-labelledby, or aria-label when design constraints require it.
Surface errors next to fields and link them with aria-describedby.
Platform notes
- WordPress
- Contact Form 7 and Gravity Forms need correct field settings; avoid placeholder-only UX.
- React
- Floating labels still need a programmatic name; test with the accessibility tree.
Related: 3.3.2 Labels or Instructions.
FAQ
- Search boxes?
- Add a label or aria-label; icons alone are not enough.