Website Navigation – the 10 cardinal rules

First things first, what exactly is the definition of website navigation?

There are actually 2 aspects to this, the first is having a menu and the 2nd is how usable the menu is.

The menu enables visitors to go directly to specific known parts of a website.

Almost every good website has at least one menu and ideally a search feature for finding information if the menu feature is not intuitive enough for the visitor to find what they want.

Remember we are all individual and unique in our own ways, what seems obvious to one person may be an enigma to another.

Having the search feature is a fall back or contingency option that might keep someone on your site log enough to find what they were looking for, ideally it shouldn’t be needed but for large complex websites with lots of pages and subjects it is actually pretty much unavoidable from a practical viewpoint.

The 2nd aspect of usability is in other words how easy the menu is to figure out and be put to use.

Typically figuring out how to use a menu needs to take seconds rather than minutes and most people visiting a website would not spend more than perhaps 20 to 30 seconds trying to figure out a menu before they are off back to Google and looking for what they might consider to be a better site on the same subject that has a menu they understand immediately.

If you use tools such as Google analytics you can see this affect through the bounce rate, i.e. how many people leave your site almost immediately after landing on it, the other reason for leaving is of course that they don’t think it has the information they were looking for, but that is another subject.

So here are the 10 rules

Functionality – the menu must not get in the way of the websites function, people usually come to a website either to get information or to buy something and normally they want to do that as quickly as possible then leave again as soon as they are done. The menu must not get in the way of that, ideally it should be barely noticeable that the menu is being used, it really should be that easy, if people are having to stop and think about where to go next then the navigation is not functioning optimally.

Identifiable – the menu must be very easy to identify and must stand out from the content of the website, think about how many times you have visited a website and could not tell the menu system from the actual content of the website. The result being that you click a couple of times on what you think are links and nothing happens. You don’t do that too often before you are off and looking for a different site.

Readable – very much common sense but I think we have all come across websites where readability has given way to artistic license, a really fancy font or very subtle colour differentiation that ulitmatley results in illegibility. So text and graphics must contrast sufficiently with their backgrounds to be readable and chosen fonts must be clear and large enough to see. The equation of resolution versus load times must also be carefully balanced, a high resolution may provide images that are very sharp but if set too high it can cause the website to load too slowly, back off a little on resolution and the difference will probably be barely discernible, if at all, but the page will load much more quickly and keep the visitor interested.

Scan ability – the menu items must jump out from the background and be obvious, this is because it is a matter of fact that people scan when they look at website pages they do not read to great levels of detail. For that reason and reasons already mentioned the menu items need to be short, succinct and clear as to their function. For example a button that says ‘Home’ will clearly convey it’s message, whereas a block that says ‘to go to the home or index page of this website you need to click here’ is not what you could consider a scan able link. A ridiculous example but does make the point.

Operable – the normal general user interface for a website is to use a mouse which controls some sort of pointing device. The target for this pointing device firstly needs to be large enough and secondly sufficiently spaced out from other links to ensure that the visitor can select the link of choice with ease and does not end up in the situation of having difficulty selecting their chosen link or even worse selecting the wrong link.

Expected behavior – this refers to following known standards, without getting too technical there really is no such thing as intuition but there definitely is familiarity, just think of windows based menus on their standard software packages. In other words when people are familiar with functions, it means they have already learned how to use them. So if you follow known standards for presenting navigation systems you are half way to the system being usable by people already familiar with those methods of navigation. This does not mean you can’t be inventive or come with new and interesting ways of doing things, but you need to be sure that the new ways are easy to learn and provide enough of a wow factor to make them worthwhile.

Load speeds – not just pages but also menus need to load very quickly, for some reason people using the internet tend to start to get frustrated as quickly as a couple of seconds and actually start to think their PC has locked up if they have to wait longer than about 8 seconds. Little tricks like saying the page is loading may help a little but ultimately if the navigation system does not load quickly enough then your visitor will again be heading for the back button or Google search page.

Usability versus branding – make sure that usability takes precedence over branding, if the corporate colours, graphics and logos cause a website to become un-navigable then it is the branding that must compromise. The sweetest images in the world will not keep a visitor on the site if they cannot get to the information or product they want.

Handicap accessibility – blind or visually impaired people may not be able to see your menu system and may have to use an electronic braille reader or voice system to navigate your site. These types of system rely on plain text or alternative addresses to interpret menus so you need to make sure that those tools are employed as standard on your websites.

Multiple Browsers – be aware that not everything you do will necessarily work on every browser, so you need to check your designs on a range of browsers and ensure that they work to an acceptable standard on at the very least the most popular browsers being used.

These rules are important and it is possible to follow them without compromising artistic intent which is another very important factor of website design. If you can keep to these rules while at the same time wowing your visitors with artistically stimulating presentation then you will have achieved the ultimate combination for getting and retaining visitors on your website, providing of course you meet the prerequisite of having useful and or interesting information on the site in the first place.