Getting your navigation right

Navigation is possibly one of the most important things to get right when it comes to designing a website. Making sure it is readable, in the right place and looks good can make a massive difference to the users experience.

You can create a visually stunning landing page with graphics here and there, flashing lights and superb content, but if the navigation is hard to find or read, the user will get fed up and leave. I have found this on a few occasions. Consistent navigation is one of the few elements which provide users with some sense of orientation and to guide them through a site. Users should be able to rely on it which is why web designers play around with it too much.

Which design to go for?

There are a number of methods for navigation, I will go through just a couple of them (The standard ones) that work well and help attract users for easy navigation around your site.

Block Navigation
There has been a growing trend towards block navigation due to it’s functionality. Web designers attempt to explain what the visitor should expect from the page they are heading onto by having the main page name as normal and a short descriptive few words underneath.

The example below shows this working beautifully. Please click the image to visit the respective website.

Using Icons

Using icons on your navigation is another popular method, not only can they look good and attract the users eye to them but they also help define what the page they are about to click on is all about. The typical icons you see a lot of are little houses for the homepage, a envelope for contact pages and shopping carts for products pages. There are some great icons out there for other types of pages, and it doesn’t take a lot of searching to find some really nice ones.

Again please click on the images to view the websites these are found on.

I could list a few more styles such as vertical text navigation, but some users find this harder to read than horizontal links so I stay clear of this. There is also the “mac style”, this was great when just apple used it and a few other sites but as popularity grew so did enthusiasm for it.

The two examples I have shown are my favourites and I use them more than any other form of navigation. I personally feel they work well design wise and usability wise as well.

I would like to know which styles you guys go for and what you think makes navigation user friendly yet still graphically appealing.