Missing Form Labels
Every form input needs a visible label that's programmatically associated with it. Screen readers announce the label when a user focuses the input — without it, users don't know what information to enter.
Why It Matters
Missing form labels make forms unusable for screen reader users. They also reduce usability for everyone: clicking a label focuses its associated input (larger click target). WCAG 2.1 Level A requires all form inputs to have labels.
Code Examples
<input type="email" placeholder="Email"> <input type="password" placeholder="Password">
<label for="email">Email</label> <input id="email" type="email"> <label for="password">Password</label> <input id="password" type="password">
How to Fix
- 1Add a <label> element with a for attribute matching the input's id.
- 2Alternatively, wrap the input inside the label: <label>Email <input type="email"></label>.
- 3Placeholder text is NOT a substitute for labels — it disappears when the user types.
- 4For icon-only inputs, use aria-label: <input aria-label="Search" type="search">.
Check Your HTML Now
Our validator detects this error automatically and shows the exact line number.
Open HTML ValidatorHostinger — Fast & Affordable Web Hosting
Deploy clean, validated HTML on reliable hosting.
Related HTML Errors
Missing Alt Attribute on Images
Learn why every img element needs an alt attribute and how to write good alt text for accessibility and SEO.
Duplicate ID Attributes
Why duplicate IDs break JavaScript and accessibility. Learn how to find and fix duplicate id attributes in your HTML.
Missing Lang Attribute
Learn why the lang attribute on the html element is critical for screen readers, translations, and SEO.