In his book, Visual Communicating, Wileman (1993) describes a continuum of visualization from concrete pictorial visuals to abstract verbal symbols. In general, visual symbols are easier to comprehend than verbal symbols.

Verbal information holds no meaning if you have limited or no understanding of the language. Similarly, the arbitrary graphic symbol will not make sense if you have not been exposed to its meaning (e.g., the Christian cross). Consider traveling to a foreign country where you do not understand the verbal language (spoken/written). Would you still be able to find a doctor, golf course, train station, olympic event, or copy machine from the following visual symbols? Most likely!

When designing messages, a combination of both visual and verbal information is recommended to enhance clarity.

  

Tips for Designing Visuals

Carefully select your visuals on the basis of age, culture, and education. Will individuals who vary according to these characteristics understand the items you have illustrated?

 

   

When using visuals for site navigation, the icons should clearly and logically represent the content they are linking to. Click to enlarge the Design Studio sample at right. The icons have no logical relationship to the subjects being linked to. In the Volkswagen sample, the icons are blurred and can not be interpreted without passing the mouse over them to highlight a title. The site does provide text titles with their icons, however, to help clarify what the icon links to.

When creating page-turning icons, consider the use of metaphors that represent the topic you are discussing (e.g., navigation icons to earthquake and frog information at right).

 

 

 

Remember that experienced web users are familiar with iconic navigation, and they may expect small image clips to represent "clickable" or interactive options. In the Mezzina-Brown sample at right, the row of iconic images is simply used for aesthetics, not for interaction. The user is tempted to click on the images.

While a combination of visual/verbal information is suggested, do not overwhelm the learner with extraneous verbal information.
 
Use arrows or other visual cues to highlight important components of your visuals.
The largest item in a display will attract the most attention (e.g., the giraffe).
Understand the directionality of visual elements and their hidden meanings. Vertically-oriented visuals (e.g., city skyline) are best placed at the bottom of a page to draw the eye upward toward the instructional message. Horizontal visuals (e.g., camera) are neutral and stable. Visuals with diagonal lines (e.g., running) will pull the eye toward the direction of the line. Diagonal visuals should never be placed where they draw the eye off of the page or away from the instructional content as depicted by the BMW ad.
 
 
Visual animation should be employed sparingly for aesthetics (e.g., rotating "new" at right), but whenever possible to help clarify confusing concepts (e.g., differential acceleration of bike-chain at right).