I think the easiest way to get to grips with HTML5 forms is to work our way through an example form. From the finest of daytime TV examples, I have one I made earlier. A minor introduction is needed.

Two facts: firstly, I love films. Secondly, I'm very opinionated on what is a good film and what is not.

Every year, when the Oscar nominations are announced, I can't help feeling the wrong films have got 'the nod' from the Academy. Therefore, we will start with an HTML5 form that enables fellow cinephiles to vent their frustrations at the continual travesties of the Oscar nominations.

It's made up of a few fieldset elements, within which we are including a raft of the HTML5 form input types and attributes. Besides standard form input fields and text areas, we have a number spinner, a range slider, and placeholder text for many of the fields.

Here's how it looks with no styles applied in Chrome:

If we 'focus' on the first field and start inputting text, the placeholder text is removed...