SURL Home


Criteria for optimal web design (designing for usability)

By Michael L Bernard

 What is the best way to arrange menus

People make fewer mistakes and find information more quickly if the menu structure of the site is broader rather than deeper (For a discussion, see Structure page).

Information is found more quickly in Index menus than in cascading menus.  In a study by Bernard and Hamblin (2003), three menu layouts were compared for objective and subjective performance, as well as overall preference. The menus structures consisted of an index layout (like Yahoo.com), a vertical cascading layout, and a horizontal cascading layout. Significant differences in search time were revealed between the three menu item layouts that favored the index menu layout. In addition, there was a non-reliable trend that favored the subjective opinion that the index layout was less disorientating than the other two layouts. Moreover, participants selected the index layout as their first preference choice more than the other two layouts. The poorest performer, both objectively and subjectively, was the horizontal layout.

The use of the "breadcrumb" menus may help reduce user disorientation within the structure of a site. A breadcrumb menu organizes text links from the sites home page to the page's current location (see example below).

Homepage > First level > Second level > presently viewed level

For example, Maldonado and Resnick (2002) found that the use of breadcrumb navigation did reduce user search time, as well as reducing errors and clicks to a marginally significant degree in comparison to expanding hierarchies. However, Lida, Hull, and Pilcher (2002) found in their preliminary study, that participants rarely used breadcrumb navigation, and those who did were not any more efficient than users who did not use breadcrumb navigation. Participants in this study used a variety of navigational tool, such as the Back button, left and top navigation bars, and searching to find information instead of or in addition to the breadcrumb tool. Thus, the benefits of breadcrumb navigation are still inconclusive.

Embedding links within a document is preferred to explicitly listing them near the document. A study by Bernard, Hull, and Drake (2001) compared links:

  1. embedded within a  document;

  2. links positioned at a bottom of the document;

  3. at the top-left of a document; and 

  4. at the same height to which it corresponded with the associative article.

No significant differences between the four link arrangements were detected in terms of search accuracy, time, or efficiency, suggesting that link arrangements for non-frame documents do not have a great affect on its actual navigability.

However, there were significant subjective differences between the link arrangements favoring the embedded links. That is, participants indicated that they believed that embedding the links within a document made it easier to navigate, easier to recognize key information, easier to follow the main idea of the passages, and promoted comprehension. Moreover, participants significantly preferred the embedded link arrangement to the other arrangements.

In a follow-up study, Bernard, Hull, and Chaparro (2002) examined the placement of links in four locations on a web page for user performance and preference. The link placements consisted of

  1. links embedded (Embedded) within a document;

  2. links embedded within a document and placed adjacent to the left side and at the same height as the corresponding embedded links (Left-Embedded) of the associative document;

  3. links placed at the top-left (Top-Left) of a document; and

  4. links placed within a vertical frame (Frame) to the left of a document.

In this study, participants using the Left-Embedded condition had significantly faster search times than the Top-Left condition. Participants also perceived the Left-Embedded and Frame conditions as easier navigate and to find information compared to the Top-Left condition. The Left-Embedded condition also was perceived as promoting higher levels of comprehension than the Top-Left condition. Overall, the Left-Embedded condition was most preferred and Top-Left condition was the least preferred

Categorical menus are superior in both search performance and  satisfaction to alphabetized sitemaps. As found by Bernard and Chaparro (2002), McDonald, Stone, Liebelt (1983) and others, one of the main reasons for higher performance was that it was more difficult to find information in the Alphabetized sitemap because participants had to guess how this information was worded in the menu. Since index menus are generally based on the alphabetization of the first letter of the hyperlink names in the menus, users may have to guess the wording of the hyperlink name in order to search in the appropriate area, which may have led to lower levels of search performance and satisfaction.

Moreover, as long as the menu items are optimally grouped, the number of items placed on one page can be quite high. In fact, Paap and Roske-Hofstrand (1986) state that as many as 78 items can be placed on a single page without substantially decreasing performance.

Categorical menus arranged in columns are searched faster than menus arranged in rows. In fact, Parkinson, Sisson, and Snowberry (1985) found that search time was reduced by 25% if the categorical menus were arranged by columns. They also found that if the menu links had one additional space between category groups resulted in even faster search times.

Menu Links accompanied with a summary text tend to be preferred to menus without summary text. That is, a study by Baker, Bernard, and Riley (2002) found that summary menus were perceived more positively in terms of ease of finding information, being visually pleasing, promoting comprehension, participants' satisfaction with the site, and looking professional.

References

To top of page

Software Usability Research Lab
Dept of Psychology
Wichita State University
Wichita, KS 67260-0034

Optimal web Home |Usability News | WSU HCI Lab | WSU Human Factors | WSU Psychology


Contact: Michael Bernard with questions regarding this site.
Last update: March 31, 2003
URL: http://www.optimalweb.org
Disclaimer and terms of use