How to Declutter your Website Menu

Contrary to what many designers think, a website menu isn't the place to get creative.
Last updated: June 3, 2022

Contrary to what many designers think, a website menu isn’t the place to get creative. Although it can be tempting to include as many options for your visitors, too many options can result in confusion, followed by disinterest. When users can’t find what they need right away, they go somewhere else.

Your website menu is where your visitors are supposed to easily find their way around your site. Remember: visitors could be potential customers. The way you guide them toward the right places will make the difference in whether a visitor turns into a customer or not.

So, how can you make it effortless for your visitor to find the right information on your site? By simplifying your navigation menu. I’ve created some steps you can take to help your users focus on what matters, and I’ll share them with you below.

Only Include Important Links in Your Primary Navigation

Rule number one for simplifying your menu: cull your options down to essentials. The only links that should appear on your navigation menu are related to your Services/Products, your “About” page, your blogs, and your contact information. Take a look at SixFive’s menu:

We could’ve added a number of other links, but we’ve stripped our menu down to what matters most. Visitors to your website need you to direct their attention. A lot of them have fallen into a strange land where they have no idea what to click or where to go, and it’s up to you to guide them.

Assign Your Secondary Links

Okay, so what about those additional links you just can’t ignore? If you offer more than one service or need to flesh out your contact sources, you’ll need to assign your secondary links. Ideally, they should be inside a drop-down menu and/or in the footer of your website. Preferably both, as some visitors may not scroll all the way down and could miss all of the opportunities you have to offer.

Here’s how secondary links look in SixFive’s dropdown menu:

And here’s how they look in the footer, fully fleshed out:

(Source: SixFive)

Avoid Mega Menus

Mega menus, as you may have already seen, are large menus that feature several categories and options stacked on top of one another.

While the intention of mega menus might be good – as in showing the array of options a visitor has – people decide better by narrowing down their options. They need to make sense of the “bulk” of your site before they can start considering additional details, and mega menus make that task nearly impossible. So try to avoid them at all costs.

Fonts Matter

As I’ve mentioned in the beginning of this article, you shouldn’t try to get creative with website menus. And yes, that means you should avoid any “fancy” fonts, even if they fit your branding.

They may look pretty awesome, but depending on the font you choose, unique-looking typefaces can be difficult to read. And what’s the point of adding a menu if your visitors can barely read it, in the first place?

Simple and easy to read is what you should always aim for.

Remember Every Screen

Another issue with fancy-looking menus: they may look weird on mobile and other devices, such as tablets. The thing is, even simple menus can look bad on smaller or bigger screens if your website isn’t optimised for mobile.

If your current template isn’t responsive (meaning it doesn’t automatically adjust to the screen of every device), a good idea would be to include a hamburger menu to your website’s mobile version. Interestingly, it’s called a hamburger menu because the symbol consists of three parallel horizontal lines.

Here’s what the hamburger menu looks like at SixFive’s mobile site. The first image is what the menu looks like before a visitor clicks, and the second one is after the click:

 

With a hamburger menu, the menu won’t take over any important sections on the website, and will be tucked in a corner until a user decides to interact with it.

By the way: you’ll always want to access your site from multiple devices, just to make sure users will have a great browsing experience and nothing looks off. 

When You Think “Menu” You Think “Simple”

Your menu is like a map: users need to get to their destination fast –  and if you can’t help them right away, they can always ask someone else for directions. That’s why the least distractions and doodles there are in your navigation, the better.

Here are the key takeaways I want you to leave this article with:

  • Strip your menu down to the essentials: Home, About, Services/Products, Blog, Contact.
  • Flesh the remaining links out in a drop-down menu and in the footer of your website.
  • Don’t ever use mega menus, no matter how nice they look.
  • Don’t try to get fancy with fonts.
  • Optimise your website, and test it on multiple devices to see if everything looks good and works properly.

Once you’ve checked all of these boxes, your visitors will know exactly where to go.

Duncan Isaksen-Loxton

Educated as a web developer, with over 20 years of internet based work and experience, Duncan is a Google Workspace Certified Collaboration Engineer and a WordPress expert.
Login
Log in below to access your courses.
Log In With Google
Forgot Password
Enter your email address or username and we’ll send you instructions to reset your password.