7 Tips for Effective Website Navigation

I’ve seen a lot of bad websites over the years.  As a web designer and developer, I look critically at websites for my clients so that I can identify problems and improve on them for the sites that I build to be more effective than the sites that I am replacing.  One area that I often see consistently done poorly is site navigation.  It may seem like a very simple thing, but it is tremendously important to get it right.  In this article, I will review some dos and don’ts for website navigation.

1. Lose the Home Link

We’ll start with something very easy.  Almost every DIY website has a home link as the first link in the navigation.  While that would be the best place for it, a quick survey of major brands (who spend a lot of money on user experience research) will show you that Home text links are a thing of the past.  It has become a convention to link the site logo to the website’s front page instead.   Foregoing the home link helps simplify the navigation, which brings us to our next point.

2. Minimize the number of top-level links.

When little thought is given to website navigation, the top menus tend to get very long.  This causes a few problems. 

For mobile navigation, most websites automatically change to a hamburger icon and some sort of off-canvas menu, but narrow desktop and tablet devices often break the header layout when the navigation runs into the logo, and things either overlap or start to wrap.  This looks very amateur.

Perhaps more importantly, a lot of top-level items dilute the power of each of the other top-level links.  A navigational hierarchy is important in making content easy to find.  If you have three main product lines, for example, grouping them under Products makes more sense than having three links for your products at the same level as an about page, contact page, etc.

As a general rule of thumb, I try to keep the number of top-level items to 4 or 5.  It’s long enough that you don’t need to open the nav before you start but short enough to make it easy for users to quickly peruse the top level and make an intuitive choice about where to go next.

3. Don’t be afraid to use Secondary Navigation

It’s not always possible to get all your pages to fit neatly under those precious few top-level navigation items.  In this case, using a secondary menu is a viable approach.  Secondary is often found in a top bar above the main header bar.  If you decide to employ it, you want to make sure that you keep a visual hierarchy.  The Secondary menu links should be visibly less prominent than the main links, especially because they are higher, and all other things being equal, that would make them more prominent.

Like Primary Navigation, you want to limit the number of items in the list and avoid using it as a trash can where you put links you can’t be bothered to find a proper home for.  One approach might be to have the main navigation focus on products and services and the secondary navigation focus on company information.

4. Make Use of Mega Menus

Megamenus or panel menus are commonplace for websites with more than a few pages.  The common dropdown menus become cumbersome when they require multiple levels to get to a piece of content.  Megamenu links allow you to display multiple levels of navigation at once, keeping the user from having to navigate forwards and backwards up and down the navigation if they aren’t exactly sure where to go.

Mega Menus are often laid out in columns but may also include content like images, maps, forms, etc, which allows the user to find some pieces of common information without having to load another page at all.

5. Include a Call to Action

Another convention in modern websites it to display the right-most nav link in the primary menu as a button, pointing to the website’s primary conversion action.  This sends a clear message to the user about what you want them to do. Providing clear calls to action is a proven way to make your website more effective, and most of us have become conditioned to look to the top-right corner for a quick conversion action.  You may see a second call to action, but this needs less prominence.  Having two equal calls to action can be a little confusing.  You may find that neither one performs as well.

6. Some pages are best left to the footer

There are pages which are important to have on a site but should be left out of the primary navigation.  The most obvious class of page that should be deferred to the footer is the legal policies.  Your Privacy Policy, Terms of User, Disclaimer, and Cookie Policy provide some degree of legal exculpation.  Ultimately, they do not help sell your products or services.

Employment pages can usually be left for the footer unless the company is actively and aggressively recruiting talent.  If people are motivated to work for you, they will find the page in the footer.

Some companies may also find that their About page is best left in the footer.  This may seem strange as the About page is conventionally right after the now nonexistent home link, but it does relate more indirectly to sales/conversions than products and services.  Your company history and team are probably much less interesting to people outside your company.  A possible exception to this would be nonprofit organizations, where things like the mission often relate directly to donations, which are often the primary conversion action.

7. Avoid Social Links

Almost all website templates include social media links in the header or main navigation.  Just because they are common doesn’t mean that it is a good idea to use them.  Ideally, we want to use social media engagement to drive traffic to our website.  If we use our website to divert traffic to our social profiles, we’ve got our visitors moving up our funnel, not down it.  Leave the social links for the footer and contact pages of your site to keep traffic moving in the right direction.

Conclusion

In conclusion, effective website navigation is more than a mere functional element of web design; it’s a crucial aspect that significantly influences user experience and website performance. By implementing these seven tips – from simplifying your top-level links to strategically placing your social media links – you can create a navigation system that is not only aesthetically pleasing but also highly functional and user-friendly.