Usability Tools Podcast: Mouseovers in Navigation

Jared Spool

December 17th, 2007

Usability Tools Podcast: Mouseovers in Navigation
Recorded: November 20th, 2007 from the studios of UIE
Brian Christiansen, UIE Podcast Producer
Duration: 24 min | File size: 14 MB
[ Subscribe to our podcast via iTunes. This link will launch the iTunes application.]
[ Subscribe with other podcast applications. ]

Play

Each week in our Usability Tools Podcast, we will be sitting down to discuss tips and tools for improving your site’s user experience. We’ll share some of the most important findings from UIE’s research on web design and usability.

It’s tempting to spend a ton of time creating slick flyout, dropdown, or pop-up navigation on our site, but is it worth the effort?

This week, Brian Christiansen and I discuss interactive mouseover techniques for navigation. Are they a good idea when it comes to actually using your site? Based on our testing, we don’t think so.

Some of the issues we address are:

  • Why would designers want to use mouseover navigation?
  • How do mouseovers become an obstacle to navigation?
  • What effect does mouseover navigation have on users finding their trigger words?
  • What sites are good examples of navigation without mouseovers?

Here’s our list of referenced links for the episode:

As always, we’re very interested in hearing from you. Do you have questions or comments about this episode? We love to create shows based on your questions. Please leave a comment below or email us directly at mailbag@uie.com.

UIE’s Latest Research: If you’re interested in the topics we discuss in the podcasts, I highly suggest you sign up for our free newsletter, UIEtips, to read our latest usability and design research as soon as we publish it. We’ll also notify you in UIEtips when we publish new podcasts.

Survey and listener drawing!
We would like to give you and your co-workers free admission to our next Virtual Seminar program, with full, lifetime access to the archived program as well! All you need to do to win is give us your feedback on your podcast listening experience. Fill out the following survey and each week we’ll randomly send one survey participant a free admission to the next UIE Virtual Seminar and Archive, a $169.00 value! We appreciate your input!

Participate in our survey to win!

13 Responses to “Usability Tools Podcast: Mouseovers in Navigation”

  1. Daniel Szuc Says:

    We see users rely heavily on “Home” as a way to get them back to a said starting point. Its either used if they are feeling lost deeper in the site or to start a task again.

    We also recommend to clients to have a “Home” button – Jared and crew — do you see similar behaviors?

  2. Ryan B Says:

    Why do you praise staples.com? I’m having a hard time seeing what there is to like. First of all they do use fly-out menus in their navigation. However, their product navigation is a list of links on the home page so let’s focus on that.

    Okay, there’s 3 long lists of links. Let’s be generous and say you’ve guessed the correct column. How do you find the trigger words in this mess of links? It took me a few seconds to realize the list is in alphabetical order which somewhat helps, but then they list multiple products on each line so that kind of defeats the purpose. For example, try to find “projectors” on staples.com.

    Once, I finally find what I’m looking for and attempt to view the products, but I’m presented with a dialogue box asking me for my zip code. Why is this necessary just to view the products?! Same thing goes for doing a simple search.

    Contrast this with officemax.com which you say is much more difficult to navigate. I find their alphabetical list of fly-outs are ingenious. You have something in mind of what you’re looking for so you know what the first letter is. After that it’s in alphabetical order. Finding projectors here is so simple and clicking the link goes right to the product list. How can you say Staples is better?

    I have enjoyed your articles and studies immensely, but this kind of thing makes me question the credibility of them.

  3. Christian Watson Says:

    A very interesting and enjoyable podcast. However, I too am struggling with the seemingly “hard and fast” rule that you have set down.

    I don’t imagine (famous last words) that OfficeMax just threw their flyout directory up there without testing it and even the lauded Netflix uses a flyout menu and we know that they test everything.

    When 40-50% of large web sites are using flyouts you can imagine how hardit is to argue against them even if I do invoke your good name. Any thoughts on this?

    By the way, for a really bad example of how to do flyouts, just go to GM’s web site.

  4. The Worst Home Page of 2007? | MT-Soft Website Development Says:

    [...] by admin in Uncategorized I just listened to UIE’s most recent usability tools podcast on mouseovers in navigation in which Jared Spool railed against flyouts and reminded us that users prefer link rich home [...]

  5. Podcast notes: Mouseovers in navigation « Warehouse Says:

    [...] notes: Mouseovers in navigation Published December 26, 2007 Usability UIE podcast (24 min) with Jared Spool on the sense of using flyout, dropdown or pop-up elements in [...]

  6. Woody Says:

    Jared, for the money you charge for “expert” podcasts, at least you should publicly answer these questions that have been posted and defend your rules. What say you?

  7. Woody Says:

    and by the way, the User’s Decide First, Move Second link above is a dead link.

  8. L C Says:

    This was a very interesting podcast, and right on time, for the fact that a flyout menu is being considered for a project that I’m working on. And it has brought some very important issues to light.

    I have to say, though, that I agree with a few a the previous posters. It would be very hard trying to convince designers not to use flyouts at all. I do however believe that they can be implemented in a more usable manner. For example,

    If flyouts are thought to be needed, designers may want to make sure that …

    1. …when they are activated that it will not obstruct other major action elements on the page, such as search boxes or buttons. I think that barnesandnoble.com displays a good example of that. Also, they seem to only use the flyout only as they see necessary, not for every single tab on the site.

    2. …for the sites that seem to lock users into flyouts, provide a small close icon/link. I have to say I personally don’t like the ones that disappear on mouseout because if you make a very slight mouseout move, poof! the flyout is gone. There has been times when I have been stuck in a terrible loop trying to get to a lower level but the flyout is super sensitive & keeps disappearing on a slight mouseout.

    3. …a maximum level standard could be set, probably no more than 3 levels down.

    These are just a few thoughts, because both clutter (showing everything on the page) & the “quirky” flyouts are usability issues. We need to think of something to allow a happy medium.

  9. Dan Says:

    Here is a nice alternative that allows you to have your cake and eat it too.

    The Kroger Co. recently redesigned their web site (www.kroger.com). You will noticed that the Kroger site provides fly out menus for the main navigation, however they also provide a “See All” category that reveals everything on their site. Haven’t seen this pattern in practice before, but it is an elegant way to assure that marketing has their homepage space for promotions while allowing visitors to quickly scan the site sub-categories.

  10. usability Calander — Why UI? Says:

    [...] much information creates a clutter on your page, so sometimes it is good to keep some things aside, Jared spool has a good podcast on the subject. April: Video is dandy – as long as it support the user task. May:Don’t require login if you [...]

  11. Dean Says:

    This podcast really challenged my thinking about flyout menus. I have always thought of flyout menus as a way to simplify the home page.

    I would be very interested to know if the Jared and Brian have any thoughts as to what is the “right way” to use flyout menus.

  12. The Worst Home Page of 2007? · LastBlog.net Says:

    [...] just listened to UIE’s most recent usability tools podcast on mouseovers in navigation in which Jared Spool railed against flyouts and reminded us that users prefer link rich home [...]

  13. A guiding light for designers - Darjeelink - Alexis Perrier Says:

    [...] I listened to yesterday in the metro, was about using fly over menus for navigability purposes: Usability Tools Podcast: Mouseovers in Navigation . You know, you are scrolling around the page and the menu suddenly pops up and unfolds. The [...]

Add a Comment