Show 'em the way Web navigation tips

Show ’em the way: Web navigation tips

What good is having amazing website content or an epic product line if the people who land on your website have no clear way of finding it?

Having a simple but strategic website navigation and design can help improve the user experience, and steer visitors to the most important pages of your site. It can also ensure your potential customers and clients can always find what they’re looking for by giving them a compass to guide them on their journey.

So before you get frustrated that your readers just aren’t finding out how you put your own spin on an amazing Honey Hoisin Garlic Chicken recipe, or that the world is missing out on your Kleenex-worthy first-person story, read on. We have some advice for must-have nav that will benefit every website — and, most important of all, keep your visitors coming back for more.


Don’t leave them guessing.

Think about the websites you visit, and you’ll probably realize that most use a horizontal navigation across the top. Less commonly, you may see a vertical nav down the left side — that’s also pretty standard.

Your site shouldn’t be too different in this respect, because otherwise, you’ll likely make your visitors feel frustrated. Don’t make them work for it — keep it simple.

If you’re tempted to try something quirky like putting your navigation in the middle of the page, or making the categories only show up when you hover over a purple box anchored on the right side… just don’t. (If you’ve been online for awhile, think of it as blinking-text level annoying.)


Keep it clean.

Giving your visitors too many options can backfire and create click confusion, says Brett Nordin, a web developer at Grateful, which creates optimized websites for top online influencers and content creators. “You want your navigation to be easily identifiable, and not too cluttered.”

When Nordin’s team was tasked with giving the SallysBakingAddiction.com website an overhaul, smarter navigation was a top priority for the baking blog and recipe collection site.

“You will notice we added a quick selection navigation that features the many popular areas of Sally’s blog,” says Nordin. “If you know what the most popular areas are on your blog or website, those should definitely be added into the navigation.”

So for a website, that means highlighting the key areas of the site where you want your visitors to go, such as your services and solutions pages, advises Nordin. For a blog, you might have the navigation tabs point to your biggest blog categories, he says. Rule of thumb: If the navigation labels look like they are too squished together, you probably have too many, or you’re using the wrong font.

And that brings us to another point: make sure the font you use is super easy-to-read, in a legible size, and has enough room (consider letter spacing and line height, as well as spaces between words and different category names.) Get some more typeface tips here.


Choose straightforward descriptions.

Again, your navigation bar is not the place to let your creativity shine (save that for the page content!). “You want labels to be easily identifiable, and not have the visitor guessing as to what they will get if they go into that menu item,” Nordin says.

For example, an online retailer might want to use a more identifiable, generic term like “Clothing” rather than “Cool Threads.” Have a food site? People probably will be looking for the word “Desserts,” and might skip right over “Yumz.”

Also keep in mind that the labels you choose can also help with your search engine optimization, so think about what your users might be typing into search engines to find you — and your competitors. For instance, one of the navigation tabs for SallysBakingAddiction.com, is “baking tips,” a common search phrase among for aspiring bakers. (To compare popular search terms, check out Google’s handy Trends tool.)


Keep mobile in mind.

Since so many users will explore your site via their smart phone or tablet, people have gotten used to the “hamburger”-style navigation menu icon (those three horizontal lines that look like a sandwich, and expand into options when clicked).

“When those first started being used, I think visitors were a little confused as to what exactly was happening and how to navigate,” says Nordin. “Now that the hamburger style is integrated into the majority of mobile websites, as well as all smart phone apps, it’s become second nature for visitors to identify how they work and their ease of use.”


Use categories and tags.

Some websites have a lot of different sections and many years’ worth of content. You still want to make it so your users can quickly and easily access what they want, but it doesn’t have to be front and center.

Categories and tags are your friends, and can help consolidate related information to make it easy to show to your readers.

Categories are the main sections of your site: For a food blog, think Appetizers, Side dishes, Desserts and similar subjects; while for a fitness site, you might have articles in categories like Yoga, Weight training, CrossFit, etc. (Even if a specific category isn’t featured in the first level of the top nav, if you have a lot of content there, it’s still helpful to have as a subcategory.)

Tags, or keywords, are also valuable to help someone find exactly what they’re looking for — like not just any chicken recipe, but some Easy Oven Fried Chicken.


Don’t play footsie.

It may be tempting to add a ton of links to the bottom of every page on your site, but play it smart — nobody wants to read a novel in the footer. Instead, include the top categories, and save space for your copyright and all the usual must-have pages, like your privacy policy, disclaimer, and contact form.


Leave a trail.

It might sound simple, but a click on your main logo should always lead back to the homepage. It’s smart to also have a link in your main navigation to HOME or HOMEPAGE — or, if you actually run a site about homes, consider something like MAIN PAGE.

In addition, users who are clicking around should have an easy way to see where they are, and where they’ve been. You can achieve that by including a “breadcrumb” trail that shows which section of the site and how many levels deep you’re in. You can also make it so the navigation tab you’re currently on is highlighted in some way. These work not just as a “YOU ARE HERE” sign, but also can tempt visitors to click around to other related areas on your site.


Remember there’s beauty in simplicity.

Having a website navigation design that gives visitors very clear directions right from the start is just as important as the photos you choose, the fonts you select, and the stories you decide to tell.

If you want to encourage your visitors to click around and spend more time with you, this is the recipe you need: Craft that cool content like only you can, and then make a sleek, smart nav bar so it’s easy for everyone to find just what they’re looking for.

Sallys Baking Addiction website Mockup