About This HTML Issue
An aria-hidden attribute on a <label> element that is associated with a form control hides the label from assistive technologies while the control still expects an accessible name from it. This creates a broken association where the form field appears unlabeled to screen readers.
The aria-hidden="true" attribute removes an element and all its descendants from the accessibility tree. When a <label> is linked to an input (either by wrapping it or through the for attribute), the browser uses that label to compute the input's accessible name. Setting aria-hidden="true" on the label strips away that name, leaving the input without a label for assistive technology users.
The HTML spec explicitly forbids this combination because it guarantees an accessibility failure. A label that exists visually but is hidden from the accessibility tree defeats its own purpose.
To fix this, remove aria-hidden from the <label>. If the label text should not be visible on screen, use a CSS technique to visually hide it while keeping it accessible. If the label itself is truly decorative and another mechanism provides the accessible name (like aria-label on the input), remove the for/id association so the <label> is no longer linked to the control.
Incorrect example
<label for="email" aria-hidden="true">Email</label>
<input type="email" id="email">
Correct examples
Remove aria-hidden from the label:
<label for="email">Email</label>
<input type="email" id="email">
If the goal is to visually hide the label while keeping it accessible, use CSS instead:
<label for="email" class="visually-hidden">Email</label>
<input type="email" id="email">
<style>
.visually-hidden {
clip: rect(0 0 0 0);
clip-path: inset(50%);
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
width: 1px;
}
</style>
If the label is decorative and the input gets its accessible name from another source, break the association:
<label aria-hidden="true">Email</label>
<input type="email" aria-label="Email">
Find issues like this automatically
Rocket Validator scans thousands of pages in seconds, detecting HTML issues across your entire site.