Forms

Before HTML5, adding pieces of a user interface, such as date pickers, placeholder text, and range sliders, into forms had always needed JavaScript. Similarly, there had been no easy way to signpost to users the kind of data we expect them to input into certain fields—for example, whether we expect telephone numbers, email addresses, or URLs.

The good news is that HTML5 largely solves these common problems.

We have a few main aims in this chapter—firstly, to understand the possibilities of HTML5 form features; secondly, to understand how we can lay out forms most simply and with the latest CSS layout methods; and finally, to understand which of the HTML form elements can be easily restyled, and which should be left alone.

In this chapter, we will learn how to do the following:

• Easily add placeholder text into relevant form input fields
• Disable autocompletion of form fields where necessary
• Set certain fields to be required before...