Are Your Web Menus Meeting These 4 Standards?

This is a sibling to my previous article about website menu design. 

The items in your website’s navigation and menus should work together. Each item has its own purpose but is also part of the larger “engine” that helps users understand your site when they arrive. There are four key considerations when deciding how to organize/design your menus…

1. Branding

Your main navigation bar is the first things users will see. Do the menu options reinforce how you want your organization to be perceived? Does the navigation bar make it indisputably clear what you want your organization to be known for?

For example, on the Chipotle website, you can tell right away that they stand for “Food With Integrity”:  

Being associated with integrity is part of Chipotle’s strategy for differentiating themselves from their competitors.

McDonald’s is also moving into this space by adding “About our Food” to its menu—an option you wouldn’t initially associate with the fast food giant:

Similarly, TOMS includes “How We Give” in its main navigation—clearly communicating that this shoe company has a significant charitable streak (a key differentiator): 

Arena Simulation Software includes “What is Simulation?” as an option, which tells the user that Arena isn’t just for experts and engineers. (This sort of “plain language” approach to menu nomenclature is useful for nearly every organization, regardless of how sophisticated its products or services may be.)

2. Descriptive

You want to use words that your users recognize. Unfamiliar words are usually ignored.

On the Home Depot site, for example, it’s difficult to know what “Pro Xtra” means. This doesn’t describe something that I understand or find valuable. Am I going to click it to find out what it is? Not likely. The navigation menu is not the place to introduce new or foreign concepts.

3. Mutually Exclusive

You want users to be able to tell the difference between menu labels. There should be little or no overflow of meaning between options.

The Symantec website illustrates this UX problem: Users can choose from “Products,” “Services,” and “Solutions.” Which one do I want? What’s the difference between them, really? 

If you aren’t sure if your menu items are mutually exclusive, ask unaffiliated people to explain the difference between each item—e.g., “What would you expect to see if you clicked on this menu item?” If you get very different answers, something’s amiss. 

For Kroger, what is covered in “Departments” or “Order Online” that isn’t in “Explore”? “Explore” seems like something that is covered by the other topic headings. Is it a synonym for “Shop?” Not sure.