This chapter covers the basic design principles that you will apply to your
Web page designs as you work through this book. By examining a variety
of Web sites, you will learn to focus on both the user’s needs and the requirements
of the content you want to deliver, while planning a site that is easy to
navigate and quick to download.
The sample Web pages in this chapter come from a wide range of sites.The
Web is so far-reaching in content and design that no collection of pages represents
what is typical. Most of the samples illustrate good design principles,
although some contain design defects as well. In truth, almost every site has
one flaw or another, whether it is confusing accessibility, overambitious
design, or poor download time. Judge the samples with a critical eye. Look
for elements of design that you can transfer to your own work. As you
progress through the book, you will practice and apply these principles to
your own Web design efforts.
When you complete this chapter, you will be able to:
- Design for the computer medium
- Create a unified site design
- Design for the user
- Design for the screen
Sample Web Sites
You can use these sites for design comparisons and class projects. The sites appear in the same order as they do in Chapter 2. Some of the Web sites in this list have changed their design since Principles of Web Design 3rd Ed. was published.
CSS Example Page (Figures 2-1 and 2-2)
Petco
Brooklyn Botanic Garden
Center for Disease Control
CDC kid's site - bam.gov
Ammerican Zoo and Aquarium Association
World Health Organization
Christian Science Monitor
E! Online
The Atlantic
National Center for Research Resources
Cabela's
United Nations
CNet
Pro Football Hall of Fame
U.K. National Maritime Museum
National Road / Zane Grey Museum
National Public Radio
National Gallery of Art
Case Project
Visualize the page design for your site by sketching a number of page layouts for different
information levels of the site. For example, sketch the main page, a secondary page, and a
content page.You do not have to be concerned with the exact look of the elements, but
be prepared to indicate the main components of the pages, such as headings, navigation
cues, link sets, text areas, and so on.
Start to organize your site. Create a visual diagram that indicates the main page, section
pages, content pages, and so on. Indicate the links between the pages. Indicate whether
you will provide alternate navigation choices such as a table of contents and site map.
Top