Loadingβ¦
Associate a visible label with every input so screen-reader users can fill your forms.
A placeholder is not a label β it disappears when the user types and is often ignored by screen readers. Inputs without a programmatically associated label are unusable for assistive-tech users and fail accessibility audits.
<label for="id"> matching the input's id (or wrap the input in the label).aria-label.<input type="email" placeholder="Email"> <!-- placeholder is not a label --><label for="email">Email</label>
<input id="email" type="email" autocomplete="email">Most form plugins (Contact Form 7, Gravity Forms) add labels β ensure "label" isn't hidden in favour of placeholder-only styling.
Always render a <label htmlFor> next to each input in your form components.
Run a free audit and get a prioritized fix list with auto-generated code.
Run a free audit