Understand

Accessible forms work for keyboard and screen-reader users too.

A <label> names an input. Link them by matching the label's for attribute to the input's id. This lets users click the label to focus the field and lets screen readers announce it. Accessibility is not optional polish — it is part of doing the job right.

Analogy: A label tied to its field is like a name tag firmly attached to the right person.

See It in Action

A properly linked label and input:

<label for="email">Email</label>
<input id="email" type="email">

Try It Yourself

1. Add id to an input and matching for to its label.
2. Click the label text and confirm the field focuses.
3. Check every field in your form has a label.

Challenge

Make every field in your contact form use a correctly linked label.

Success condition: Clicking any label focuses its matching input.