Today we will talk about websites navigation and its evolution over the past years. We are sure that there is no need to elaborate why website navigation has a crucial significance for your site conversion.
It’s obvious. If your navigation is poor, site visitors will never find your content no matter how awesome it is.
Site navigation is one of those little things that make a big difference. And you will find the answers what should a user-friendly navigation look like today.
Nobody will argue that the development of technology dictates its own rules and standards, following which you can squeeze the most out of your web page.
Nowadays everything spins around the best possible user experience no matter what gadget they are using to surf the Internet.
With super-fast current lifestyle, a lot of users prefer browsing their favorite websites on the go, so their navigation should be thought out to minor details and ready to face this challenge. Otherwise, it will cause site abandonment, that’s all.
Here we can make some in-between conclusions:
- The structure and labels of your navigation are important!
- Navigation affects your traffic. The higher your rank is, the more traffic you get from search.
- Navigation affects your conversions. The easier it is to use your site, the higher percentage of visitors convert into leads and customers.
But let’s finally start tracking the evolution of websites navigation.
1. Firstly, let’s compare the navigation from the past and the navigation that replaces it today.
What standard labels come to your mind when you think about main navigation menu bar?
“What we do”, “Products”, “Services”, “Solutions”, etc. Can you say that these words and phrases really tell what you do, about your products, services, and solutions? Of course not. The labels are not descriptive, read: useless for SEO.
Today smart online entrepreneurs strive to use descriptive navigation. Such kind of navigation utilizes key phrases in order to boost SEO and conversions.
Think about that. Your navigation bar is a key place, indicating relevance to search engines. Your navigation bar appears on every page and its descriptive labels make Google understand that your website is about the topic.
Besides, descriptive labels are loved not only by Google but also by your visitors. When your descriptive navigation lists your main products or services, the user understands almost immediately that he/she is in the right place.
Start telling people and search engines about what you actually do right from the main navigation bar. Here is an example illustrated by one of TemplateMonster’s PrestaShop themes:
You may use Google Keyword Tool to find top-of-mind phrases for visitors and popular key phrases for your labels.
Labels like “products” or “services” don’t help your rankings because nobody is searching for them. You see, everything is simple. The above navigation labels are outdated. So, you’d better forget about them.
2. Format-based navigation can’t be called descriptive either.
Do you include the words “videos”, “photos”, and so on? The problem is that they tell the visitors the format of your content, but not the topic of it.
People don’t browse websites for videos or photos. They are searching for answers and information. Here is a helpful link on how to avoid the format-based navigation.
3. Modern MegaMenu instead of the outdated drop down menu. We know that drop down menus are still popular, however, it’s not a brilliant idea to use it on your website.
Drop down menus can be difficult for search engines to crawl. Everything depends on the code behind it. Sometimes, a drop down menu can lead to the unexpected problems.
Drop down menus can be annoying for the visitors. Supposing you have already scanned the web page and decided to click the menu label, but, all of a sudden, the menu item gives you more options on mouse over. Omg…
What’s even worse, drop downs encourage visitors to skip the important pages. Are you still using dropdown menu? Just have a look at your analytics account and you’ll see the problem.
As to the mega drop down, it performs quite well. MegaMenu offers a lot of options, making the game worth the candles.
MegaMenu is a great option for big sites with lots of pages and a diverse set of products or services. What’s more, MegaMenu dramatically increases the number of links from your home page.
4. Reduced numbers of menu items.
The outdated websites had/have hundreds of links on the home page. Limiting their number is good for the same reasons as the descriptive links.
You home page gets “credibility” with search engines because more sites link to your home page than to your interior pages.
If your homepage has tons of links, this dilutes the authority passed from it down to your interior pages accordingly. This considerably reduces the probability that your interior pages will rank.
In a word, the more concise your navigation is, the more authority will flow to each interior page, making it more likely to rank.
Here is a great tool that counts the number of links on any page and estimates the increase in authority that would be passed if you reduce the number of links.
But what number of items in your navigation is optimal for your visitors?
Our short-term memory is able to hold only seven items (+/- 2). That is, the more items there are in your navigation, the more difficult the information is to remember and process for the users. If you have too many items visitor’s eyes may just scan past the important ones.
Unfortunately, sometimes it’s impossible to use not more than 7 items. In such cases, it is recommended to break them into groups (categories).
Avoid long lists. Break out your navigation into groups of five to seven items. Remember, each time you remove a menu item, as well as any other element, from a page, everything left becomes more visually prominent and is more likely to be noticed and considered.
5. Attention to the menu items order.
Did you pay attention to this before? Now it’s the right time to make necessary updates.
Keep in mind that the items at the beginning and at the end are the most effective. Here the attention and retention are the highest. The phenomenon has the name: the serial position effect.
Items at the beginning and at the end of a list are more easily remembered.
Put the most popular, important items at the beginning of the navigation. If you are not sure what should come first, peep into your analytics.
6. Using technology to improve your navigation.
Currently, the navigation design is just the beginning. Wait a few weeks and evaluate your navigation with the help of analytical tools.
“Navigation summary” or “In-page” view in the behavior report will show you which navigation items are most used by your visitors. The others are the Behavior Flow / User Flow reports.
Based on analytical data you might make some decisions like these:
- Remove items that rarely get clicked if they aren’t critical.
- Rename or relabel items that rarely get clicked if they are important.
- Move items that often get clicked to the beginning.
7. Navigation optimized for mobile browsing.
Navigation optimized for handheld devices can be summed up in two words: “hamburger icon”.
The advance of responsive design has brought this icon made up of three short horizontal lines, looking a bit similar to a sandwich, into general use.
Although it’s a standard icon, adding the word “menu” may help visitors find this type of “hidden” navigation.
We have just reviewed the evolution of website menu with tips, best practices, and examples. It can hardly be called a guide as every rule has exceptions. In any case, the aim of the article is to make you cast a fresh glance on your website navigation menu. Maybe it needs some tweaks that will increase your traffic and improve your conversion.
The main idea of the blog post is that your up-to-date navigation menu should work well both for human and search engines.
And don’t forget about the portable gadget users! Your bank account will thank you for that.
Have any questions, additions, suggestions? They are welcome at the comment section.
Helga Moreno is the author of this article and many other blog posts on MonsterPost blog.
Resolve issues faster with visual bug reporting.
Simplify and reduce issue & bug reporting efforts with screen recordings, screenshots, and annotations.
And if you’re ready to try out a visual bug tracking and feedback solution, Usersnap offers a free trial. Sign up today or book a demo with our feedback specialists.