5 things to make your navigation user friendly
Your product and/or website navigation is always going to be one of the hardest working elements. It's the north star for any user. We’ve suggested the following five points which are key to ensuring your navigation assists your users rather than confuses them.
High information scents
When we talk about navigation, we don’t only mean in the traditional sense of a series of links running across the top of your page or a toolbar running along the bottom of your screen. You should consider all forms of navigation including your various calls to action.
One of the main things we can do to create a high information scent is use descriptive labels for link text to indicate what comes post click. You should also consider what else is available, does it have a supporting image? Is there an extra headline or supporting descriptions? Maybe an icon?
Considering the impact of these different items will result in reduced bounce rates and quicker user journeys due to clearly defining what content is where.
Supporting information labels for navigation links
A favourite of ours, we like to see if we can create labels in the primary navigation that, at a scan, can support users' understanding of what is available on the website or what the company can provide. This works well with the classic ‘F’ pattern of reading because your navigation becomes one of the first places, if not THE first place, your user will start reading your content.
Being able to convey quick understanding will help users know they are in the right place and send others on their way.
Consistent primary navigation
We feel, like most practitioners in web and product design, that your navigation should be the most consistent component on your website or product. This is because users will always return to the navigation when looking to trace back their steps or restart on another journey through your website.
At no point should you be replacing your navigation when a user clicks through to a new section or your product or website. By all means add another navigation for that section, but the user should always be able to locate the primary navigation where they left it.
Short and sweet
Cognitive load is a main consideration when designing any aspect of a website or digital product. You want to reduce the amount of clutter and options in a single screen. This will ensure the user isn’t overwhelmed so they can make a quick and informed decision.
Reducing the navigation to a scannable amount of links means that you will make your users comfortable but also reduce the amount of options which directs the customers and encourages action. Ideally this number would be no more than five.
No duplications
If you are having to include a number of links over the recommended amount with larger than ideal labels, you may find yourself struggling for space when using an inline navigation. Even on larger breakpoints on desktop browsers. In this instance you are better off moving all links into a clearly labelled hamburger navigation rather than trying to combine two navigation types (inline and hamburger) to reveal more links.
Another common mistake we see is an inline navigation matched with a hamburger navigation all visible on the same breakpoint with the same links duplicated in both. We are still unsure why this happens or the design decision behind it.
In conclusion
To make sure your navigation is easy to use, you should consider everything from the labels through to structure, position and consistency across your product. Humans are creatures of habit and there is a lot we can learn from products that have come before. We shouldn’t try to reinvent the wheel and ideally lean into what users know how to do, matched with clear and decisive use of language, to get the quickest results.
