Neo Insight's e-newsletter on Customer Experience topics and techniques.
We invite you to subscribe to our monthly
In this issue
Mega menu success hinges on support for top tasks and interaction details
The use of mega menus is increasing ever since Jakob Nielsen’s 2009 article: Mega Drop-Down Navigation Menus Work Well. Mega menus refer to large panels of links that drop down or fly out when the user hovers over global navigation elements. They can provide users with rapid access to the most frequent and critical tasks from anywhere in the website. Unfortunately, we estimate that 90% of mega menus are not realizing their full potential due to poor design and implementation. They often provide poor support for users' top tasks and an unnatural style of interaction. The good news is that getting them right is not that difficult.
90% of mega menus are poorly designed and implemented but getting them right is not that difficult – focus on the user's top tasks and fine tune the timing of the interactions
Mega menus can lead to mega success, but only if you attend to the details. A recent project of ours found that a newly designed mega menu could handle 70-95% of all support related tasks on this client’s website. That is quite an accomplishment, but it doesn’t happen by chance. There are two key attributes that make for a successful mega menu.1. Right links: Link labelling, layout and organization
2. Right interaction: Timing, feedback and support for natural movement
Right links: Link labelling, layout and organization
Mega menus are like small, concise HTML landing pages. They are designed to provide an overview of the sub-sections within one major section of a website. They provide signposts to frequently accessed or critical content and should support the top tasks for that section.
Some of the best practices for layout, organization and link labelling are:
The following example from Office Depot demonstrates a number of best practices, including:
By contrast, the following example has too many columns, no grouping, no category labels, no logical ordering of items and a tool tip that obscures the first link.
Right interaction: Timing, feedback and support for natural movement
Ignoring the timing of menu opening and closing is by far the most common reason for mega menu failure. People are often confronted by mega menus when they don't need them. Just moving their cursor may produce a barrage of unwanted flashing menu panels. Or, when they do try to access the mega menu it often disappears prematurely. People lose their sense of control.
Many times we’ve observed the following frustrating experiences. Any of them sound familiar?
Some of the best practices for mega menu timing, feedback and natural movement are:
The need for the last item in the list is due to the fact that most people try to take the shortest path to the link their desired link. Unfortunately many mega menus do not allow for this type of intuitive behaviour. Moving the cursor diagonally often unexpectedly triggers neighbouring menus and people have to start all over again.
The Guitar Hero site is a good example of poor mega menu implementation. It is like trying to navigate the steel ball in those children’s mazes where you have to tilt the device at just the right time to keep the ball from falling into one of many holes.
Go to the site and try navigating from the top right of the Games tab to the second link on the mega menu. You’ll likely trigger the Music mega menu unintentionally. If you do get to the Warriors of Rock link, try clicking the More Info button on the right. You’ll probably be treated to a series of flashing panels while en route. The originally targeted link will be long gone, or you might mistakenly click on the More Info button and find it is for a totally different product. The coders obviously want you to carefully follow the rectilinear green path shown below rather than taking the more natural, shortest path shown in red.
This type of game playing frustrates people when they are trying to get something done quickly. The Lowes website does a much better job for part of the experience but not all. Try going from the upper left part of the Projects tab to the Bath link on the left. Chances are the Savings panel will open while you are en route. However, once you are able to read the left hand menu for the Projects tab you’ll be able to very leisurely move your cursor to the Bathroom Gallery link under Project Ideas. In fact the delay may be excessive because it takes a little too long to trigger other left hand options. Always test with users to fine tune the optimal timing and interaction for each specific situation.
A good example of the best practices for timing can be seen on the Chipworks website. You can move the cursor up and down across the global navigation bar without triggering an unwanted mega menu. Pausing for a moment displays the mega menu. If you momentarily roll off the edge of the mega menu and quickly recover the mega menu will remain open. Finally, if you open one menu and then cross over one of the other global navigation tabs to get to the far side of the menu, the original menu will stay put.
In our experience, timing and speed of mega menu operations are absolutely critical to success. They can either make or break the experience. The algorithm must be smart enough to know when someone is moving to another link on a page, is trying to access the mega menu, or is still trying to navigate an open mega menu.
Timing and speed of mega menu operations are absolutely critical to success
Contact us at 613-271-3001 or email us if you would like us to help measure the effectiveness of your mega menus or website.
In our November newsletter we challenged you to try two tasks on each of two online bookstore websites – Amazon.com versus BarnesandNoble.com. We had 45 people respond to the challenge.
Performance was 85-88% for all but the video task attempted on the Barnes and Noble website. In that task, 23% of people thought they found the correct answer but they did not have the Blu-ray version.
The purpose of this summary is not to cover the results in detail but rather to show an example of benchmarking competitive sites. This is the big advantage of Loop 11. It allows you to do comparison benchmarking with websites over which you have no control. The program does not require you to put any code on the site to be tested. Test participants also do not have to download or install any code.
Unfortunately, it doesn’t work well with all websites. Long delays in page loads are encountered on some sites, specifically many Canadian government websites we’ve tested. There now is some code available to put onto these sites to overcome this delay but you do have to have administrator access to the website.
Loop 11 does provide a free preview mode so you can see if the websites you want to test will work well before setting up an account. The cost of a project is a flat fee of $350US. A project can include up to 1,000 participants with an unlimited number of tasks and questions.
Loop11 is also good for unmoderated A|B testing where you want to compare two design options or before/after scenarios. As with any unmoderated testing, getting the task wording crisp, unambiguous, and non-biasing is absolutely critical to success.
Loop11 generates a comprehensive results report in PDF format. You can also download an Excel formatted spreadsheet for further analysis. The summary data provided in the report are:
Detailed data by participant
Who has the right skill set? Who can solve the customer’s problem? Who is available now? For most employees finding people is the number one reason for using the intranet. It’s the foundation for collaboration, knowledge management and the social Intranet.
In this webinar Brian Lamb from Customer Carewords shares research on finding people on intranets based on survey responses from over 15,000 Intranet users and nearly 200 task test sessions on find people tasks.
Many organizations immediately think about technology when the topic of finding people on an intranet comes up. Moving away from this approach Brian takes a fresh look at what it means to find people and explains how identifying your top find a person tasks and measuring how well they work can lead to dramatic improvements in productivity and employee satisfaction.
The webinar takes place Tuesday, April 19, 2011 11:00 AM - 12:00 PM EDT
Quote of the month
"It's easier to use an eraser on the drafting board, than a sledgehammer at the construction site."
Frank Lloyd Wright
If you have any comments on The Insighter, or ideas on usability topics you'd like to send us an email.
We invite you to subscribe to