Yale C/AIM Web Style Guide

Contents

Interface Design

Introduction

Basic interface design

Access issues

Navigation

Links & navigation

User-centered design
Graphic user interfaces were designed to give people direct control over their personal computers. Users now expect a level of design sophistication from all graphic interfaces, including Web pages. The goal is to provide for the needs of all of your potential users, adapting Web technology to their expectations, and never requiring the reader to simply conform to an interface that puts unnecessary obstacles in their paths.
This is where your research on the needs and demographics of your target audience is crucial. It's impossible to design for an unknown person whose needs you don't understand. Create sample scenarios with different types of users seeking information from your site. Would an experienced user seeking a specific piece of information be helped or hindered by your home page design? Would a novice be intimidated by a complex text-based menu? Testing your designs and getting feedback from users is the best way to see whether your design ideas are giving users what they want from your site.

Build clear navigation aids
At the current state of web technology most user interactions with Web pages involve navigating hypertext links between documents. The main interface problem in Web sites is the lack of a sense of where you are within the local organization of information. Clear, consistent icons, graphic identity schemes, and graphic or text-based overview and summary screen can give the user confidence that they can find what they are looking for without wasting time.

Diagram of hypertext link between two Web sites.

Users should always be able to easily return to your home page, and to other major navigation points in your local site. These basic links, that should be present on every page of your site, are often graphic buttons that both provide basic navigation links, and help create the graphic identity that signals the user that they are still within your site domain. For example, in the Netscape corporate site this bar of buttons appears at the foot of every page:

Netscape navigation button bar.

Graphic has been reduced from the original size.   www.netscape.com

The button bar is useful (lots of choices in a small space), predictable (it is always there, at the bottom of every page), and provides a consistent graphic identity to every page in the Netscape site.

No dead-end pages
Every Web page should contain at least one link. "Dead-end" pages pages with no links to any other local page in the site are not only a frustration to users, they are often a lost opportunity to bring browsers into other pages in your site.
Web pages often appear with no preamble: readers often make or follow links directly to subsection pages buried deep in the hierarchy of Web sites. Thus they may never see your Home Page or other introductory information in your site. If your subsection pages do not contain links back up the hierarchy, to the home page or to local menus pages, the reader is essentially locked out of access to the rest of your Web site:

Book cover-Psychology of Everyday Things, D. Norman
Diagram of a dead-end (Web page without links).

References

Apple Computer, Inc. 1992. Macintosh human interface guidelines. Reading, MA: Addison-Wesley.

Mullet, K., and D. Sano. 1995. Designing visual interfaces. Englewood Cliffs, NJ: SunSoft Press-Prentice Hall.

Netscape Home Page

Norman, D. A. 1988. The psychology of everday things. New York: Basic Books.
Copyright 1997 P. Lynch and S. Horton,
   all rights reserved. Yale University   Revised January 1997.