Add labels to inputs.

When you are displaying a form with input fields, use labels for each input:

<form>
  <label for="lastName">Last name:</label><input type="text" id="lastName" accesskey="l" />
</form>

The "for" attribute of the label needs to have the same value as the "id" attribute of the input.

Clicking on the label sets the focus to the corresponding field. This is especially useful for radio buttons and checkboxes. Try it in the example form below.


Using the accesskey attribute allows the user to navigate to the input field by pressing the alt key at the same time as the access key. Note that this can cause problems as browsers often use the alt key to access menus.