In a sense, any Web page with links could be considered a menu. Still, it often helps viewers if major navigational choices are grouped on a single page: the subjects available at a site, the services offered by an organization, the table of contents of a reference document. Such menu pages pose some specific design challenges.
There are several ways to present links on the Web: as HTML text phrases, either in lists or within body copy, tables, or forms; as inlined graphical link anchors; or as areas within a single graphic, usually called an image map or clickable map. (Note that the two graphical options can include bitmapped type, permitting a greater range of styles than the standard HTML fonts.)
1. Suit your menu presentation to the number of entries offered.
Most people can't hold in mind more than about seven alternatives at once. If you need to present more choices than this, a numbered or alphabetized HTML text list will probably scan most easily. For a small set of choices, a well-designed graphical presentation (bitmapped text or icons on buttons or bars, for example) may be interpreted faster, be easier to select accurately with the mouse, and may encourage newcomers to explore your site. Grouping menu choices into categories (say, five documents and four navigational aids) can allow an effective graphical presentation if the groups are well separated and visually distinct.
2. Choose an appropriate balance between visual impact and speed.
The usability advantages of graphical interfaces for Web menu pages come at the cost of delay. The frustration caused by a carelessly designed graphical menu can easily overcome any intended benefit. The proper balance between speed and visual effect is influenced by several factors. The balance you select should serve the needs and interests of your expected audience. Frequent users of your site, those doing repetitive tasks, and those requiring rapid access to linked resources may be better served by text menus with little or no graphical enhancement. Consider the following factors:
A. Image loading speed.
For both image maps and simple graphical link anchors, large or complex images increase file size and thus loading time. Several techniques can be employed to tune graphics for fastest loading (refer to the Visual elements: Graphics section of this document). Several smaller images used as link anchors may load faster than a single large image map, depending on the size and complexity of the images involved.
B. Linking speed.
Image maps use a program on their server to recognize the area within the image that represents a link. When a viewer clicks on the image map, it takes a little time for the program to do its work. Depending on the complexity of the mapping, links made from an image map may be perceptibly slower to complete than those made from other types of link anchors. This does not mean image maps should not be used; just that you should consider the total time needed both for the menu to paint and a link to be made when testing the performance of your menus.
C. Connections, browser type, and audience habits
Decide on the longest time you want your viewers to spend waiting for your menus to load and complete their links. If your audience primarily consists of viewers with direct Ethernet-speed Internet connections, you will be able to present a much more graphical navigation scheme within the target performance limit than if your audience includes many viewers using dial-up connections. If your audience includes many viewers running graphical browsers configured with "images off," you will need to duplicate any graphical system with redundant HTML text choices, or they won't see your menus. Alternatively, you can simply include a discreet "[text only]" line below your graphical menu that links to a text-only menu file. You can instruct your server to redirect text-only browsers to a separate text-only menu file automatically.