mediumOn-Page SEO

Form Controls Without an Accessible Label

Form controls without accessible labels hinder usability for assistive tech and autofill tools, failing WCAG requirements.

By Seoxpert Editorial · Published Apr 28, 2026

Why it matters

Unlabeled form controls confuse screen reader users, making forms unusable for many. Password managers and browser autofill can't identify fields, reducing usability and conversion rates. This also fails key accessibility standards, impacting site compliance and reputation.

Impact

Leaving this unresolved makes forms inaccessible, reduces conversions, and risks legal non-compliance.

How it's detected

Automated crawlers scan for input, select, or textarea elements lacking associated <label>, aria-label, aria-labelledby, title, or placeholder attributes.

Common causes

•Forgetting to add <label> elements to form controls
•Using visual labels but not programmatically associating them with controls
•Relying solely on placeholder text as a label
•Creating icon-only or custom-styled controls without accessible labeling
•Dynamically generating forms without proper label markup

How to fix it

Ensure every form control has an accessible label. Use a <label> element either by wrapping the input or referencing it with for/id. For controls without visible labels, add an aria-label or aria-labelledby attribute. Do not rely on placeholder text alone, as it disappears on focus and is not a substitute for a label.

Code examples

Problem: Input with no label

<input type="text" name="username">

Fix: Using a wrapping label

<label>Username <input type="text" name="username"></label>

Fix: Using for/id association

<label for="username">Username</label>
<input id="username" type="text" name="username">

Fix: Using aria-label for icon-only control

<input type="search" aria-label="Search">

FAQ

Is using a placeholder enough to label a form control?

No, placeholder text is not a substitute for an accessible label. It disappears on focus and is not reliably announced by assistive tech.

What if my form control is icon-only and has no visible label?

Use an aria-label or aria-labelledby attribute to provide an accessible label for screen readers.

Do I need a label for every input, even hidden ones?

Hidden inputs do not need labels, but all visible and interactive form controls must have accessible labels.

Can I use the title attribute as a label?

While the title attribute can provide a label, it is less reliable than <label> or aria-label and should not be the primary method.

Found this issue on your site?

Run a scan to see if Form Controls Without an Accessible Label affects your pages.

Scan my website →