Beyond HTML!

Have you noticed that the library within the walls is deceptively quiet these days? As the World Wide Web (WWW) becomes the library without walls on users' desktops, information itself has become the representation of services and resources. An increasing amount of library outreach to its parent community is done though amateur or professional graphic design skills with Hypertext Markup Language (HTML). Information professionals have by necessity become graphic designers, creating and adapting print and electronic documents, whether you use a hired hand to do the actual HTML coding or possess the determination to do it yourself. Your design decisions and handiwork will end up in electronic:

* Newsletters and service announcements

* Resource guides and bibliographies Educational and use resources

* Public relations materials & virtual "tours" of facilities

* Administrative and business documents

* Databases and catalogs

We know we are designing many electronic documents and interfaces that may never be intended for printing or paper distribution. Yet our own previous training and experiences with creating and using print may effect our perspective on the possibilities for interface design.

Are information professionals constrained by traditional print paradigms? More than likely, information professionals are victimized by those paradigms: expensive dissemination, easy vandalism, infrequent revision, sequential presentation, etc. Although HTML and the WWW offer solutions to most of these problems and the possibility of a rich visual design palate, most information professionals have no formal training in graphic or interface design. Don't be too discouraged, however. Most graphic designers have no formal understanding of human perception, memory, or recall!

This article starts from the premise that knowledge of cognition, memory, and graphic design principles can and should improve design outcomes for the computer interface. Understanding the basis for visual perception and cognition begins with acknowledging the biological basis of our visual senses.

OUR VISUAL SENSES

Visual scientists generally agree that the brain performs rapid "parallel processing" of color, shape, and motion. Two types of receptor cells dominate the visual structure of our eyes: rods and cones. Rod cells function in dim light and are sensitive only to contrast, not to color. When you search for the right key in a dark hall, you are relying on the perception provided by rod cells. Cone cells are the sensory mechanism for color. Most cone receptor cells are differentiated into three sub-types by their sensitivity to a particular section of the color spectrum, either red, green, or blue. Besides color, cones are also sensitive to and produce the sensations of shape and motion.

Understanding the biological basis of the human visual system can guide the usage of interface attributes, particularly the use of color. Blue-sensitive cones are the least numerous of the color-sensitive cones. In the fovea, or center of the eye's retina, there is also the smallest distribution of blue-sensitive cones. In considering color design, it would make sense to use blue as a background or peripheral color and not use blue for detailed features in the center of an interface. Using the color red to draw attention makes biological sense as well. Of course, most persons have experienced the uncomfortable sensation of vibrancy or after-images when color opposites are placed next to one another, so care must be taken to create a comfortable experience with the color palette.

Ever hear of the color consultant Roy G. Biv? This renowned figure is actually the key to remembering the spectral order of colors visible to the human eye: red, orange, yellow, green, blue, indigo, and violet. If your design style calls for a rainbow, don't forget that spectral order appears natural. Positioning colors from opposite ends of the spectrum together will tend to create the sensations of vibration and after-images.

COGNITIVE PROCESSING FOR MEMORY

Whether or not we believe that our cognitive processes are deliberate or automatic, there is little doubt that the computational era has also brought a systematic model to the forefront of theories of human cognitive processing. A typical example of systematic human information processing has been presented in John R. Anderson's work Cognitive Psychology and Its Implications (4th ed., W.H. Feeman, 1995). In Anderson's model, sensory stimuli based on visual processing must go through a systematic process of attention and rehearsal if they are to have any chance of conversion to long-term memory. The difficulty of turning sensation into memory derives from the impermanence that characterizes sensory memory. This short-term memory is visual in nature and particularly prone to rapid degrading when not given a repetitive processing boost and eventual long-term storage.

Anderson's identifies attention as a limited resource that can be allocated only for a small number of simultaneous processes. Well-rehearsed processes require less and less attention, and those well-rehearsed processes become automatic, freeing mental processing resources up for rehearsing new sensory memories. For instance, a bicycle rider pays more attention to the horizon and immediate navigation decisions than moving the pedals. Thinking about abundant graphics and multimedia on most commercial WWW pages, it is no wonder that a searcher may forget their purpose when several simultaneous animations beckon.

Gary Marchionini, author of Information Seeking in Electronic Environments (Cambridge Series on Human-Computer Interaction, No. 9,1995) summarized the basic tenets of the information processing model of cognition that can be applied in interface design:

