Quick Reference
Element Code: AC-002
Issue: Form input fields are missing associated label elements
Impact: Screen readers can't identify field purpose, WCAG failure
Fix: Add label element with for attribute matching input id
Detection: axe DevTools, WAVE, Lighthouse
What Is This Issue?
Form inputs without labels are inaccessible to screen reader users who cannot see placeholder text or visual context. Every form field needs a programmatically associated label that describes what information should be entered.
Why This Matters
Accessibility
Screen readers announce labels when users focus on form fields. Without labels, users hear only the input type ("edit text") with no indication of what to enter.
Usability
Properly associated labels also create larger click targets, as clicking the label focuses the input. This benefits all users, especially on mobile devices.
How to Fix This Issue
Method 1: Explicit Labels (Recommended)
Method 2: Implicit Labels
Method 3: aria-label (for visually hidden labels)
Common Mistakes
- Using placeholder as a substitute for labels (placeholders disappear when typing)
- Labels not programmatically associated (for/id mismatch)
- Hiding labels visually without making them accessible
TL;DR (The Simple Version)
Your form fields don't have labels. Screen readers can't tell users what information to enter. Add a label element for each input and connect them using matching for and id attributes.
About SEO ProCheck
Technical SEO consulting and GEO strategy with 20 years of enterprise experience. Case studies, resources, and tools for search and AI visibility.
Work With Me
Technical SEO audits, GEO strategy, site migrations, and international SEO. Hourly consulting for teams who need hands-on support, not just reports.
Subscribe to our newsletter!
Recent Posts
- No Social Schema December 7, 2025
- Missing Social Profile Links December 7, 2025
- Social Image Wrong Size December 7, 2025
