6 Beginner Tips for Website Navigation (With Examples!)
Laying out a great website navigation menu is the treasure map, and the treasure is your products. If a website is a car, the navigation is the steering wheel that your visitors will use to drive your site.
The problem is that a lot of websites paralyze their audience with too many choices, hide important pages from the navigation, or simply don’t have an effective enough header navigation to allow visitors to successfully navigate your website. Customization is key!
Here are five key tips for a stellar website navigation:
1. Keep header navigation under six options
Your navigation is a place where people can quickly get to the most important pages on your site. Ideally, you will only have between four and six main pages, then supplementary sub-pages. This means you’ll have between four and six main options in your navigation and up to six options in each drop-down option in the menu.
Make sure your navigation only takes up one line and nothing stacks improperly.
Music Missions does a great job of keeping their header navigation concise, but still functional.
2. Keep dropdown menus to a minimum
If you have a navigation menu that drops down with more options beneath each of the your main navigation options, you can take a hint from tip #1 and keep them at a minimum. Try to keep these under six as well. As always, there are exceptions, but in a world of websites full of clutter, you can stand out by simplifying and airing on the side of minimalism.
Elations Entertainment has one menu option with a drop-down and it only has three items.
3. Two clicks to anywhere in your website navigation
Don’t make your visitors give up their first-born to find the page they’re looking for, or worse, the page that will turn into a conversion for you. Do a self-audit of your website and see how many clicks it takes to get to any given page. If it’s more than two, the page is almost guaranteed to get buried.
4. Stand out
When you’re naming the pages to your website and creating names for links in your navigation, try to think outside the box. Everyone is used to seeing “home,” “products,” “about us” and “contact us.” It’s important to avoid any confusing language, but get creative with your titles to draw more interest in each page and convey the voice of your company.
5. Your header nav doesn’t have to match your footer nav
A lot of people think that their navigation has to look the same in every location, but it’s not true. The header navigation is the most important, so keep it simple, but the footer navigation has a lot more freedom. You can add more links into your footer nav because footer navigations, to a certain extent, act as a sitemap.
Happy Lawns has a centered, consise header nav and a more in-depth footer navigation.
BONUS TIP: Single-page scrolling navigation:
You may have the single-page scrolling navigation. In this case, you’ve appointed each content section with a different link target, which visitors can get to by clicking the navigation. This means instead of opening a new page, they automatically jump down to the content section. In other words, the entire website is one page, broken up into four to six sections instead of four to six separate pages.
Check out Ericson Homes’ single page navigation styling!
To keep your single-page navigation super user-friendly, be sure each content section is clearly broken up and clear where one stops and the next starts. You can do this with various parallax effects, changes of color, and bold headers showing exactly what people are getting into. To reduce clutter, keep your website to less than six different sections, and restrict each section to no more than one call to action.
Your website navigation is a key component to making sure your website is super user-friendly, but it’s often overlooked. By keeping your navigation bold, simple and effective, you’ll keep people on your site longer, looking at more pages which will get you that much closer to conversions.