Tip 7
Providing Hints with Placeholder Text
Placeholder text provides users with instructions on how they should fill in
the fields. It’s not meant to be a replacement for the <label> tag; it’s meant to
give users an example.AwesomeCo’s support site requires users to sign up for an account, and one
of the biggest problems with the sign-ups is that users keep trying to use
insecure passwords. Let’s use placeholder text (see the following figure) to
give users a little guidance on our password requirements. For consistency’s
sake, we’ll add placeholder text to the other fields too.Figure 6—Placeholders can help users understand what you’re asking them to do.
To include placeholder text, we add the placeholder attribute to each input field,
like this:html5_placeholder/index.html
<inputid="email"type="email"
name="email"placeholder="[email protected]">Chapter 3. Creating User-Friendly Web Forms • 50
Download from Wow! eBook <www.wowebook.com> report erratum • discuss