Lesson 17 / 30

Labels & Fieldsets

Make forms accessible with label for, fieldset and legend so every field is announced and clickable.

label for + fieldset

<label for> matches an input's id; <fieldset> with <legend> groups related fields.

<fieldset>
  <legend>Contact Info</legend>
  <label for="email">Email</label>
  <input id="email" type="email" name="email">
</fieldset>

A proper <label> lets screen readers announce the field and lets users click the text to focus the input — not just cosmetic.