by Aimée Truchard, editor, and Raïssa Katz-Haas, content author.
Reprinted from Usability Interface, Vol 5, No. 1, July 1998

Most users don’t really read Web pages. Instead, they scan text for specific pieces of information in a process called information retrieval. With user-centered design (UCD), you can improve the usefulness (relevance) and usability (ease of use) of Web sites by considering information retrieval and other factors.

• Who are the users of this Web site?
• What are the tasks and goals of these users?
• What experience levels do the users have with
• Computers?
• The Web?
• This interface and interfaces like it?
• The domain (subject matter)?
• What are the users’ working or Web-surfing environments?
• What hardware, software, and browsers do the users have?
• How can the design of this interface facilitate users’ cognitive processes? How do the users discover and correct errors?
• What are the users’ preferred learning styles? How much training, if any, will the users receive?
• What relevant knowledge and skills do the users already possess?
• What functions do the users need from this interface? How do they currently perform these tasks? Why do the users currently perform these tasks the way they do?
• What information might the users need and in what form do they need it?
• What do users expect from this Web site? How do users expect this interface will work?

After answering these questions, you can begin developing, designing, and testing your Web site. In UCD, your development cycle includes stages for both usability design and testing. Be sure to get user feedback throughout development and don’t settle on a final direction or design too soon. Usability testing is the only way you can know if your particular site meets these users’ needs.

In a paper discussing UCD and Web development, Raïssa Katz-Haas offers the following ten guidelines for Web-page design (Katz-Haas, 1998).

1. Visibility—Make important elements such as navigational aids highly visible so users can determine at a glance what they can and cannot do. Visibility helps users predict the effects of their actions.

2. Memory Load—Make screen elements meaningful and consistent across the site to reduce memory load. In this way, users don’t have to remember what the elements mean from one page to another. Relate new items and functions to ones the user already knows.

3. Feedback—Provide immediate feedback when a user performs an action. For example, when the user clicks a button, something on the screen should change so the user knows the system has registered the action.

4. Accessibility—Users need to find information quickly and easily:

• Offer users a few ways to find information such navigational elements, search functions, or a site map. However, offer only a few options at a time to avoid confusion.
• Organize information into small, digestible pieces using a schema or hierarchy that is meaningful to the user.
• Make it easy for users to skim; provide clues that allow users to find the information by scanning rather than reading.

5. Orientation/Navigation—Help users orient themselves by providing the following navigational clues:

• Descriptive links
• A site map
• Obvious ways to exit every page
• Clearly visible elements on each page that inform users where they are in relation to other pages and how to navigate to other pages

Use frames sparingly, if at all. Frames confuse many users because the Back button, printing, and bookmark functions do not work like they do on non-frames pages. Approximately 60% of Web users employ the Back button as their primary means of navigation. Usability issues surface when the Back button doesn't work the way they expect.

6. Errors—Minimize user errors by avoiding situations in which users are likely to make mistakes. Also try to accommodate incorrect actions by users so they can recover quickly. For example, if you anticipate that users might look for certain information on one Web page that actually appears on another, you can include descriptive links to the page they need.

7. Satisfaction—Make your site pleasant to use and view. Users’ satisfaction with the interface influences their

• Perception of ease-of-use.
• Motivation for learning how to use the site.
• Confidence in the reliability of the information in the site.

8. Legibility—Make text easy to read. When developing online documentation, use

• Sans serif fonts rather than serif fonts, especially in body text.
• Non-ornamental fonts.
• Roman characters rather than italic.
• Medium-sized fonts—9 to 11 points for sans serif fonts and 11 to 12 points for serif fonts often work well for body text.
• Mixed case for text rather than all capital letters.
• Line lengths less than 50 to 60 characters long to facilitate scanning.
• High contrast between text and background colors to increase legibility. Dark text against a light background is most legible.

9. Language—You can improve usability by incorporating the following stylistic elements:

• Concise language
• Everyday words instead of jargon or technical terms
• Active voice and active verbs
• Verbs instead of noun strings or nominalizations
• Simple sentence structure

Because the Internet crosses cultural and national boundaries, be careful with ambiguity. The following stylistic elements can be misinterpreted easily:

• Humor (Humor does not translate well across cultures. At best, it is not understood; at worst, it can offend.)
• Metaphors
• Icons
• Idioms
• Puns

10. Visual Design—The aesthetics of your interface play an important role in communicating information and tone to your users effectively. As you develop your site, consider the following visual design strategies:

• Create pages that are interesting yet simple and uncluttered.
• Use graphics to illustrate and inform, increase the user’s satisfaction and motivation, and aid navigation. Avoid using graphics that only serve as decoration.
• Use graphics that are small in file size so they download quickly.
• Make the most important elements the most visually prominent.
• Treat text as a graphic element.
• Make preliminary page layouts using a grid.
• Group related elements close to each other so users can associate the elements just by looking at the placement.
• Use white space to visually organize the page, to emphasize important elements, and to give users’ eyes some resting space.
• Use invisible table lines (white space) instead of visible lines.
  If you must use lines, use light and thin ones.
• Use color conservatively. Although color can engage users, it can distract them unnecessarily or be misinterpreted. Also keep in mind that some users have equipment that only supports monochrome. Try your design in monochrome first, then add a few colors.

Additional References

SIG Home | About the SIG | SIG Activities | Resources | Topics Newsletter |  Conference |  Bookshelf  | Toolkit  Comments or questions? Please send your email to <stcusability at sufficiently.com> © 1998-2004, Society for Technical Communication