0Pricing
HTML Academy · Lesson

The label Element and Accessibility

Associate labels with inputs for screen reader support.

Why Labels Matter

The <label> element associates a text description with a form control:

  • Screen readers announce the label when the input is focused
  • Clicking the label activates the associated input
  • Without a label, screen reader users do not know what a field is for

Explicit Label with for

The for attribute links a label to an input by id:

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

<!-- for="email" matches id="email" -->
<!-- Clicking "Email address" moves focus to the input -->
<!-- Required for proper accessibility -->

All lessons in this course

  1. The form Element action method enctype
  2. Input Types text password email number tel
  3. The label Element and Accessibility
  4. The button Element submit reset button
← Back to HTML Academy