HTML & CSS: The Good Parts

Form Features in HTML5

HTML5 initially focused on adding new features for HTML forms. It may be the area where HTML5 makes the largest changes, but it’s still in development. This section gives an overview of the form features, and supplies details about a couple of features that, while currently not as well known as some other new features, nonetheless have great potential to have significant impact on end users.

New Input Types

HTML5 forms improve on HTML 4 forms through the addition of the following 13 new types of input controls:

• datetime (global date-and-time input)

• datetime-local (local date-and-time input)

• date (date)

• month (year-and-month input)

• time (time input)

• week (year-and-week input)

• number (number input)

• range (imprecise number input)

• email (email address input)

• url (URL input)

• search (search field)

• tel (telephone-number input)

• color (color-well control)

These new input types offer a major improvement to authors: in the case of any of the new types that have a special user interface associated with them, the user interface is handled natively by browsers, instead of requiring authors to write their own JavaScript code or use JavaScript libraries. For example, for color input, the browser generates a color picker that allows users to select a color by pointing and clicking; for date input, the browser generates a calendar picker. Providing users with a GUI control for those kinds of input types also provides a built-in (as opposed to bolt-on) mechanism to ensure that users can only ...