What’s the first thing you do when you land on any website homepage? Do you immediately enter in the URL of the page you’re looking for? Or do you use the site’s Navigation tools to find what you need?

You probably use the navigational tools available on the site to find your way around. The users who go to your site are definitely doing the same thing there. So if your users are important to you, it’s pretty vital that your site follows the best practices possible. Here are some top navigation tips you should know and follow!

Best Navigation Practices

Rule number one is to remind users where they are within your overall website. There are a couple of ways to accomplish this, which we’ll get to later. But it’s important to first consider why clear navigation is so important. Think of each page on your site as a different physical address that your users are trying to drive to. Your navigation practices need to be like the best GPS on the market.

Here are some ways you can remind users where they are on your site:

• URL
• Headings
• Breadcrumbs
• Window tab title
• Contextual cues
• Logo and branding
• Navigation change
  • i.e. A link or graphic element related to navigation becomes more visually prominent when the user hovers or clicks on it
    

Breadcrumbs

Breadcrumbs are one of the most common ways to show users where they are in a website. When someone arrives at your site, they likely came from an outside source, be that social media, search engines, or another source. They’re often not starting out right on the homepage but somewhere deeper in the overall site. In order to keep them from feeling as though they’ve landed in a maze, users need some indication of where on your site they are, and where they can go next to quickly find what they need. One way to do that is through breadcrumbs.

Just like Hansel and Gretel dropped crumbs behind them so they could find their way back home, your website should be able to easily lead users back to the homepage.

Website breadcrumbs should very obviously present the hierarchy of your site. Most sites utilize this navigation practice by listing the hierarchy along the top of the page with greater than (>) symbols indicating the progression.

Here’s a visual example of breadcrumbs:

As you can see from these navigational breadcrumbs, I am currently on the page titled “How to Install Email on My Mobile Device”. But, you can also tell that this page is just below “Common Resources” in the site hierarchy. And, that Common Resources sits just below the IS homepage.

So if I wanted to find more how-to guides, I would probably click “Common Resources” as the how-to page I’m currently on, came from that source. Breadcrumbs ensure that your users don’t get lost on your site. Just note that this technique should only be used on websites that have multiple pages. Sites with one page level do not need breadcrumbs.

Appropriate Link Arrangement

If you have a list with ten links, you can usually bet that the first and the last will be the most remembered of all the items on the list with everything else falling behind. So, putting the item that’s most important to your users in the lead can make a huge difference for your page’s success and your customers user experience (UX). If you’re not sure what the most popular items in your list are, just take a dive into your analytics and see what links are “most popular” based on clicks, behavior flow, etc. You may even find that some items have interaction low enough to justify removing them from your page.

For example, on the “Common Resources” page we were playing around with before, you can see that in the “How-To Guides” section the two most common questions are in the first and last spots.

Importance is not the only factor you can take into account when arranging your links, though. Sometimes things like alphabetization may help with user navigation through lists. Kathryn Whitenton for the Nielson Norman Group wrote the following on alphabetization:

“There are a few cases where alphabetical ordering makes sense. The first is when your categories have only one possible label — for example, product names or brand names. In this type of situation, users are likely to be scanning for that particular word, and alphabetical organization is helpful, even if the list only has a few items. Alphabetization is also worth considering if you need to present a long list of categories, and all the categories are equally important.”

So for example, when you are browsing through the categories on Amazon, you’re may want those to be alphabetized so that you can find what you need quickly and easily.

Tags

When it comes to articles or blog posts on your web pages, tags are imperative for giving context to your content. When users understand this context they are more likely to explore your site further. For example, at the bottom of every post on this blog you can find tags and categories that have been added for your convenience. Here are the categories and tags for our article “The Power of Social Listening”.

Notice that the post is not just limited to one category or one tag. Because we discuss a multitude of things within the article, its labels reflect that. So if a reader is interested in social listening but hasn’t actually created a social media presence yet, they can click on the “social media” category to learn more. If they want to learn more about Facebook or Twitter, all they have to do is click on the respective tags to find more posts that include that information. This makes navigation much easier and more accessible for the user. When navigation is easy for users, they will react positively, and your website’s data will show it.

Consider Dropdowns Cautiously

Dropdowns are sometimes useful but they’re not an apply anywhere solution for most webpages. For one, having dropdown menus could be problematic for SEO purposes. They may not be the easiest for search engine algorithms to pick up, and therefore could hurt your chances of ranking higher on search engine results pages. More importantly though, if you have too many dropdown options, your visitors might skip over key pages that are included within them.

Still, when dropdowns are used properly, they can be very useful in helping with navigation while organizing your pages. Take a look at the USF homepage dropdown:

As you can see, There are multiple dropdown options along the top of the homepage. However, because they are all consolidated in their own categories, there is no confusion.

Make sure you’re always using hover effects for your dropdown menus. That means, the link text needs to change in some noticeable way when a mouse cursor hovers over it. This is incredibly important for user experience, as it makes things much clearer. Here, “Apply” is a different color from the other links because the mouse is hovering on it.

Familiar Navigation Procedures

Think back to the analogy we discussed about your webpages being like physical addresses, and your navigation being like a high quality GPS. Now, what would happen if all of a sudden your GPS started speaking a different language? It’s unlikely you’d be able to quickly and efficiently get to your destination. You might even switch to a better tool or website, altogether. The points here si that website navigation requires continuity.

Take for example, menus. Because our eyes are trained to read things left to right, menus are almost always left-oriented. If all of a sudden, you started putting your menu lists on the right side of the page, users would likely feel confused and not so willing to stay on your page.

This is just an example, but the sentiment stands. Humans are creatures of habit, and because of this it’s best to try and align your navigation procedures with the common standards and best practices that are used online.

Here’s an example of an unexpected, and thus disconcerting navigation practice (courtesy of Kissmetrics):

Because we are so used to menus being along the side or top of a page, it would likely take us a long time to try and find this menu. Many users would simply seek an alternative site.

Visible Navigation

The surprisingly,unusual placement of the menu above also drives home another point about navigation best practices. That is, navigation menus should always be clear and visible to users. When your customers can’t easily find what they’re looking for, everyone loses. Users don’t get what they came to your site for, and you don’t get the conversions (e.g. sales, contacts, etc.) you’re hoping for. So when designing your navigation, remember that the goal is to make your directions immediately visible, understandable, and easy to use.

You also need to be sure that you’re optimizing your entire site for mobile viewing. Here are a few tips for mobile navigation optimization:

• Make the menu visually salient by ensuring that it stands out on the page.
• Make sure that the menu is visually distinct from the logo (either placed farther away or in a different color scheme).
• Add a menu label to be sure users are not lost, especially for those who many not be familiar with newer icons such as, the “hamburger” (see photo)

Rely on Data, Not Desire

This is the most important thing you should be doing when it comes to anything on your website, really. Data empowers us to not only make better decisions for our customers but for all of the end-users who are looking to us for reliable information and action steps. That’s where UX and SEO Research comes in for modern web teams. That doesn’t mean you should never deviate from the norms but it’s important to keep working with the data to ensure that your goals are attainable and your users are well served.

This is a truly unique time in which the Internet is both well established and rapidly evolving. Because of this, it’s very enticing to add all of the features you can get your hands on. But the truth is, users often don’t want to see all those super fancy add-ons. They just want the information that they need to be presented as quickly as possible. Take a look at The World’s Worst Website Ever (no, really that’s what it’s called):

The World’s Worst Website Ever features moving images and music, please be aware when clicking the link provided.

As extreme as this example may be, it’s still important to remember that research and analytical data should be your primary source for design choices. It would be fun to go completely against conventional navigation techniques, but it won’t be as fun when you start losing traffic and conversions.

Conclusion

So, keep these eight navigation best practices in mind when reviewing your own websites. Remember that there is never a shortage of resources you can look to when thinking about the best ways to design or edit your digital presence.

If you have any questions about navigation practices, user experience, or SEO, you can always contact us on our Facebook page. And don’t forget to check out all of our other articles!

Happy Computing!

The post Tips and Tricks for Navigation Best Practices appeared first on Health IS Technology Blog.