Joy Of Code web design online training

It's The Navigation, Stupid

By Bud Kraus
friendly@joyofcode.com
Joy Of Code
Creator And Instructor

This article is part of the Joy Gems series which originally appeared in The Joy Gems Newsletter and/or The Home Page Helper Network on ryze.com, a business networking community.

Download this article as an Adobe Acrobat file.

I believe that a web site's navigation is more important than the content itself. More important? That sounds nuts.

But you know this to be true: Mess up your site's navigation and its interface and you're toast.

Hold on here. This is counter intuitive. Am I saying that the most important element to a site is its method of linking one page to another, and not what is on the page itself? Can I really make that claim?

I am in the process of making over the site for joyofcode.com. I'm trying to resolve what's the best way to provide an elegant and efficient way for users to access my content while educating them as to the nature of my site as they move from page to page. (Experts call that orienting the user to the site's content.)

Bud don't site visitors come to a site to be entertained or informed by its content? Isn't the content of the site the most important element? One can certainly make a strong case for "Content Is King." However, once the user is at a site, content won't be king very long if the user is unable to get what they originally came there for. I'm talking about navigation, and specifically, the way links are grouped, organized and presented. Good navigation not only allows users to move from page to page, but also serves to quickly inform the user about the nature/purpose of the site itself.

The organization of your page links and your choice of navigation interface - what your navigation looks like and how it is to be used - will go a long way in determining whether your site succeeds in doing what you intended it to do.

Here are some of the issues I see and how I'm going to resolve them.

1. What's My "Click Away" Rule?

What is the maximum number of clicks a user needs to reach any other page?

The number for my present site is "one click away." I like that, but I'm now going to a "Two Clicks Away" rule. All of my pages, except for the Articles section (which will archive these Joy Gems Newsletters) will be reached in two clicks. This option allows me to organize my links in a deeper way, giving the user a drill down experience. When a site is "One Click," we get the feeling that each page has the same relevance as all the other pages. The two click rule should give you the feeling of moving from the general to the specific in my information space. Some pages are more important than others. Two clicks away will help give the site depth.

What I want to avoid is "three clicks away," a practice to which many users object.

2. Do I need a search tool? What about a Site Map?

The answer would be "no" were it not for the Articles section. Leaving that section out, my site will be about 25 pages and two clicks away. That would not seem to necessitate adding a keyword search tool.

Because the Articles section will be large, and growing at least once every two weeks, a search tool is the way to go rather than have every article available through a link. However, the links to all of the articles will be listed on the Site Map. I like a site map because it gives the user a visual representation of how the site is organized. All the content of my site will be one click away from the site map page.

3. What Kind Of Interface Will I Build?

I'm going with XHTML and CSS. I'll use list markup to organize my links which are the backbone of the navigation interface. CSS will dress it all up and I'll use the CSS background property to add a small image (a bullet) to the background of each link.

The XHTML/CSS approach will aid in site accessibility and give the search engine robots a better chance to scan and index my site.

My pages will be much lighter and easier to download compared with navigation interfaces that use table markup, rollovers, and Javascript. That approach is pretty beat and not likely to make a comeback.

There will be style issues to resolve. I'll be paying attention to the use of color, typography, and background images in the interface to help orient the users as to where they are in the site. Other issues no doubt will come up, such as whether to use "bread crumbs."

4. Where Will The Interface Be Positioned On The Page?

Users have come to expect certain conventions in web page design and one of them is where the navigation interface is positioned. Do I want a top horizontal approach? How about top left or top right or some combination of these?

What about using CSS to make the interface move down and up the page as the user scrolls, thereby keeping it in view at all times?

So many things to think about, but if you're into user centric design as I am, the way to put your users in the center of the design is the navigation interface.

It's The Navigation, Stupid!!

Top Arrow