O'Reilly logo

Web Design All-in-One for Dummies® by Sue Jenkins

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 7: Designing Web Forms
In This Chapter
Determining which data to request from visitors
Encrypting collected form data
Building validating Web forms
Using Dreamweaver’s Spry Form fields
Testing and publishing Web forms
I
f you have ever filled out an online survey, signed up for a Web site’s
newsletter, or purchased something on the Internet, you’ve probably
used a form. While the forms themselves come in many shapes and sizes, all
forms contain specific HTML tags, often combined with JavaScript or some
programming language, that allow sites to collect information from visitors
for a variety of different reasons, including to sign up for services, request
information, join a mailing list, purchase products, register for events, pay
bills, handle online banking, and much more.
Though not every Web site includes a form, as a designer you should under-
stand what forms are and how they work so that you are poised to build one
when the need arises. Furthermore, despite its somewhat compli-
cated sounding functionality, building a form in HTML is
pretty easy because you only need to use a handful of tags
to create the individual form fields. After you determine
which information you’d like to collect from visitors,
you can begin to organize the form contents into a
neat table format, complete with form labels on one
side and form fields for user input on the other.
After building the form in HTML, the next thing you
have to contend with is how to process that data.
Unfortunately, by default, all forms are unsecure
files. This means that any data collected could be
easily pilfered — unless you take certain security
measures. Though you might think that security
shouldn’t matter much unless you’re collecting personal
information like someone’s name and address or credit card
number, it does. Everything you collect is personal and requires pro-
tecting, from an e-mail address, account number, and username to whether
someone reads magazines about fly-fishing or is interested in receiving fur-
ther information about debt consolidation.
20_417966-bk03ch07.qxp 3/25/09 10:39 PM Page 391
Deciding What Visitor Information to Collect
392
In this chapter, you find out how to build a Web form in HTML, add
JavaScript validation to the form so that visitors will be assisted in complet-
ing the form accurately, insert and use self-validating Spry Form fields in
Dreamweaver, and submit the data collected from a valid completed form to
a remote location for secure processing. In addition, I briefly discuss form
encryption and other security measures you can take to help keep that col-
lected information safe.
Deciding What Visitor Information to Collect
To organize the layout of your Web form, take your cues from the informa-
tion you’ll be collecting from visitors. You may request any kind of data you
like, including the following:
Personal information, such as a visitor’s name, address, phone number,
fax number, and e-mail address
Purchasing information, such as items ordered, a credit card, a billing
address, and a shipping address
Private account information, such as a username, account number,
password, and password hint question
Miscellaneous information, such as visitor feedback and opinions, visi-
tor interests about a particular topic, or even something silly like the
visitor’s food preferences or favorite contestant on American Idol
Form information can be gathered from visitors using a variety of form
fields, including single-line and multiline text boxes, check boxes, radio but-
tons, drop-down menus, and buttons. Figure 7-1 shows an example of a typi-
cal form that includes several of the more common form fields.
Online transactions, as with transactions made in person, often require the
collection and sending of secure and personal data from one party to another.
By federal law, this data — whether collected online or not — provides
consumers and individuals with certain legal and ethical rights. For instance,
a site may not legally collect information from minors. Furthermore, every
Web site has a moral and legal obligation to inform visitors how collected
data may be used. Many sites include a link to a privacy statement or similar
policy that outlines what specific data the site owner is collecting and how
that owner may use that data or disclose it to other parties, affiliates, and
subsidiaries. To find out more about federal privacy laws, visit
www.ftc.gov/
privacy/
and www.usdoj.gov/oip/privstat.htm.
20_417966-bk03ch07.qxp 3/25/09 10:39 PM Page 392

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required