This lecture, and this page, is meant to help you think a bit more about helping your users/readers/visitors navigate the Web site they are visiting. The point of any Web site, journalistic or not, is to provide the visitor with the information she is looking for. If she doesn't find it within three clicks, as the Web design axiom asserts, she'll look elsewhere. She'll leave your Web site with what Jakob Nielsen, who we visited last week, would probably call a "poor user experience." If you're the person who designed that site, you should be worried.

That means that how you layout the tools meant to help your visitors use your page should be among your primary concerns. Visitors, old and new, have come to expect certain "helpers" on a Web page. If they don't find them on yours, they'll click-away very quickly. One of those helpers is a navigational scheme that is consistent no matter where they find themselves on your Web site. The most commonly used forms of navigational helpers we find on the WWW today are:

1. TABS (usually arrayed along the top of the Web page)
2. SIDE NAVIGATION BARS (sometimes using "mouseovers" and sometimes not; sometimes using a simple text link in a table, something using a graphic or text-graphic), and
3. the venerable and reliable simple TEXT LINKS.

As a rule of thumb, I would suggest that you always decide what type and depth of information you wish to provide on a given page, and prepare its supporting elements (graphics, javascripts, streaming media) before you begin to design the page itself. [Some of you are probably now exclaiming: "Why didn't you tell us that before you gave us the assignment of designing our own pages this weekend, Rod!"

My response: What fun would that have been?]

Link Types

All of the foregoing are concerns that you as Web editor or publisher should have in mind as you consider the usability and functionality of the site you are building. In the final analysis, they will impact how people remember your site and its contents.

About Preparation

1. I did a list of the elements this page would need, especially the graphics that would make it attractive and the links that would support the thesis presented.
2. I created a folder into which all graphical elements, both pictures and text graphics, would be placed.
3. In Adobe Illustrator, I created the text-graphics used in the navigation bar to the left, along with mirror-image "mouseover" copies for a future consideration.
4. In Adobe Photoshop, I resized the text graphic images from 300 dpi (dots or pixels per inch) .tif (TIFF) images down to 72 dpi (the standard for Macintosh computers) images to save on bandwidth and load time.
5. I optimized all the images in my graphics folder for the Web as .jpgs using Photoshop's "Save For Web" feature in order to increase the speed at which they would load on the page and save additional bandwidth in transmission.
6. I wrote and edited the final draft of the essay you are reading.
7. I performed a number of Search Engine queries to find additional (and in some cases more up-to-date) articles to support the original thesis that were not included in your syllabus.

When we get to our discussion of database-driven Web sites, like Slashdot (see below), you'll see how much of what's called the "backend" of a Web site can be more time-consuming and detailed oriented than the front end, or page, itself.