Building Web Sites All-in-One For Dummies® (15 page)

Page footer

You should put a footer at the bottom of every page, where the footer belongs. Important elements to include in the footer are copyright information, links to any legal or privacy policies you include on your site, contact information for your organization, and so on. It's also a good spot to put contact information for your Webmaster, the date the page was last modified, the global navigation mirrored as text links, and Web production credits. In Figure 2-8, you can see the footer that appears on the Web page for The Kreisau Project.

Planning How to Emphasize Important Information

A well-designed Web page draws the user's attention to one key piece of information without that element looking so far out of place that it looks wrong. Planning for where and how you'll emphasize an element on your site saves you time later. You'll already know how to handle that special announcement before you have to add it. A little planning now also prevents strange or awkward-looking retrofitted elements, so keep these points in mind:

•
Emphasis is good, but your page can have too much of a good thing.
Good Web designers tend to break a page into three levels of emphasis. Use one major piece of information on the page, with the second and third levels being lesser pieces of information. Convey the emphasis to the visitor by using text size (larger equals more important) and text position (higher and in the middle equals more important). You can also use color to help convey emphasis.

When using color to show emphasis, be careful! Too many colors can make a page look garish. Another consideration is that many people might not be able to see the colors as you see them. For instance, a user might be color blind or visually impaired, so make sure you incorporate more than one cue to bring the visitor's attention to your major point of focus. We discuss usability and accessibility further in the next section.

•
Be sparing in your use of special font treatments to create emphasis.
Keep the number of treatments to a minimum to avoid visual confusion and amateurish-looking pages. Keep it simple. Plan areas for headings and for content text for any special promotional items you need to include on your site. Make sure that these elements match the look and feel of your site. Don't create elements that clash with the rest of the site; it creates a bad impression for your site and organization and also confuses visitors. Remember, no one will be standing there to explain your design choices to your users. The site must convey its message all by itself.

•
Remember that nothing is emphasized if everything is emphasized.
If too many elements are fighting for attention, the site is difficult to use, and visitors are confused by too many messages that demand equal amounts of attention. This sort of thing can make users feel bombarded, and they'll miss out on the information you're working hard to make available to them — or worse, they'll leave your site and go to one that doesn't confuse or assault them.

Understanding the Basics of Usable and Accessible Design

If you spend any time around Web site design projects, usability and accessibility are words that you hear a lot.
Usability
refers to how easily your visitors can use your site, and
accessibility
refers to how well your site performs on technologies other than browsers and/or for visitors with disabilities. As often happens, these are two more buzzwords thrown into a presentation to sound impressive. Unfortunately, in practice, these concepts are generally misunderstood or overlooked.

Everyone involved in a Web project knows that people view Web pages using a computer and browser. Often overlooked are the increasing numbers of other devices, such as handhelds and cellphones, that are Web enabled. And don't forget about screen readers and screen magnifiers, which enable users who are blind or have limited vision to use the Web.

From screen readers for visually impaired users to handheld devices, people are visiting sites in many different ways other than traditional browsers. You want your site to be easy for them to use.

Usability and accessibility are vital to the success of a site. If visitors can't understand or use your site, they'll leave and not return. To prevent that scenario — and to ensure usability — consider these points when planning your site:

•
All clickable or otherwise interactive elements need to work, and they all need to work as expected.
This means that if a button reads
Click Here to Search the Site
, clicking that button activates a search function — or at least brings the user to a site search function. It should not, for example, launch a photo gallery — or worse, do nothing at all.

•
A site should download quickly, and the content should be easy to get to.
In general, navigation of a site should be easy to figure out and easy to remember. Visitors don't like frustrating navigation or confusing content structures. Try to keep everything within just one or two clicks away.

•
Make sure you plan ways for your site to react to human errors.
Your visitors sometimes make mistakes, especially if you have forms or other types of interactivity. Try to make correcting an error easy for your visitors. If making a mistake throws a visitor completely out of a transaction, he won't appreciate having to start all over again; he might, instead, abandon the task and not come back.

•
Your image counts.
People do assess an organization by what its site looks like. Try to remember that visitors might have only one impression of an organization — its Web site. If it looks amateurish or inappropriate, they're less likely to trust the site. You could lose valuable visitors/customers to a competitor that has a better-looking site.

Accessibility shares many of the same considerations as usability but also brings a few more items to keep in mind:

•
Make sure that images, especially navigational ones, are properly tagged for screen readers.
The following code is a sample of an HTML image tag. For example, a screen reader that detects the code that follows reads
artwork sample
to the user. Using descriptive tags like this is vital for visually impaired users. Without them, a page can become confusing or tedious to visit, depending on how their reader deals with untagged images.

•
In addition to color coding, use a secondary method of emphasizing information.
Color coding is good for some people but not so good for color blind and visually impaired people. Make sure you group content by using positioning, headings, and other visual cues (icons) to separate content.