Web Design 

 Lynx Users:Press Return (Enter) to skip the Menu below and jump down to start of page info

Design Theory

Site Design

Metaphor

Page Design

MultiMedia

Teacher Resources

Table of Contents

Home Page


Copyright © 1999 by Bonnie Skaalid

Metaphor

 

One of the ways to make a web site understandable and easier to use involves the use of metaphor. A good metaphor makes it much easier to anticipate actions. Two of the metaphors which have made the web experience easier to understand involve the ideas of browsing and searching. Both of these metaphors have been transferred from our understanding of how you find things in a library. Browsing occurs when you wander around looking for something interesting while searching involves designing an active plan to find some information.

Time spent in front-end analysis will be time well spent if a useful metaphor can be developed to help navigation. For example, many shopping sites use the metaphor of the catalogue, with main navigation menus similar to the categories found in a paper catalogue.

Examples of Sites with Strong Metaphors

Note: these links contain screenshots with graphic files ranging in size from 40k to 60k which may be slow loading on 28.8 modems.

Conceptual Models and Mental Models

The designer analyzes the content to be taught, the task to be performed or the information to be displayed, and defines its structure and functionality. This structure in the designer's mind is called a conceptual model ([1] p. 14)

The user also has a model, a mental model which he has built up according to his experiences in a site. For example, a designer may have in mind an online catalogue, with feature screens describing products and an online ordering system (here again, we use the metaphor of the catalogue to make things easier to understand). The user may be familiar with the paper version of a catalogue but may be unsure how the online version corresponds to his understanding. After trying options, the user will begin to develop his own mental map, based on his experiences. However, if his mental model is different from the designer's conceptual model, errors will occur and the user will become confused or frustrated. In designing a conceptual model, the closer your design matches familiar situations, the easier your system will be to use.


[1] Bielenberg, D. (1993). Interactive design and the mythical "intuitive user interface". Journal of Interactive Instruction Development, 6 (2), 14-19.

Site Design:[Hypermedia Basics] [Metaphor] [Web Site Categorization] [Navigation] [Site Design Testing]

Main Level: [Home Page] [Design Theory][Site Design] [Page Design] [MultiMedia] [Teacher Resources] [Table of Contents]