SITEMAP

Design > Sitemapping : Navigation : Screen Resolution : Spliced Sites : Info Architecture : Site Standards : Storyboarding : Tables Intro : Frames Are Evil : Table Tips : Proportionate vs Absolute : View Source : Consistency

navigation basics

It's a juggling act. On one hand, it's handy to be able to access any other page in a site from every page using the navigation bar. On the other hand, it's nice to have a clean, simple layout, uncluttered by irrelevant stuff. Unfortunately, unless your site is tiny, say five pages or so, it's unlikely that you can achieve both with one navigational system.

There are various ways to get around this, such as drop-down or expanding menus where they show you a list of subheadings when you roll over the main heading. There are accessibility issues with anything like that though, as it requires more than basic HTML to operate.

I usually try to have two basic elements to my navigation - Main headings (Primary Level Navigation) accessible from all pages, and placed in stable, unchanging positions throughout the site; and then the relevant subheadings for that category (the Secondary Level Navigation) on all pages within that category.

For example in this site, I have Primary Nav at the top (main site retrokat.com, sub-site web rescue and sitemap) and left (Intro, Starting etc). As you might have noticed, these bits have stayed in the same spot nomatter which page of the site you're on. I then have my Secondary Nav (pages within each chapter) as text-based navigation in the top of this column.

Another important function of navigation is to orient the visitor within the site. There should be something that indicates where they are. This site is a very large and complicated one, so I've used "breadcrumbing" at the top to show the viewer which page they're in, and which chapter - I've used the colour red to show "You Are Here". The term "breadcrumbs" comes from the Hansel & Gretel fairytale, leaving a trail to show where you've been so you can find your way back. It's especially useful if you have many levels of content, ie categories within categories within categories. This site, although large, has a fairly flat structure so it's probably not vital - I've used it more as an scondary alternative to the linear "Next Page" structure, which is the main way this site was designed to be read.

The sitemap, as previously mentioned, is also an important part of my navigation structure here (at the top right of each page). As the site's so gargantuan a visitor might be looking for a particular subheading / page title and not know which chapter it's likely to be in, so I've got a thorough Sitemap available throughout the site. Hopefully you can find what you're after there pretty quickly and with a minimum of clicks.

Another factor to consider is that some people may not be able to see graphics-based navigation, especially if you've used Javascript or any other non-HTML programming as I have here (for the Rollovers). For this reason, it's good to make sure there's a text-based alternative. Usually an "alt tag" will show for anybody (if you're on a PC you'll be able to see my alt-tags if you hold you mouse over my navigation wihout clicking), or alternatively they can use my text-based sitemap to find their way around.

Navigation Basics: