Fly-out, Slide-out, Drop-down, Cascading, Dynamic Menus have many names but have the same basic problem they cause serious usability and accessibility issues for your website.
As a web design firm, we occasionally have clients asking for specific features in their website. More often than not, it is because they have seen something cool on another site. Typically, this is more about the flash or coolness of the website than it is the websites true function. Often the conversation that ensues centres around the function of the feature and the benefit to the visitor of the site. Sometimes the feature in question can honestly enhance the visitors experience and is not simply a cool effect, but other times it becomes hard to justify the cost to usability and accessibility. The later is the case with Drop Down Menus, however it is often difficult for clients to grasp the issues with these types of dynamic menus.
Web Usability expert Jakob Nielsen, on his site Useit.com, states that “A site that has many user-experience annoyances demands more user time to complete tasks than competing sites that are less annoying, and feels somewhat jarring and unpleasant to use, because each annoyance disrupts the user’s flow. Even if no single annoyance stops users in their tracks or makes them leave the site, the combined negative impact of the annoyances will make users feel less satisfied. Next time they have business to conduct, users are more likely to go to other sites that make them feel better.” There is no doubt that a poorly constructed navigation system for a website will cause many, repeat annoyances to its visitors, in terms of confusion and frustration locating the desired content, they are then moving to competitors sites that offer a better user experience.
The usability issues with Drop-down Menus
In an interview by Web Reference Interview with Jacob Neilson and Marie Tahir on Homepage Usability, the issues with Drop-down Menus become clear. Marie Tahir states:
1. Drop-down menus give no visual affordance that they have information lurking beneath, so people often don’t know that they are there.
2. Many users are startled when they hover over an area of the screen and a new element pops up unexpectedly.
3. Drop-down menus negate any “benefit” from using submenu items, as they hide or diguise the hierarchy of the site.
4. Drop-down menus often use tiny fonts and place the items very close together. This means the user must have precise mousing skills in order to select the right item. In many of our studies, we’ve seen users select incorrect menu items from dropdowns.
Marie’s last point “precise mousing skills” leads us perfectly to the next set of issues with Drop-down menus, accessibility issues. In an interview with the Web Standards Group, accessibility expert Russ Weakley, spoke about how Drop-down menus are often hard or impossible to use for certain user groups:
1. People with arthritis, Parkinsons and other forms of limited mobility often find it very hard to use drop-down menus. It takes a degree of dexterity to move the mouse to the desired drop-down item.
2. People who use screen magnifiers often find these menus hard to use. When the screen is magnified extensively, drop-down items can sometimes disappear off screen. In some cases, it is impossible to navigate to the drop-down items, as moving the visible screen area deactivates the drop-down.
3. Many drop-down menus are built using nested lists as the underlying markup, which cause blind users using screen reading technology to have trouble. The user is not notified when they leave the nested list and move back into the main list again. This can cause considerable confusion – especially when the nested lists are part of a complex site navigation.
4. Although this may not be a major concern for every site, people with cognitive impairment (even mild cognitive impairment) often find these menus hard to use and understand.
Further and more dire, government bodies are warning against Drop-down menus. US Government web design and usability guidelines warn against using drop-down type menus and lists, stating that one of their studies showed that some users, particularly older users, just do not know how to use drop-downs. The Royal National Institute of Blind People warns that Drop-down menus are often difficult or impossible to read.
Jacob Nielsen sums it up well, referring to a recent study and report, Nielsen Norman Group Report, E-commerce User Experience: Design Guidelines for Shopping Carts, Checkout, and Registration. “Sometimes users selected the wrong menu option and then had to waste even more time with the drop-down. And, in this study, we mainly tested young, able-bodied users; the situation is even worse for elderly users, who have more difficulty with extensive, fine-tuned mouse manipulations. And it’s worse yet for users with disabilities.”
So why consider Drop-down menu at all?
A study by the Psychology department of Wichita State University, compared the use of Drop-down versus Indexed Menus (a basic list) and had this to say. Drop-down menus have the advantage of requiring little screen real estate. But their study revealed that Drop-down menus required significantly more search time than the Index menu layout. That is to say that the test subjects had a harder time understanding and using Drop-down menus and it took a much longer time to get where they wanted to go on the website.
So just screen space? No, web design expert and usability advocate Jeffrey Zeldman suggests that it is an excuse to avoid proper organization of website content, as stated on his blog “When I see a drop-down menu, I know that a committee sat around a table, unwilling to think through the organization of the site’s material into a user-focused structure or unwilling to accept the recommendation of a web designer who spent days making sense of the site’s offerings.
A drop-down menu tells me there were too many decision makers, none of whom understood that the user’s needs were more important than their ego-driven desire to win front-page placement for their little piece of the content puzzle.
Smart clients know it’s their job to understand why people visit their site, and to arrange the material along paths driven by their visitors needs. But even very smart clients sometimes lose the battle to a higher-up who knows and cares nothing about user experience.”
Once you recognize the issues with Drop-down menus, you have to confront the truly difficult issue of Web site navigation. What will your users most want to do at any given time? What should you show them? You may not get the content organization absolutely correct the first time and you will need to monitor what your website visitors are doing on your site so you can make adjustments over time. Eventually, you’ll be able to send most of your users straight on and they’ll never have to stop and click around to find out where to go.