← HTML tutorial

HTML

Forms

The <form> tag wraps a group of input controls. A text field is an <input type="text">; pair each one with a <label> so screen readers — and simple mouse clicks — know what it's for.

Example 1: a labelled text field

<label for="name">Your name:</label>
<input type="text" id="name" name="name">

The for="name" on the label connects it to the input sharing that exact id. Clicking the label text focuses the input, and a screen reader announces the label when the field is reached — placeholder text alone can't do either of these things reliably.

Example 2: choosing from options, and submitting

<label for="track">Favourite track:</label>
<select id="track" name="track">
  <option>Frontend</option>
  <option>Backend</option>
  <option>Cybersecurity</option>
</select>

<button type="submit">Submit</button>

<select> gives a dropdown of fixed choices, useful whenever the answer must be one of a known set rather than free text. This example only demonstrates the markup — it isn't wired up to actually send anywhere, since that's a backend's job, covered in a different track entirely.

Try it yourself