Chances are your company puts a lot of effort into driving customers and prospects to your Web site. The last thing you want is for them to be lost or confused once they get there, but that may be the case if your Web site navigation isn’t consistent, clear and easy to use. The fact is, anything that’s hard to use doesn’t get used very often. Users will quickly abandon a site that’s difficult to navigate for one where they can find what they are looking for.

How Good Navigation Helps Improve Web Site Usability

A good navigation structure allows visitors to find useful content and get around your Web site without getting lost. They will have a positive experience and this will increase your opportunities to generate leads and gain new customers.

Most Web sites make use of a navigation bar that runs horizontally across the top of Web pages or vertically down the left or right side. As sites have gotten larger and more content rich a combination of both horizontal and vertical navigation bars are used to reach multiple levels of product or service information.

A navigation bar should have the following characteristics:

• Appear in the same place on every page — don’t move the navigation bar around from top to side to bottom. Consistency is the key.

• Always have the same links — don’t switch the links on the navigation bar or change the order in which they appear.

• Have clear labels on links — the meaning of the link text should be clear and unique. Don’t use clever names that are not descriptive.

• Indicate the current page — one of the best ways to orient users on your Web site is to change the appearance of a navigation button or text to show what page the user is on.

A Four Tiered Approach to Web Site Navigation

Web sites with a lot of content need to separate the navigation into different major classes or types to aid users in reaching their destination. I recommend separating the navigation into four distinct areas as follows:

1 - Top (Horizontal) Navigation Bar - General Company Information
This area is reserved for the general content categories of your web site including overall company information such as About Us, News, Locations, Contact Us, etc. It should also contain a main Products link if the side navigation bar does not appear on the home page.

2 - Side (Vertical) Navigation Bar - Product or Service Categories
The side navigation bar should contain the primary product/service categories of your company’s product line. These are the most important links as this is where users will learn more about your product offerings. In addition, navigating the site can be greatly aided by using both primary and secondary navigation links in the side navigation bar.

3 - Secondary Navigation - Product Lines
Secondary navigation allows users to get to specific product line information within a primary product category. For example, a list of widget types might be the secondary navigation under a primary navigation link called Widgets as follows:

Widgets
- Type A
- Type B
- Type C

The web site shown below, from Yardley Products (www.yardleyproducts.com), demonstrates a good example of primary and secondary navigation working together. When a user clicks on “Standardized Molded-In Inserts” on the main navigation bar on the left, they go to the main products page for that category. Now the navigation bar highlights “Standardized Molded-In Inserts” and expands to show a secondary navigation for that section for the various types of “Standardized Molded-In Inserts”. In addition, all of the primary navigation links are still available to the user.

Example of an expanding left navigation bar

Secondary navigation typically is activated in one of two ways:

• On Mouse Rollover - Secondary navigation menus appear only when the visitor rolls his mouse over a primary navigation element. The benefit of this approach is it allows users to see the structure and get deeper into your Web site faster. The downside is that the user must have some agility with their mouse to follow the menus that suddenly appear on the page.

• On Mouse Click - Primary navigation expands to show secondary navigation when a primary navigation element is clicked. A secondary navigation menu is always visible in its category, but hidden when the user is in another category, such as in the example above. This method may be easier for users to navigate, but it takes up more space on the page.

Primary and secondary navigation is especially useful because not all visitors to your site will enter through your home page. Many will arrive deeper in your site and well thought out navigation will clue them to exactly where they are.

4 - Tertiary Navigation - Specific Product Information
Once a user navigates to a product line using a secondary navigation link there is typically too much information to be displayed on one html page. Therefore, I recommend added a third level of product navigation to aid the user in accessing the detailed product information that is usually buried deep within a site.

This is accomplished by splitting a typical page into three columns. A narrow left column is used for the side navigation while the center column occupies the majority the page and features the main product overview. A second narrow navigation bar is then located on the right hand side of the page. This Right Side (Vertical) Navigation Bar should contain links to more specific information about the product currently being viewed such as models, specifications, dimension drawings, literature, etc. I also recommend that it include a “call to action” link such as Request A Quote, Order On-Line, Request More Information, etc.

The example shown below, from Expansion Seal Technologies (www.expansionseal.com), demonstrates excellent use of the three column approach with a right side navigation bar containing deep product links with very specific technical information about the GripTight High Pressure Test Plugs product line.

Example of a three column web site design

When Users Get What they Want, You Get what You Want - Customers

Simplicity and ease of navigation are critical to helping users find exactly what they want. When users can easily find what they are looking for they tend to become customers. By simply using a four tiered approach to web site navigation this goal can easily be met.