Avoid these web navigation mistakes

Be clear in your website navigation. It’s important for user satisfaction, experience and SEO. Here are the dos, and the six big don’ts of web navigation.

Tempted to make your website stand out?

In an effort to make a website stand out and seem ‘innovative’ and different, it can be tempting to employ outlandish, new, or strange navigation methods. But these can be hard for browsers to get to grips with, make navigation more difficult for them.

What is a website if it isn’t just a source of information to navigate? Just like a book needs clear signposting such as chapters, headings and page references to direct readers, a website needs clear signposting and direction so browsers can get to what they’re searching for.

In the last 20 years we’ve learnt a lot about web design, so don’t be tempted to stray from best practice in web navigation that is tested and proven to help browsers get the information they need easily, quickly and in the most pleasant, enjoyable way. Use that learning to your advantage and save your uniqueness for some other aspect of your website.

Web navigation needs to be just that – navigation

There’s plenty of scope for creating a unique website: the page layouts and design, colour palettes, functionality, content and messaging. The possibilities are endless. But we recommend leaving the navigation best practice touchstones well alone. These are the basics of website navigation and give your browser comfort, reassurance and ease of navigation around your website.

Remember, browsers are used to convention and need to recognise your navigation method in seconds as they scan for visual clues, or they will bounce.

Use these navigation conventions

• Easily visible and clear main navigation menu – whether across the top horizontally or elsewhere, the menu should be picked up immediately by the browser’s eye 
• Ensure placement of your brand logo is top left corner of the page
• Use clear hierarchy so users know which page they’re on, how to read it, and how to click back to home
• Ensure any icons used are intuitive, with no room for other interpretations, i.e., house for homepage, bag or basket for their online cart

The web navigation mistakes to avoid:

Using too many menu headings

Rule of thumb is – don’t use more than seven main items in your main menu. The experts have helpfully researched how human beings lump information together in their short-term memory, and seven lumps is about out limit.

Don’t overwhelm users with more than they can handle. If you feel you have more than seven main items, you will need to group them so they can be absorbed within other items.

Misuse of dropdown menus

Be aware that when a user navigates to a heading in the main menu and a dropdown suddenly appears, it can cause a moment of mental friction – having decided where to go, they now have another decision to make. Be very clear with your dropdowns.

Depending on your information, it may be better to have the information on your dropdown pages all succinct on a multi-level single page.

And consider, will users miss the main page if you’re directing them to numerous sub-headed pages?

And, if your information is vast, particularly in the case of a large e-commerce store, a ‘mega dropdown menu’ maybe better, where the different sections of the store / information are all set out in one huge dropdown, one-glance menu.

Menus that are too deep

Deep menus are menus that have many levels. There may be a huge amount of information in between the top navigation heading and levels of pages several layers down. But imagine if the user wants the information right at the bottom of that menu and all the navigating they have to do to get there… not good.

Flat menus are the opposite of deep and much preferred by browsers. Try, if at all possible, to make your menu flatter rather than deeper.

Hiding navigation

In short – don’t do it. Do not hide navigation. If the user cannot, at any time, see where they are in the site by glancing at the navigation menu, their ease of usability and navigation plummets. It’s ok to put the navigation in a ‘hamburger menu’, which is the three-horizontal-bat menu in the top-left of a website, but don’t under any circumstances hide it altogether.

Vague navigation labels

We recognise, as browsers, navigation labels such as About, Services and Contact. But what it there was a less-vague, more on-brand alternative. It will depend on your business but try to imagine what your browser knows about you. If you’re a repair shop, do you need to say Services? What about, We repair, instead? It’s less vague and is more specific about what you do.

If you’re a hotel or beautician, does Services make sense, or should it be Rooms, or Dining, or Treatments.

Only use the well-known conventions if they suit your business and are clear for your users.

Not indicating continuation of a webpage

Have you ever bounced off a webpage only to find, when you return that it’s longer than you first thought and the information you want is at the bottom? It’s common and means the webpage has a ‘false bottom’.

If your users need to scroll down further, make it very clear in the navigation with visual clues and direction.

And on that ‘false  bottom’ note… this is the real bottom of this blog…

Do you want to know more about improving your website’s navigation? Do you survey your users to assess usability? We can help you improve your navigation and SEO. Just get in touch with our web team today.

< Read more articles on our Web Academy