Label
Labels are used to associate a label with a description.
Important! A
<label> is required on every <input>, <textarea>, and <select> element for accessibility reasons. Without them, people who navigate the web with a screen reader will not know what a form field is or does.
Usage
A <label> requires a [for] attribute.
It’s value should match the ID of the element it’s associated with. IDs must be unique. Clicking or tapping the <label> will shift focus to the associated field.
<label for="season">What's your favorite season?</label>
<input type="text" id="season">Implicit Label
If a <label> is wrapped around a field, it is associated with that field implicitly, and does not need a [for] attribute.
Kelp uses this approach for checkboxes and radio buttons, though you can use an explicitly associated <label> if you would prefer.
<label>
<input type="checkbox" name="awesome">
I love Pixar movies
</label>