Creating a Web Form - HTML, CSS, and Dynamic HTML - page 418

figure 6-24 viewing default values and placeholder text

d e fault value for
the state field

placehold e r text for
the receipt input box

Trouble? If you are using Internet Explorer or Firefox, you might not see any
placeholders in the survey form.

◗

6. Click in the input boxes that contain placeholders. Notice that the placeholders
disappear as soon as you click each input box.

Decision Making: Using HTML5 Form Attributes
HTML5 offers several useful features such as the placeholder attribute, but the specifica-
tion is still new and not universally supported in the browser market. This poses a problem
for Web designers who must decide whether or not to use such attributes.
One school of thought holds that differences in appearance and functionality between
one browser and the next confuse users and make it more difficult to manage the opera-
tions of a Web form. Thus, a feature like the HTML5 placeholder attribute should not be
used. If a Web designer needs placeholders in a Web form, they should be created using a
JavaScript program that can be applied uniformly across browsers and browser versions.
The opposing view holds that the best design is one that uses each browser to its utmost
capabilities, and proposes that a Web designer cheats users when the designer decides to
forgo an HTML feature that enhances the user experience, like the placeholder attribute.
Moreover, the Web will only gain in the long run as more HTML5 features are employed
because increasing their use will encourage more rapid support of HTML5 across the
browser market.
To decide between these two approaches, you must evaluate whether the HTML5 fea-
ture you're adding is critical to understanding and using your Web form. Do placeholders
add useful, but not essential, information for users? If so, there is little to be lost by adding
them. However, even if you want all users to have placeholders in their forms, applying the
placeholder attribute still can be useful as a quick and easy way of developing a proto-
type of your form for testing. Later, as you reach the final phase of development, you can
replace it with a JavaScript program that extends placeholders to all users.

You've finished the initial stage of developing the survey form. Alice is pleased with
the form's appearance and content. In the next session, you'll extend the form by add-
ing new fields and control elements, including selection lists, option buttons, and
check boxes.