Navigation - Not Confusion
Published: Friday, October 10, 2003
The importance of an effective navigation
An effective navigation allows visitors to find what they are looking for quickly and easily. Designing an effective navigation can also help to direct visitors to other offerings on your site. It is also necessary that the search engine robots can read the navigational links in order to spider (or index) your site.
Creating an effective navigation
Site navigation can be of various types depending on the type of site. For example, a news site will provide navigation to the latest news (current or maybe a few days old) on the cover pages. Because of the sheer amount of pages of news articles, it is impossible to link to each item that appeared in its lifespan. On the other side, a smaller site will probably be able to link every item from its cover page (homepage).
The goal of an effective navigation is guided by the 3 click rule (all pages on the website can be reached within 3 clicks from the homepage). This rule applies to search engines also, where pages more than 3 clicks away are not indexed.
- Categorize content, products or services: Create smaller categories for organizing the content, products or services. The categorization may be logical, alphabetical or as applicable. The categories can be arranged in a tree structure with several subcategories. Hence it can be several levels deep. Create a navigation panel specific to each category and place it in the left or top panels so that the user can view all links within that category without scrolling. This navigation panel will change when the user moves from one category to another.
- Centralize navigation menu: Centralize the navigation menu on a separate navigation file. Using server side include code, add that navigation file to each page that belongs to the category. This will reduce maintenance worries if the navigation
menu is changed or updated. Only one navigation file has to be updated instead of each of the web pages.
- Provide link to home page: Provide a link to the home page from each page so that the user can return to the main page if lost. This can be achieved by creating a 'Home' link. In addition, add a link to the home page on the logo image.
- Use breadcrumb trail: A breadcrumb trail provides a quick way for the user to know what section or branch this web page is in. A breadcrumb is useful if the website has a lot of categories and each category is few levels deep. A good example will be a directory such as Yahoo or DMOZ.
- Include links to related items: Related links placed at the bottom or right side allows visitors to navigate to similar or related items or content directly. Provide clear and descriptive information about the related link so the user knows what to expect on that page.
- Include a search box: A search box can often solve the most complex navigation problems. A search box is very helpful for large websites. If your site has one, include the search box in every page at the same location. There are some free site search providers such as Google.com or FreeFind.com.
Tips & tricks
- Use server side includes for centralizing navigational link code.
- Place main navigation within the top 500 pixels of the website so that the user does not have to scroll.
- Make use of the link text wisely so that it is easy to understand.
- Avoid using image graphics for navigation. Image navigation may be obviously clear to the web designer, but may be confusing to some users. Use plain text or images with text descriptions.
- If images are used in the navigation menu, include an image alt text for usability purposes.
- Avoid using complex image rollover navigations. They may look elegant, but adds to the file size of web pages and takes longer to load.