December 9, 2003
There’s nothing like a click
Flyout menus: I don’t like ‘em. I don’t want ‘em.
Recently, my employer, AJC.com, switched to using flyout menus, and many other Web sites and Web applications use them.
I understand the need. As a designer, you have to constantly make choices about how much information to present — what to hide, what to show. For a very deep site, it can be overwhelming to present all of the sections and sub-sections of site.
I personally tend to favor an approach that does some good top-level factoring so you can present the user with a decent number of choices that is not too over- or under-whelming.
Some designers turn to fly-out menus, which I can’t stand.
Why?
The fundamental user-interface on the Web is a click.
It’s a click on a link that takes a user to another page, a click on a submit button that activates a form, a click on the home button in the browser lets the user escape.
All fundamental change on the Web is started by a click.
Flyouts annoy me because they introduce a fundamental change — the layout changes, content and/or navigation may be covered up by the flyout — on hover.
Users may have to move their mouse across a page to access in-page navigation, browser navigation, scrollbars, other applications, etc. What I’m saying is, there’s a whole lot of moving going on, when it comes to the mouse.
Users may even move their mouse over link choices — expecting to see the URL in the status bar, or a title if its provided. They may move the mouse over the link as a virtual equivalent of running your hand over a shelf of books while looking for the right one.
Any way you slice it, it can be very disruptive to have a menu come flying out of nowhere.
If you have to obfuscate menu choices, then I think the better way to do it is with the Mac twister style.
What’s the Mac twist, well it goes like this:
If you’ve used the Mac Finder in “list mode” you can drill down to sub-folders within a window by clicking on the arrow next to a folder. Screenshots: Closed, Open.
One site that I use often, my Web host‘s control panel, uses Javascript to create a similar experience. Screenshots: Closed, Open.
For those with Javascript disabled, you’re taken to the first sub-menu option when you click on a top-level option, and on the page you’re taken to the menu has been expanded…
So, though I think having more options visable to start with can avoid a user jumping back and forth, if you’ve got to do DHTML menus, please let’s do the twist.
Filed under: Web design
Next: I don’t want to say I told you so…
Previous: This Tux’s for you
Related
-
http://www.edifyingspectacle.org/gullibility/blog/ Richard Evans Lee
-
http://www.heisel.org Chris Heisel
-
http://www.7nights.com/asterisk/ Keith