Your site navigation is important to conversion and retention on your website. Too many options and visitors leave confused. Too few options and they can’t find what they want. The trick is in ensuring that you not only provide what the visitor needs but, that you drive forward towards success. In this episode, I cover the ins-and-outs of great site navigation and how you can find more success in keeping it clean and clear.
Why Does It Matter?
You might wonder why Wapiti has a podcast episode and article specifically dedicated to your site navigation. The truth is, many companies don't pay enough attention their site navigation and lose out on potential sales because of it.
Your navigation should be one of the main funnels for conversion on your website. If it isn't set up properly, you're losing conversions - I promise.
What options should be in your navigation?
The options in your menu bar are entirely dependent on the product or service you offer. Your overall page navigation should work together with your menubar to offer visitors answers to their questions and, ultimately, convert them to a client.
Wapiti as an example
As of this writing, brandshouter.com has 5 total menu bar options and one overall navigation element. Our menu currently consists of a logo linked to our home page, a link to our portfolio page, a link to learn more about our services, a link to learn more about our company, and a link to read our articles & listen to our podcasts. The front page of our websites says We Make Websites in large letters. We also have a floating contact link at the bottom of each page.
These elements work together to help a visitor understand what we want them to do. First, We Make Websites is clear and concise in telling the visitor what it is we do. Secondly, each link in our navigation explains why that should matter to them. We answer the questions, who, what, when, and where immediately. Finally, our call to action is large, red, and always visible as each page of our site asks the visitor to contact us.
Great Menu Navigation
When creating your primary menu item, it's important to understand both the customer and the way they will be navigating your site. Most sites are seeing over 50% of their traffic from mobile devices. That means it is important that your navigation cater to mobile device traffic first. Of course this doesn't mean that you should ignore the desktop/laptop/table visitors either.
Sticky vs. Static Headers
Wapiti uses a sticky header on our website. When you scroll down any page, the header follows you down the page by attaching itself to the top of the screen and staying there. A static header is simply a header that disappears on scroll. There are pros and cons for each of these.
Sticky Header Pro/Static Header Con - Sticky headers remain always visible. This leaves your navigation available for visitors at all times.
Sticky Header Con/Static Header Pro - Sticky headers (by default) show on mobile devices and take up that precious screen real-estate. Static headers disappear when you scroll.
Now with both of those, your situation may turn a con into a pro. Also, there are ways to combat the cons from both options. For example, many sites have sticky headers on tablet and larger sized screen but convert the sticky to a static header for mobile devices.
Mobile Menu (Hamburger Icons) and when to use them
This is an interesting subject. It used to be that mobile menus were just used on mobile devices. It was pretty cut-and-dry. Now, you'll find many sites with a mobile-style menu on their desktop website. This can be a good or a bad thing.
Mobile menus should almost always be used on mobile devices. This keeps your header from crowding your precious screen real-estate on this smaller devices. Most web visitors are very familiar with the mobile menu and it causes no confusion.
For larger versions of your site (tablet, laptop, desktop, TV, etc.) mobile style menus should be uses sparingly. If you have a ton of menu items and are unwilling to simplify down to just a few, you can put a lot of those in a separate mobile menu item.
Some sites use the mobile menu as a way of eliminating clutter for stylistic purposes too. While I understand that purpose, I still recommend against hiding your main conversion pieces purely for aesthetics.
Conclusion
Your site navigation should highlight your call to action immediately and every other piece should support it. Obviously don't ignore items that existing clients will need but your site design should be fully set up for conversion and your navigation is a key element in conversion.
