44 Chapter 3—Intelligent Forms
Older browsers do not have a problem with autofocus, because they simply ig-
nore the unknown attribute. Of course, you only get the benefit of user friendli-
ness with new browsers.3.2.2 Placeholder Text with “placeholder”
Usability of HTML forms can be further improved with the new placeholder
attribute:<p><label for=email>Your e-mail address:</label>
<input type=email name=email id=email
placeholder="[email protected]">
<p><label for=birthday>Your date of birth</label>
<input type=date name=birthday id=birthday
placeholder="1978-11-24">The value of placeholder can give the user a quick hint about how to fill in the
field, but it should not be used as an alternative to the label element. It is partic-
ularly useful for fields where a certain data entry format is expected. The browser
displays the hint text within an inactive input field. As soon as the field is acti-
vated and is focused, the text is no longer displayed (see Figure 3.5).Figure 3.5 The “placeholder” attribute in Google Chrome3.2.3 Compulsory Fields with “required”
required is a boolean attribute, and its name already says everything about its
function: A form element that this attribute is assigned to must be filled in. If a
required field remains blank when the form is sent, it does not fulfill the require-
ments and the browser must react accordingly. You will find more information
on this in section 3.4, Client-side Form Validation.