I don’t mind drop-down menus. They give designers and information architects options for using screen space wisely. But I think many sites do themselves a disfavour by using them in an inconsistent manner.
The popular travel site Carnival Cruise Lines is a perfect example of what I’m talking about. I love the design of their site. For a travel website, it’s very good; it’s clean, and professionally designed. But I have one small problem with their drop-down menus.
Here’s a screenshot of the home page:
From that screenshot, I’m sure you can immediately see where the drop-down menus are. The indicator for these menus is the little red downward-pointing arrow on each of the links to the right of the Carnival logo (“Port & Destinations”, “Ships & Staterooms”, etc). So here’s how one of the menus looks when it’s open:
Looks great. No problem so far right? But notice in the first image, below those “drop-down” navigation items, there’s another blue navigation bar, with three more links, plus a search box. This seems to be the primary navigation bar. What happens when you hover over these three links? The first two are fine, just regular buttons that change color on mouseover. But then, what’s this on the third button?
There’s another mega drop-down menu that appears on the “Special Offers” link.
So What’s the Problem?
It might seem harmless to have such a “surprise” menu appear. If it appears, the user just rolls off and continues what he’s doing.
But what if they actually use that menu during their visit, then they come back to the site to do something similar? Now they’ll be scanning the home page, looking for the link that triggered that drop-down menu. Eventually, they’ll find it. But it may take just as long as it did the first time. It shouldn’t. They should be able to see immediately the link, and the presence of the drop-down.
If you’ve read Steve Krug’s Don’t Make Me Think, then you know how important it is to avoid unnecessarily delaying the user experience. For example, on page 15, Steve says:
[W]hen we’re using the Web every question mark adds to our cognitive workload, distracting our attention from the task at hand. The distractions may be slight but they add up, and sometimes it doesn’t take much to throw us.
Wise words indeed, and certainly applicable to “surprise” drop-down menus.
Again, this is not a major issue, but I feel it’s inconsistent to have drop-down menus that sneak up on users like this. This is especially bad when all the other drop-down menus on the page are indicated by little red arrows. The point here is: Be consistent.
In the case of the Carnival design, they may have their reasons for doing this. Maybe another red arrow didn’t fit well into the design. Maybe this drop-down was added later. Maybe there’s politics at work that I don’t know about.
But when preparing a new design, I think all drop-downs should have some sort of visible indicator that they are there, otherwise users will often be confused, irritated, and their experience will be unnecessarily slowed — even if only minimally.