How to Use Input Tags in HTML5 Forms

By Ed Tittel, Chris Minnick

The tags you use to solicit input from your site visitors make up the bulk of any form. HTML supports a variety of input options, from text fields to radio buttons and from files to images.

Every input control associates some value with a name:

  • When you create the control, you give it a name.

  • The control sends back a value based on what the user does in the form.

For example, if you create a text field that collects a user’s first name, you might name the field firstname. When the user types her first name in the field and submits the form, the value associated with firstname is whatever name the user typed in the field.

The whole point of a form is to gather values associated with input controls, so how you set the name and value for each control is important.

The <input> element (and by extension, the empty <input … > tag) is the major player when it comes to using HTML forms to solicit user input. Inside the <input> element is where you define the kinds of input you want to collect, and how you package and present the input fields and cues you present to users so they can give you what you’re asking for.