HTML and CSS Reference
In-Depth Information
Overview
As you read this chapter, you will learn how to create the Web page form shown in
Figure 6-1b on the previous page by performing these general tasks:
Open an HTML file in Notepad++.
•
•
Enter basic HTML tags and add text to the file.•
•
Insert tags to create a form with several input controls.
•
Create Submit and Reset buttons on the form.
•
Add interest and organization to the form using <ieldset> and <legend> tags.
•
Add an embedded style sheet to format specific elements on a Web page.
•
Save, validate, and print the HTML code.
•
View and print the Web pages.
Plan
Ahead
General Project Guidelines
As you create a Web page, such as the project shown in Figure 6-1 on the previous page,
you should follow these general guidelines:
1.
Plan the Web site.
You should plan the information that you hope to collect before you
begin to write your HTML code. Refer to Table 1-4 on page HTML 15 for information
on the planning phase of the Web Development Life Cycle. In this phase, you determine
the purpose of the Web form, identify the users of the form and their computing
environment, and decide how best to capture the information sought using a Web page.
2.
Analyze the need.
In the analysis phase of the Web Development Life Cycle, you should
analyze what content to include in the Web page form. The Web development project
in this chapter is different than the ones completed in other chapters because it contains
a form. Part of the analysis phase then includes determining what information to collect
and the best form input controls to use for this collection.
3.
Determine which types of controls to use.
The type of information a form is intended
to gather dictates which controls are used in the form. For instance, in the case in which
only one option from a list can be selected, you should use the radio button control.
In the case in which more than one option can be selected, you can use check boxes or
selection controls. If you want users to be able to add their own comments, you can use a
textarea box. Most forms use a combination of controls, not just a single type.
4.
Establish what other form options are necessary.
Form organization is an important
aspect of Web page form development. You want to be sure that the user understands
what information to provide. You also want the form to be attractive and easy to use.
Consider using fieldset and legend tags to divide the form attractively and segregate
information into logical subsets.
5.
Create the Web page form and links.
Once the analysis and design is complete, the Web
developer creates the Web page form using HTML. Good Web development standard
practices should be followed in this step. Examples of good practices include utilizing the
form controls that are appropriate for specific needs.
6.
Test the Web page form.
An important part of Web development is testing to ensure
that you are following the standards recommended in the early chapters of this topic. In
this topic, we use the World Wide Web Consortium (W3C) validator that allows you to
test your Web page and clearly explains any errors you have. Additionally when testing,
you should verify that all controls work as intended. Finally, both the Submit and the
Reset buttons should be tested.
When necessary, more specific details concerning the above guidelines are presented at
appropriate points in the chapter. The chapter will also identify the actions performed and
decisions made regarding these guidelines during the creation of the Web page shown in
Figure 6-1.
