About Us

Usability of Drop-down Menus

The problem with drop-down menus

Usability research published by User Interface Engineering reveals how we navigate the web and shows why drop-down menus can cause usability issues:

  1. The Right Trigger Words
  2. Users Decide First; Move Second

The Right Trigger Words

Mostly we use the internet to find some information about something; we have a goal. Navigation helps us move forward to that goal, following links to that content. While navigating, we are looking for and following our trigger words – words and phrases that trigger us into clicking.

Start quote

What happens is the user scans the page for the trigger words, studying every possible place the trigger words could be. If they find the trigger word, they click on it.
Jared Spool, The Secret Lives of Links, UIE

End quote

Users Decide First; Move Second

After observing users during usability testing, UIE noticed how users behave when navigating websites:

Start quote

We found users follow a pattern: they decide what they are going to click on before they move the mouse.
Erik Ojakaar, Users Decide First; Move Second, UIE

End quote

Now apply these findings to a typical drop-down menu

Drop-down menus don’t support these findings on how we navigate the Web because they hide critical information we need:

  1. The trigger words, words and phrases that trigger a user into clicking, are hidden in the drop-down menus.
  2. Because we decide what we are going to click on first before moving to our target, we can’t make that decision without first seeing our target, which is hidden in drop-down menus.

Pathway pages, one alternative to effectively navigating

If we need trigger words to help us navigate, then don’t hide them. To help find information and make websites more usable, one option is to put the information and links on a pathway page. A pathway page’s main purpose is to help further navigating to the content and is the parent page of a section. A good pathway page answers the question: what’s in this section?

Start quote

A pathway page is like a table of contents
  • get a quick overview of what’s offered
  • pick the place you want to go to
Ginny Redish, in Letting Go of the Words: Writing Web Content That Works (page 58)

End quote

Usability test scenario

To see pathway pages in action, try this usability test on a website that uses pathway pages instead of drop-down menus. If you don’t have time right now, follow our screen-by-screen user experience of this task.

The scenario

  • You are up for a big promotion at work in the near future and have decided to use some of that money to travel.
  • A friend of yours recommended the TravelQuest International website because they offer exotic travel destinations, including trips to the Arctic, seeing the Northern Lights and solar eclipses.
  • On this website, your goal is to find a trip you like, find out what dates are available and what the costs are.
  • Go to the website and look around to see what you can do; look for options that will provide you with a list of available travel destinations.
  • Choose a travel destination that is of interest to you that you would like to visit.
  • See if you can find information about the trip dates and costs.