* Humans have a working (short-term) memory of limited capacity of five to seven "chunks" of information, though "chunking" strategies can extend the maximum limit.

* Humans must have their attention refreshed frequently.

* Recalling information from long-term memory requires more cognitive effort than recognizing information models.

Distractions can interrupt the cognition and memory retention process. George Sperling of AT&T Bell Labs published cognitive research results in Acta Psychologica, 27:285, 1967, demonstrating the consequence of memory tasks followed by bright light visual exposure as compared to memory tasks followed by exposure to a dark background. His experiment demonstrated how bright post-task exposure could wash out identifications in short-term sensory memory. In comparison, dark subsequent exposure was not marked by the same degree of sensory memory deterioration.

One of the most universal standards of the print publishing world has been the use of white or light colored paper with black or dark characters and symbols. Many factors account for this standard, not only in the economics of printing but also in the combination of black on white as high contrast in low lighting reading situations. In interface design, computer screens provide legibility in any background lighting setting, except in the unsettling presence of glare on the screen surface. Because of Sperling's experiment, we must consider that an unintentional or deliberate bright white background may actually work against the ability of users to recall visual information from previous screens.

In an information system design, a sensible application of Anderson's and Sperling's research would focus on enhancing the interface to extend attention and cognitive processing for memorization, as well as allow users to take advantage of well-rehearsed, consistent navigation controls to maximize the opportunity to attend and encode new information. If bright white in a visual field has been shown to significantly degrade memory retention, one design decision would be to use darker background colors and a high contrast light-colored text. However, there may be editorial decisions in favor of print paradigms in bringing a new user group from print culture to a computer interface, so the use of a white background may be unavoidable. When design considerations include large areas of bright white, a sensible cognitive navigation device would be to delegate part of the screen to displaying the current pages hierarchical relationship and hypertext links to any page in the previously viewed sequence. Such a navigation aid is generally welcomed as a relief from general disorientation tendencies associated with World Wide Web hypertext navigation.

PROXIMITY AND SHAPE

Another aspect of attention and memory processing is the degree to which a visual design accords with internalized Gestalt principles. When presented with a complex pattern of visual elements, humans tend to decompose the presentation into units and features and make assumptions based on visible relationships between or among elements. The four major principles include:

Proximity: elements close together organized as units

Similarity: objects that look alike get grouped together

Good continuation: continuous lines valued over sharp turns

Closure/good form: assume similar form when partial similarity is visible

Users of a computer interface will probably follow these Gestalt tendencies, and in effective screen design, it is important to understand the strength of these principles and the ambiguity or discomfort that will occur if a user senses a relationship that was not intended. A simple example using the principle of proximity is that in a chart of rows and columns, the initial viewpoint orientation for the data in the chart are the items with closer proximity. Typically, the user sees parallel lists of things, because rows have tight spacing and closer proximity. Of course, these Gestalt principles are only tendencies, and design elements such as color can create a relationship of similarity, apart from placement.

Research on users' experience with proximity and screen layout is yielding insight into contemporary interface design. Uppsala University's Else Nygren's thesis ("From Paper to Computer Screen: Human Information Processing and User Interface Design." 1996. Dissertation Abstracts International Accession no. AAGC503396) established that vertical alignment and items in columns produced more rapid scanning, compared to slower scanning of items in horizontal alignment. Nygren also demonstrated the consistent inefficiency created by grouping without sorting. In other words, choosing categories and evenly distributing a mixed set of items among them will only insure a lengthy process of searching for a particular item upon each user visit. It is no surprise that the most effective principle is grouping paired with sorting. Displaying items in a fixed position from screen to screen also effectively limits search space and reduces the cognitive load produced by unfamiliar scenarios.

Visual signs such as icons and symbols are popular elements, which introduce both meaning and value through an easily recognized shape or representation. Icons are distinguished from symbols by their resemblance to their meaning, such as a small magnifying glass that offers the ability to enlarge a viewpoint. The best icons provoke immediate cognitive recognition and processing. On the other hand, symbols are visual signs with a learned association common to a group. A symbol may therefore be totally arbitrary in appearance and chosen for aesthetic or entertainment appeal. Once a common understanding is established, a symbol may take up less space than the equivalent in words. For cognitive design, it is important to demonstrate consistency, clarity, simplicity, and familiarity. Complexity will tax the limitations and capacity of short-term memory in viewers pondering your aesthetically dynamic creation. As one famous sports shoe company recently discovered with unintended Arabic implications, inadequate attention to cross-cultural meanings in symbols will scuttle interface designs or cause embarrassment to the parent corporation.

