Deepcrawl is now Lumar. Read more.
DeepcrawlはLumarになりました。 詳細はこちら

Form without label (WCAG Level A Issue)

Why form fields need labels to comply with website accessibility best practices (and how to fix this issue on your website).

Forms - Lumar Accessibility Thumbnail

What does this accessibility issue mean?

Accessibility issue summary:  Form field is missing label

To comply with WCAG Level A rules relating to form labels, all website form fields should have clear, easy-to-understand labels so users know what input data they should enter in each field.

Each form field should ideally have a single, unique label associated with it, providing unambiguous instructions for users to understand the purpose of the field. 

Issue details

Lumar can help you find & resolve this website accessibility issue — & many others — on your own site. Speak to our team to get started with the platform.

Get a Lumar demo

Example HTML violation: Form without label (WCAG Level A Issue)

 <form method="post">
   <input name="search" type="text" />
   <input type="submit" value="Search" />

Explanation: The above code violates the 'Form without label' accessibility rule (rule-id: 'label') because the text input field doesn't have an associated <label> element. </label>

The <label> element provides a text description for the form control, which is necessary for screen reader users to understand the purpose of the form control. </label>

Here is the corrected HTML code with the issue resolved:


How to fix "Form without label (WCAG Level A Issue)" issue

 <form method="post">
   <label for="search-input">Search</label>
   <input id="search-input" name="search" type="text" />
   <input type="submit" value="Search" />

In the corrected HTML code, a <label> element is added with a for attribute that matches the id of the input field it describes. This provides a text description ("Search") to the input field making it accessible to screen reader users.</label>

Digital Accessibility + SEO + Website Health

Build better online experiences — explore the full Lumar platform