How to simplify website navigation

Charity websites provide an amazing service, but with multiple target audiences and internal stakeholders, they can easily become messy and complex. 

Ideally, you want someone to land on your website’s homepage and get to the information they need or the action they want to take in a very small number of clicks.

With so many different demands at play, how can charities simplify their website navigation without spending a fortune?

Don’t make the homepage a battleground

Too often decisions about homepages are made on a who-shouts-loudest basis. Making sound decisions about priorities for the main menu involves taking a step back and:

• Speaking to people who represent your key target audiences to find out what they use your website for
• Looking closely at what your website’s analytics are telling you about the most popular destinations and actions
• Reaffirming the charity’s strategic priorities and analysing how they are reflected in the website navigation

If you put your findings from those three steps in a Venn diagram, the areas that overlap should give you a starting point for simplified website navigation.

Here are a few tips on how to implement your updated website navigation priorities.

Organise your top menu in priority order

According to the primacy and recency principle, the items on the far left and far right hand side should be your top priorities. The items audiences see first and last are the ones they are most likely to pay attention to.

Limit the number of items in your top menu

Orbit media argues that there should be no more than seven items in the top menu (and ideally less). If you have more than this, there are some other options that you can consider:

• Including a hamburger menu with a dropdown side bar to include more menu items
• Using a mega menu from each drop down that includes columns of options, sometimes with an image at the top of each column – ActionAid uses mega menus on the homepage 
• A biscuit crumb effect where quick links are included in graphic form, perhaps with a short description e.g. a vertical line of circular images. This technique is used quite a lot in e-commerce to provide short links to best-sellers

Include one ‘call to action’

Many websites include a button in the top right-hand corner. After clicking this call to action button the audience should hit a landing page where they can take an action right away.

This could be a ‘get in touch’ contact form, but if you’re a charity that fundraises from the public, your call to action should be ‘donate’. It’s a simple action that can be taken straight away and the button makes it clear that you are a fundraising organisation, leaving the rest of the homepage for support and impact.

Use a button in a contrasting colour to attract attention – the GOSH site has a yellow/green which really pops against the blue of their homepage.

Give your navigation some space

To give your new, simplified website navigation the best chance of success, give it space. Use whitespace between the menu items and between the menu and the first bit of content on the page.

You can also pop your menu in a coloured bar to make it pop. SARSAS uses a white bar with dark coloured text to do this on their site.

Useful and unique descriptions

You can help search engines to navigate your website by using unique and useful descriptions. For example, instead of ‘research’ add a word that indicates the focus of research like ‘cancer research’. Pay attention to generic descriptions of formats such as articles or blog or news.

Consider mobile for better website navigation

In the UK, the spit between desktop/laptop and mobile is around 50/50. Check the analytics for your site to find out the split for your site.

When it comes to optimising your mobile site menu, stick with the hamburger icon – it’s universal. Anything that causes your audience to pause and think more consciously about their journey isn’t a good thing.

Make sure you’ve also given some thought to spacing – it’s your audience’s thumbs that are doing the scrolling and clicking on mobile.

Test your new website

Launching a new site navigation isn’t the end of the project. Determine what your KPIs for project success are and monitor them to see if there are improvements to be made.

You might want to look at:

• The bounce rate for the home page
• Traffic to your priority site areas
• The number of actions on your call to action button

You can also use the first few weeks after launch to do some A/B testing. This is a great option for anything that you just couldn’t agree on before launch – let your audience decide.