When building a website, getting the navigation right is absolutely critical. A poorly conceived approach to site navigation will confuse and frustrate users, and this isn’t the way to get a lot of people using your site.
A big part of this challenge is that you don’t always start with a lot of links, but more may be added as the site develops. This means that the original navigation concept may not work as well as it once did.
To help you address these issues and prevent some others from occurring, here are 6 tips for building a site with coherent navigation.
1. Use Colour Coding
Make sure your navigational areas are easily distinguished and/or separated from your content. If everything seems to mix together – think of the content and navigation bar sitting alongside each other on a white background – it’ll look a bit messy. A messy navigation bar isn’t much fun to use.
2. Group Related Links Together
To avoid link overload, consider having multiple navigation bars, separated into logical groups. For instance, on one of the sites I run, I have core links (home, blog, about) at the top, functional links (dashboard, account history, settings) down the side, and legal/privacy links across the bottom. This allows you to keep each set of links relatively tidy, and it’ll be easier to find the links you need.
3. Use Icons to Aid Navigation
Graphical aids can really bring your navigation bar to life, making it both visually pleasing and easy to use. FamFamFam has some good icons – and there are plenty more on Google if you want to look for something else.
4. Handle Hierarchy Consistently
Whether you have collapsible menus that appear as you navigate to a section, pop-out menus that reveal themselves when the mouse cursor hovers over them, or sub-pages with links to more pages, try to be consistent as much as you can. Mixing too many techniques can result in an uncoordinated mess.
5. Separate Non-Navigational Elements
If your navigation is getting quite busy, it may be time to remove things such as the search box from your navigation bar, along with any other features that get in the way of the site navigation. While it’s possible to achieve a slick, streamlined site by condensing several core elements into the header and/or the sidebar, this doesn’t work so well as you add more and more links. Don’t feel the need to use every available bit of white space. And don’t put ads in the way of the navigation.
6. Make it Flexible
If the design of your site makes it almost impossible to add any new navigation links, it won’t be long before you start to hit the limits of the design. Where possible, future-proof your site by ensuring the design is as fluid as it can be. While a horizontal navigation bar doesn’t leave a huge amount of scope, it could wrap onto additional lines. A vertical navigation bar shouldn’t break once you add more than 10 links to it. If you build with long-term growth in mind, you’ll have an easier time if you do add more links at a later date.
Do you have any other tips for building coherent site navigation?
Photo by sfxeric
