Web Writing That Works!

           A Project of
           The Communication Circle

Guidelines Rants Patterns Poems Services Classes Press Blog Resources About Us Site Map

HomeGuidelines > 6. Make meaningful menus!. > 6d. Write and display several levels at once.          

 

Diagram

Background

Examples

Audience Fit

Challenges

Bonus! Hot Text chapter (175K, PDF, 3 minutes at 56K)

6d. Write and display several levels at once.

  • Don't force users to go to and go to, and go to.
  • Display multiple levels on the same page, so users do not have to go to another page to find out what lies beneath the upper-level headings.
  • In general, move lower level headings to the right for Western audiences.
  • Do not require that people recall information from an earlier page, to decipher a menu on this page.
  • Do not rely on dropdown menus (cascading menus) because these do not remain stable long enough for people to understand the structure, and determine where they want to go. Once revealed, the lower levels should remain visible, without my having to hold down the mouse button.
  • Allow users to browse up and down a level without having to stop, go to another location, and start over. In effect, let them explore each top-level object to its depth, comparing all without moving.

  • Above all: Avoid changing the background. Give the illusion of staying put.

  Diagram

One solution: Put the 1st Level menu on the left side, and when the user chooses a topic, open that topic’s 2nd-Level menu on the right. In this way, you encourage browsing, during which the user can learn how you have structured the material. Such casually acquired knowledge helps speed access.

Here, the user has chosen Graphic Software.  At that point, the second column appears. The user then selects Monet Look, and Composition, unfolding the other levels in new columns.
 

 
 

 

 

Background

It may very well be that the depth versus breadth tradeoff issue is really misplaced and that the transcending issue is that of effectively revealing menu organization to users, while reducing the number of frames and responses required to locate target items. —Norman (1991)

The pedagogic vector also means that menus must be complete, offering a full selection of the actions and facilities available in the program. … Using every spatial and visual hint at our disposal, we should arrange the menus from left to right in some meaningful order. —Cooper (1995)

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)

See bibliography: Cooper (1995), Mandel (1997), Norman (1991), Tognazzini (1992).

Other ways to make your menus meaningful:

6a. Think of a heading as an object you reuse many times.

6b. Write each menu so it offers a meaningful structure.

6c. Offer multiple routes to the same information.

6e. When users arrive at the target, make it obvious.

6f. Confirm the location by showing its position in the hierarchy.

Resources on menus

Taking a Position on Menus

Heuristic Online Text (H. O. T.) Evaluation of Menus

Poster

Examples

Before

The original site showed only one menu at a time--tedious.

After

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. Clicking an item in the second menu opens the third menu. Clicking an item in the third menu opens the fourth. Clicking an item in the fourth menu takes users to the description of a painting.

In this way, you encourage browsing, during which the user can learn how you have structured the material. Such knowledge helps speed access. Because the background does not change from click to click, the user receives the illusion of staying put.
 

 
 

Audience Fit
 
If visitors want... 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 assure 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.

Ready for some challenges?

 

 

Don't make me take an ax to your menu!

 

Home | Guidelines | Rants | Patterns | Poems | Services | Classes | Press | Blog |
Resources | About Us | Site Map

Web Writing that Works!
http://www.WebWritingThatWorks.com
 © 1999-2004 Jonathan and Lisa Price
The Communication Circle
Discuss at HotText@yahoogroups.com
Email us directly at ThePrices@ThePrices.com
Order Hot Text (the book) from Amazon