USABILITY: EVALUATING DESIGN

The ultimate test of usability for an interface design is an assessment of the user experience. An expert review has the advantage of being requested on short notice with rapid turnaround, at any point at either an early or late design stage. Of course, experts may lack the expectation of a novice user or misunderstand the task domain that the interface represents. Usability labs may test a small group of users on a similar task and can generate a report of recommendations. User surveys are familiar, inexpensive, and can contain precise questions. Software can enable the collection of usage patterns and frequency of errors. Commercial software help desks can solicit opinions on usability, and a rich, recent source of opinions is found in electronic discussion groups. Conferences or professional meetings provide a venue for "user group" activities, and usability evaluators can be solicited from such groups. The design, evaluation, and implementation of interactive computing systems for human use is known by the interdisciplinary term human-computer interaction (HCI). HCI combines cognitive psychology, social and organizational psychology, ergonomics, linguistics, artificial intelligence, social sciences, and engineering. The common denominator for these diverse HCI topics is the focus on the human being and user of the computer interface. Rather than allowing systems thinking to dominate the development of the computer interface, HCI brings research focus to the audience and consumer.

IN CONCLUSION

These are my recommendations for bringing a cognitive perspective to your future HTML efforts. Remember, you may not be the person doing the actual HTML markup for your institution, but the following perspective will help you with editorial responsibilities, and your user community will certainly respond to the design improvements present in your "virtual library":

* Visual Biology favors certain color combinations and placement within an interface.

* Cognitive overload accompanies complexity. Keep it simple when possible.

* Sensory memory is short-term

* Well-designed, consistently placed iconic navigation aides help to orient novice users

* Designing with awareness of Gestalt principles of perceptual organization will prevent inadvertent distraction for users.

* Effective displays focus on the peripheral visual system

* Grouping is not in itself an effective design principle

* Mental perception is not essentially based on what is experienced, but on comparison with previous learning.

* A thorough factoring of HCI principles, complemented by formative evaluation, will yield a superior initial design.

COGNITION AND INTERFACE DESIGN TERMINOLOGY

COGNITION: The processes by which we acquire, absorb, and gain knowledge

COGNITIVE PSYCHOLOGY: The study of the nature of human intelligence and how people transform information into knowledge

GESTALT: In a design context, principles that determine how objects are segmented into component parts for perceptual organization and cognitive processing

HUMAN-COMPUTER INTERACTION (HCI): Area of study concerned with design, evaluation and implementation of interactive computing systems for human use

HYPERTEXT: Text that is offered to readers in non-sequential, multiple pathways, producing alternative experiential texts for the same topic

PERCEPTION; The way we selectively sense and become aware of our immediate surroundings

SELECTED WORLD WIDE WEB RESOURCES ON COGNITION AND INTERFACE DESIGN

http://www.columbia.edu/~greenber/beyond-html/

BEN SHNEIDERMAN

Designing Information-Abundant Websites: Issues and Recommendations

http://www.cs.umd.edu/projects/hcil/ijhcs-copy/main.html

STEPHEN W. DRAPER

Interface Styles

http://www.psy.gla.ac.uk/steve/IntStyles.html

JAKOB NIELSEN

useit.com: Usable Information Technology

http://www.useit.com

JOHN P. CHIN, VIRGINIA A. DIEHL, KENT L. NORMAN

Development of a Tool Measuring User Satisfaction of the Human-Computer Interface

http://www.lap.umd.edu/lapfolder/papers/cdn.html

The Lab for Automation Psychology

http://www.lap.umd.edu/

Internet Psychology Library: Visual Perception

http://kahuna.cogsci.uiuc.edu/ipl/vis/level_2_vis.html

Charles J. Greenberg is head of Information Services at Columbia University Health Sciences Library, New York, NY. Greenberg has taught the Beyond HTML: Information Design, Cognition, and the Computer Interface continuing education course for SLA and other professional library groups. He may be reached at [e-mail].