6 website navigation best practice do's & don'ts
Ensuring your website is easy to navigate is well ... critical. Confusing our visitors is the last thing we want to do! There is a lot of incorrect ideas out there on the best way to go about setting up your website navigation. With almost every website design client I have, this is generally an area I need to do some educating on. What seems to be common sense, doesn't always tend to be correct.
So below I have 6 best practices tips you should follow when setting up your site navigation.
1. Do go the 'Less is more' route
"But don't I want my visitor to be able to see all their options, and then choose exactly what they're looking for?"
There is a growing movement towards minimizing your navigation options, and this is a GOOD thing. (You should absolutely do this too).
The more options you give, the less your visitor is likely to do what you want them to.
Not to mention, the more options, the more decisions that need to be made. Too many decisions leads to overwhelm, and your visitor hitting the back or exit buttons instead.
You'll want at maximum, 6 options in your navigation. (The less, the better).
So, how do you decide where you want your visitors to go, and therefore what should be in your navigation? It depends on your website goals.
Example, my website (currently) has 3 options. ‘Free Gems’ ‘Web Design’ and ‘Blog’.
My main website goals are as follows:
I either want people to download my free opt-in gifts (and get added to my email list)
Hire me for a website design project
Read my blog so they learn what an expert I am, love me dearly, and then opt-in to my email list or hire me for a web design project
My about page, contact page, FAQ, etc., are of course important pages to have available on my website, but these aren’t about to grow my business anytime soon in the ways the others would, so they’re linked down in the footer, and from links within the page content on my site.
Tip: Also note, you can take your ‘home’ page out of your navigation. Everyone these days knows to click on your logo to get back to the home page, so it’s just wasted space and clutter really.
With your car and your website, cleaner is better! (Personal clean car enthusiast right here.)
So, decide what your website goals are, and then determine your navigation items accordingly.
While I know this can be a painful experience of umming & ahhing over 'but I can't take out my contact page,' remember; the more options you give, the less likely your visitor will go where you want them to.
2. don't use dropdowns
This is for the same reason as number 1.
When someone hovers/clicks on your navigation item, they've made a decision, wahoo! ... and then you just gave them another decision to make.
Dropdown menus are becoming a thing of the past as they've been found to annoy users.
Instead of doing a dropdown menu, link to the broader category, and then within the page content, link out to the different options.
Megan Minns does this extremely well with her products page.
She doesn't have each of her 4 products as dropdowns under her 'products' navigation item.
Instead, all 4 products are on one page, separated by slightly different colored background sections, which makes each one clearly distinct and contained.
She then links out to each product with large & bright Call To Action (CTA) buttons.
3. Don't get fancy in your navigation
If you want to make your website stand out with it's unique & modern design, hell yeah, I'm all for that!
However, getting unique in your website navigation is not the way to go.
If people can't figure out how to get to the next page, I promise you they're not sticking around.
Feel free to get unique and differentiate your website on the content of your page, but keep your navigation normal & expected.
People are used to the navigation being at the top of the page horizontally or down the left hand side, vertically.
Pick one of these two options.
4. do quiet the noise for best results
Every web page (should) have a purpose, and an action you want a visitor to take on it. When you'd like to make that something stand out, do so by 'quieting' everything around it.
A tell-tale sign of a DIY website is making everything on the page cluttered & loud! Instead of making page content bigger & flashier, make everything else on the page cleaner & quieter.
Notice the difference in these two search engines? The whole purpose of Google & Yahoo is to search. Which one are you more likely to complete your search on (and not get distracted)?
In order to get visitors to take the action you want, clear out the non-essentials.
5. Do Use contrasting colors for text links
Ensure the colors of your CTA's & links are clear and distinct by making them a (clearly) different color.
In a large paragraph of all black text, it can be hard to notice a gray link.
Instead, make your links stand out, with a complete other color, not just a different shade.
6. Do make sure your search bar is easy to find
Search bars are one of the easiest ways for visitors to find what they want, fast. However, on many websites they're near impossible to find, or non-existent.
Consider a search bar a mandatory piece of your website, and be sure to put it in a place visitors expect to find it.
That would be in your navigation, your footer, or the top of your sidebar.
(And don't be afraid to put a search bar in multiple areas of your website!)