Aamir Shahzad
Aamir Shahzad

Reputation: 6834

ADA compliance - Wrapping input in label vs adding label before input

I am working on a website to implement ADA compliance. Which is better approach in terms of ADA compliance:

<label>Name:</label>
<input type="text" placeholder="Name" />

VS

<label>
 Name:
 <input type="text" placeholder="Name" />
</label>

Similarly for other input types such as select, radio button, checkbox etc.

Also we don't need labels in majority of forms as per design, so does it will make difference for ADA compliance if I add hidden labels for inputs?

Similar thing is asked in below question but it doesn't answer in terms of ADA.

Is it better to wrap the label tag around a form item or use the "for" attribute in HTML?

Upvotes: 3

Views: 1037

Answers (1)

Aamir Shahzad
Aamir Shahzad

Reputation: 6834

WebAIM.org gives advice on ADA and forms at the link below.

Creating Accessible Forms

Below is the method they recommended.

<label for="name">Name:</label>
<input id="name" type="text" name="textfield">

Whether hidden labels have any advantage or not in ADA is still a mystery.

Upvotes: 2

Related Questions