HCI techniques and wisdom
-- sidebar to Lecture notes on use-oriented web design
The human-computer interaction (HCI) community has largely approached web design from a usability perspective. The assumption is typically that the user is searching for information in order to satisfy a goal: fill an information need, accomplish an action.
Within that perspective, an impressive collection of knowledge, advice and working methods is available. This is a brief overview with some pointers for further elaborations.
Jared Spool and his colleagues at User Interface Engineering performed a major study of web site usability in 1996. They studied nine sites with a large number of test users who were asked to perform information tasks of four types: finding simple facts, comparing facts, making single judgments, and comparing judgments of several entities.A brief summary of their results is that
The design of text links is vital. In particular, the user must be able to predict where the link will take her.
Navigation and content are inseparable. In other words, generic navigation labels don't work as well as specific, informative ones.
Information finding is a focused task, where anything superfluous is seen as a distraction.
User preference does not correlate with their performance. In other kinds of software, there is typically a strong correlation.
See Spool et al. (1996) Web site usability: A designer's guide for more on their study.
Studies by Jakob Nielsen and colleagues have shown that web users scan rather than read web pages. More specifically, one study showed that 79% of the test users scanned whereas only 16% read the pages word by word.
|Rules of thumb||
Much common wisdom concerning web design for usability is packaged in design guidelines, or rules of thumb. A representative example is the CID97 web design rules from the Royal Institute of Technology, Stockholm. The rules are structured in three areas.
Content: Identify purpose and target audience of the site. Analyze how the site will be used. Design appropriate information structures.
User interface: Provide the users with an overview and logical navigation devices. Use informative link labels. Anticipate what the user is looking for and help her find it. Be consistent.
Graphic design: Use color and animations sparingly. Combine consistency and variation. Ensure text legibility.
|Methods and techniques||
A plethora of methods for web site analysis, design and evaluation have been proposed. Most of them are variations of well-known HCI methods and share the overall focus on information tasks and usability.
Rosenfeld and Morville (Information architecture for the world wide web, 1998) is a workable guide on designing appropriate information structures. One of their most useful suggestions is to focus initial meetings with clients on good and bad existing examples of web design. Unlike most bespoke software development, the clients are likely to have seen many examples of sites similar in purpose or style to the one they are commissioning.
User and task analysis is generally harder for web design than for other types of software. Common advice is to identify the primary audience and concentrate on their tasks. This makes it possible to use interviews, information usage studies, field studies and the rest.
The core of HCI methodology is in evaluation. Jakob Nielsen is particularly active in adapting usability evaluation methods for the web.
Usability inspection refers to methods where experts and/or theory are used to predict usability problems. The best known method is heuristic evaluation, where ten general guidelines are used to structure a a number of expert reviews of a proposed design.
Usability testing methods involve users performing tasks using the proposed design. Most testing concerns the users' performance. In a usability test, it is possible to collect numeric values on, e.g.,
how large proportion of users succeed on a task;
These values are called usability metrics. They can be very useful if it is important to be able to quantify results of usability studies and redesigns.