This chapter is from the book
This chapter is from the book
This chapter is from the book
Write and Display Several Levels at Once
){kind=link}
Background: Organize your guest's impressions
In the Impressions home page, the user clicked Graphic Tools, and the second level menu appeared. On that, the user clicked the Monet look, and the third level appeared. When the user chose Composition, the fourth column appeared with some of Monet's most famous paintings. Simply by clicking around, a user can unveil the entire contents of the site, gradually unfolding columns to find out what lies beneath what. Without going anywhere the guest can explore the complete structure.
Using every spatial and visual hint at our disposal, we should arrange the menus from left to right in some meaningful order. (Cooper, 1995)
Don't hide top-level menus
In the bad old days, every time a user chose an item on one menu, the menu disappeared. The user went to another menu. Then, when the user chose something on that menu, it too disappeared.
There is no expedient to which a man will not go to avoid the real labor of thinking.
—Thomas Alva Edison, Placard in his factoriesThinking is the hardest work there is, which is the probable reason why so few engage in it.
—Henry FordThe recognition of structure gives the mind its ability to find meaning.
—Suzanne Langer
In the early days of online help, we regularly confused our users by snatching one menu away to display another. After puzzling people for six months, our team stumbled on the idea of displaying submenus on the same page as the main menu. What a concept!
Immediately the people we were testing sighed with relief. They no longer had to try to remember where they had been. If they happened to guess wrong about a particular top-level item, they could just back up and try another one. The penalty for guessing went way down.
To help users' short-term memory, menus should not require users to remember information from a previous menu or screen in order to make a selection on the current menu. If that information is needed, the system should present the information wherever it is needed, not just on the original screen. (Mandel, 1997)
We've come to accept the convention that a main menu will remain visible at the top of every page, so people can navigate quickly (and soak up the basic structure of the site). By extending the menu system in columns from one side to the other, in sequence, you can help people remember where they have come from, which also helps them figure out where they are going.
Don't try cascading more than one level where people have to slither over from one column to the next, without slipping off. Most people fail to navigate more than one level of these slippery submenus.
Let users perceive stability
Bruce Tognazzini, former user interface czar at Apple and Sun, liked to say that people hated go-to's. Whenever the background of a page dramatically changes, people register that as going to a new location. Once they perceive more than the magic number of seven (plus or minus two) locations, their short-term memory bursts, and they no longer feel confident that, if asked, they could recite the exact sequence they have traversed.
A work has form in so far as one part of it leads a reader to anticipate another part, to be gratified by the sequence.
—Kenneth Burke
They begin to feel lost in hyperspace. For example, once, when Jonathan was testing an early version of a help system, a woman ran from the room retching. She threw up some more, and then came back and told him that she felt so disoriented by his hypertext that she had begun to feel woozy, as if she were sitting in a rowboat in a heavy swell. She had lost her bearings.
When the background stays put, people feel that they have not gone anywhere. Remember those cartoons where Roadrunner zips across the desert in front of mountains? If you look carefully at the individual frames of animation, the mountains stay put, but Roadrunner moves an eighth of an inch from cel to cel. So we feel like we are standing still watching, without changing our position, as Roadrunner goes by.
Similarly, if you keep the main menu steady on the left, and simply expand to the right, most people perceive the scene as stable. They do not feel they have gone anywhere. Result: their inner ear stays calm. That's what Tog calls "perceived stability."
Examples
| Before | After |
The original site showed only one menu at a time—tedious. |
The site puts the first level menu on the left side, and when the users choose a topic, opens that topic's second level menu on the right, and so on. Because the background does not change from click to click, the user receives the illusion of staying put. |
){kind=link}
){kind=link}
Audience fit
|
If visitors want this... |
How well does this guideline apply? |
|
To have fun |
If your guests like guesswork, hide the menus and make them figure out the path. Otherwise, keep the main menu steady and reveal the others gradually. |
|
To learn |
Best to show the whole structure, or as much of it as you can, to organize understanding in advance, and build long-term memories. |
|
To act |
This method assures faster and more accurate navigation. |
|
To be aware |
The mind likes structure. Even if you are trying to still the mind, revealing your structure gives it less to chatter about. |
|
To get close to people |
The less you confuse them, the more they can listen to you, and swap opinions. |
|
|