Part I: Foundations of Web Site Design

Chapter 1: Customer-Centered Web Design: More Than a Good Idea

Books, Research Papers, and News Articles

Beyer, H., and K. Holtzblatt. (1998)
Contextual Design: Defining Customer-Centered Systems.
San Francisco: Kaufmann.
Beyer and Holtzblatt have written a fantastic book on their process for customer-centered design. As this philosophical and practical guide explains, their process is centered on gaining a deep understanding of customer needs by interviewing people about the way they work, how their organization works, and other constraints. The ideas they present can be used most effectively in the Discovery phase of the Web site development process, when you’re trying to understand who your target audience is and what they want.

Bias, R., and D. Mayhew. (1994)
Cost-Justifying Usability.
San Diego, CA: Academic Press.
This book is a collection of essays that describe various methods and techniques for quantitatively showing how usability affects the bottom line.

Dembeck, C. (2000, January 11)
Report: B2B Web sites fail usage test.
E-Commerce Times (www.ecommercetimes.com/perl/story/2183.html).
In this news article on a Forrester Report, Why Web Sites Fail, one of the results described is that when customers have a bad experience on a Web site, they tell an average of ten other people.

Moore, G. (1999)
Crossing the Chasm: Marketing and Selling High-Tech Products to Mainstream Customers (rev. ed.). New York: HarperBusiness.
The author describes how high-tech products sell well initially, mainly to a technically literate customer base, but then hit a lull as marketing professionals try to cross the chasm to mainstream buyers. Crossing the Chasm was a milestone in high-tech marketing when it was first released in 1991.

NetRaker Corporation. (2000, September 7)
NetRaker’s eShopping Study Reveals the Web Site Drivers of Success with Visitors [press release] (www.netraker.com/nrinfo/company/20000907.asp).
This study looked at the factors driving repeat visits and purchases at online shopping sites. It found that although a few Web sites offer a great customer experience, there is still plenty of room for improvement. In a comparison study between Yahoo! Shopping, Amazon.com, and AOL Shopping, none of these firms scored over an 8.02 on a scale of 0 to 10 when rated by consumers.The lowest score was below 6.5. By comparison, when leaders in offline industries are evaluated on the key components that drive repeat visits and satisfaction, we see scores typically in the high 8s and low 9s.

Tedeschi, B. (1999, August 30)
Good Web site design can lead to healthy sales.
New York Times E-Commerce Report (www.nytimes.com/library/tech/99/08/cyber/commerce/30commerce.html).
This article reports on IBM’s efforts to redesign its Web site and on how sales increased after overall usability was improved. It emphasizes how improvements in Web site design can boost the bottom line. It looks at issues like having a unified information architecture, page templates to help enforce consistency across large Web sites, and short process funnels to help customers quickly finish tasks.

Web Sites

Boxes and Arrows (www.boxesandarrows.com).
Boxes and Arrows is a Web site devoted to the practice, innovation, and discussion of design; including graphic design, interaction design, information architecture and even business design. The site features articles from practitioners, as well as message boards for fostering thoughtful discussion of issues.

Creative Good (http://creativegood.com) and Good Experience (www.goodexperience.com).
Creative Good is a strategy firm that helps clients focus on the customer experience. Good Experience is a Web log by Mark Hurst, the founder and president of Creative Good. He provides insights about what’s right and what’s wrong with the Web experience today, as well as an occasional tidbit about technology related issues. The site is updated fairly often, but you may find it more useful
to get the weekly e-mail updates instead.

useit.com: Jakob Nielsen’s Web site (www.useit.com).
Jakob Nielsen is one of the best-known Web personalities today, for his hardline stance in favor of usability. Useit.com is his Web site, where he publishes Alertbox, a biweekly newsletter on Web-related usability issues.

Chapter 2: Making the Most of Web Design Patterns

Books, Research Papers, and News Articles

Adkisson, H. (2003, October 13)
Examining the Role of De Facto Standards on the Web
(www.boxesandarrows.com/view/examining_the_role_of_de_facto_standards_on_the_web).
This article describes the results of a study demonstrating that people already expect certain kinds of design patterns on Web pages’ for example, clickable logos to go to the homepage and the shopping cart. (See also the Web Design Practices entry under Web Sites’ below.)

Alexander, C., S. Ishikawa, and M. Silverstein. (1977)
A Pattern Language: Towns, Buildings, Construction. New York: Oxford University Press.
This book originally introduced the idea of patterns in the field of architecture. Alexander has inspired many, including the authors of the book you have in hand, with his idea that patterns could be an effective way of doing design, and a way that customers could express their needs and desires.

Bernard, M. (2002)
Examining user expectations for the location of common e-commerce web objects. Usability News 4(1) (http://psychology.wichita.edu/ surl/usabilitynews/41/web_object-ecom.htm).
This study asked hundreds of people where they would look for a shopping cart, login button, help button, and other e-commerce related buttons. The results indicate where people most often look to find these features.

Fry, J. (2001, August 13)
Web shoppers’ loyalty isn’t so crazy after all. Wall Street Journal
(http://ebusiness.mit.edu/news/WSJ_Story8-13-01.html).
This article looks at a phenomenon known as cognitive lock-in, in which people find things that are familiar more attractive. One result is that people tend not to shop around as much as economists expect, sticking to retailers they already know, because the time to learn a new interface might not be worth the money that might be saved at a competitor’s site.

Gamma, E., R. Helm, R. Johnson, and J. Vlissides. (1995)
Design Patterns. Reading, MA: Addison-Wesley.
This book brought the concept of patterns to software design and programming.

Malone, E., Leacock, M., and Wheeler, C. (2005, April 29)
Implementing a Pattern Library in the Real World: A Yahoo! Case Study (www.boxesandarrows.com/view/ implementing_a_pattern_library_in_the_real_world_a_yahoo_case_study).
This article describes a case study of how Yahoo! developed and managed its pattern library.

Web Sites

Erickson, T.
The Interaction Design Patterns Page (www.visi.com/~snowfall/ InteractionPatterns.html).
This Web site contains resources on pattern languages for interaction design, including pointers to other pattern Web sites and patterns for user interface design.

Tidwell, J. (1999)
Designing Interfaces: Patterns for Effective Interaction Design
(http://designinginterfaces.com).
This companion Web site to a book on design patterns features about 60 user interface design patterns, running the gamut from content design to navigation to attractiveness.

UW E-Business Consortium Best Practice Reports: B2C Web site Design Standard Practices and Benchmarks (www.uwebc.org/opinionpapers/ue).
This Web site presents the results of an analysis of 19 e-commerce Web sites, comparing how basic design elements such as the HOMEPAGE PORTAL (C1), SEARCH ACTION MODULE (J1), SHOPPING CART (F3), and CLEAN PRODUCT DETAILS (F2) page are done.

Web Design Practices (www.webdesignpractices.com).
This Web site presents an analysis of common Web design practices for navigation and e-commerce, describing how various Web sites use specific design elements, such as SHOPPING CARTS (F3), LOCATION BREAD CRUMBS (K6), and OBVIOUS LINKS (K10). (See also the article by Heidi Adkisson under Books, Research Papers, and News Articles above.)

WebPatterns (http://webpatterns.org).
In its own words, WebPatterns is a place to discuss, document and collaboration patterns for web design and development. The site features both a blog and a wiki for discussing new developments in user interface design patterns.

Welie, M. van.
Web Design Patterns (www.welie.com/patterns).
This Web page lists about 70 patterns for Web design, focusing on navigation, searching, page elements, and e-commerce.

Yahoo! Developer Network.
Design Pattern Library (http://developer.yahoo.com/ypatterns) and Yahoo! User Interface Library (http://developer.yahoo.com/yui).
Yahoo! provides a design pattern library, as well as some user interface widgets that will facilitate the construction of high-quality Web sites. Note that the pattern library deals primarily with low-level interaction techniques like menus and transitions, rather than higher-level patterns like the ones in this book.

Chapter 3: Knowing Your Customers: Principles and Techniques

Books, Research Papers, and News Articles

Beyer, H., and K. Holtzblatt. (1998)
Contextual Design: Defining Customer-Centered Systems. San Francisco: Kaufmann.
See the description under Chapter 1 (Customer-Centered Web Design: More
Than a Good Idea).

Cooper, A. (1999)
The Inmates Are Running the Asylum: Why High-Tech Products Drive Us Crazy and How to Restore the Sanity.
Indianapolis, IN: Sams.
This book introduces some of the problems with developing user interfaces. Told in narrative form, it also presents techniques to apply for improving the state of the art. In addition, it describes how to create personas, hypothetical and detailed descriptions of typical customers, and explains why personas are a useful way of thinking about design. (However, we would argue that personas should be based on interviews and observations of real people instead of being made up.)

Lewis, C., and J. Rieman. (1994)
Task-Centered User Interface Design: A Practical
Introduction (http://hcibib.org/tcuid).
This shareware book on user interface design has some great material on learning about your customers tasks. Our Web-based banking example is
based on Lewis and Rieman’s telephone banking example.

Norman, D. (1988)
The Psychology of Everyday Things. New York: Basic Books.
This book is an eye-opener, and it should be one of the first books you read to learn about design. Norman points out the importance of design and how it affects our everyday lives. You will never look at doorknobs or oven stoves in the same way again. (Also published as The Design of Everyday Things.)

Palen, L. (1999)
Social, individual and technological issues for groupware calendar systems.
CHI 1999, ACM Conference on Human Factors in Computing Systems.
CHI Letters, 2(1): 1724 (http://doi.acm.org/10.1145/302979.302982).
This study examines calendar systems used by groups, finding that current
practices have influenced calendaring habits and technology adoption decisions.
(This resource requires access to the ACM Digital Library, at www.acm.org/dl.)

Rubinstein, R., and H. Hersh. (1984)
The Human Factor: Designing Computer Systems for People.
Bedford, MA: Digital Press.
This early UI design text includes the list of questions we ask when performing a task analysis.

Saffo, P. (1996)
The consumer spectrum. In Bringing Design to Software, T. Winograd, J. Bennett, L. De Young, and B. Hartfield (Eds.), pp. 8799. Reading, MA: Addison-Wesley.
This chapter in Winograd’s influential book discusses the fact that consumers’ willingness to put up with technology products is measured both by how expensive the technology is and by how much complexity they have to deal with to get the benefits of the product.

Shneiderman, B. (1997) Designing the User Interface: Strategies for Effective Human Computer Interaction (3rd ed.).
Reading, MA: Addison-Wesley.
This textbook is an overview of academic research in the field of human computer interaction, and it is a great book about the field in general. In addition, the book’s Web site, at www.awl.com/DTUI, has many lecture notes and overviews, as well as extensive lists of links.

Software
National Institute of Standards and Technology (NIST).
Web Category Analysis Tool (WebCAT) (http://zing.ncsl.nist.gov/WebTools/WebCAT/overview.html).
The Web Category Analysis Tool (WebCAT) is a free tool that helps designers set up, run, and analyze card-sorting experiments.

Chapter 4: Involving Customers with Iterative Design

Books, Research Papers, and News Articles

Beyer, H., and K. Holtzblatt. (1998)
Contextual Design: Defining Customer-Centered Systems. San Francisco: Kaufmann.
See the description under Chapter 1 (Customer-Centered Web Design: More Than a Good Idea).

Kelley, T. (2001)
The Art of Innovation: Lessons in Creativity from IDEO, America’s Leading Design Firm. New York: Currency/Doubleday.
Skim through the first few chapters, but pay attention when Kelley gets to brainstorming. He describes how the design teams at his company, IDEO, combine their observations of how customers really do things with an extremely creative brainstorming process to create innovative, award-winning products.

McConnell, S. (1996)
Rapid Development: Taming Wild Software Schedules. Redmond,
WA: Microsoft Press.
McConnell has a chapter about user interface prototyping in his manual for managing the software development process. Although he focuses entirely on software-based prototypes, he lists many of the same advantages of prototyping that we describe in this book, including reduced risk, smaller systems, less complex systems, reduction in creeping requirements, and improved schedule visibility.

Mullet, K., and D. Sano. (1994)
Designing Visual Interfaces: Communication Oriented Techniques. Englewood Cliffs, NJ: SunSoft Press.
Although this book came out before the Web took off, the information on how to create effective visual interfaces is still valuable. This book is handy in the Refinement and Production phases of the Web site development process, as you build polished and high-fidelity mock-ups of your site.

Nielsen, J. (No date)
How to Conduct a Heuristic Evaluation (www.useit.com/papers/heuristic/heuristic_evaluation.html).
This tutorial explains a fast and relatively inexpensive method of finding potential usability errors by employing a checklist of usability heuristics.

Nielsen, J. (1993)
Usability Engineering. Boston: Academic Press.
This book is great for developing products with usability as the key goal. Issues such as prototyping, iterative design, heuristic evaluation, and usability testing are discussed.

Rettig, M. (1994)
Prototyping for tiny fingers. Communications of the ACM, 37(4): 2127 (www.acm.org/pubs/citations/journals/cacm/1994-37-4/p21-rettig).
This is a great article on the motivation behind low-fidelity prototypes, how to make a low-fidelity prototype, and how to run informal usability tests. (This resource requires access to the ACM Digital Library, at www.acm.org/dl.)

Shneiderman, B. (1997)
Designing the User Interface: Strategies for Effective Human Computer Interaction (3rd ed.). Reading, MA: Addison-Wesley.
See the description under Chapter 3 (Knowing Your Customers: Principles and Techniques).

Snyder, C. (2003)
Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces, San Diego, CA: Kaufmann.
This is a primer on using paper prototypes not only to design, but also to test and iterate on designs.

Tufte, E. (1983)
The Visual Display of Quantitative Information. Cheshire, CT: Graphics Press.
Tufte’s book is a classic on presenting complex information graphically, stressing simplicity, elegance, and efficiency.

Winograd, T., J. Bennett, L. De Young, and B. Hartfield (Eds.). (1996)
Bringing Design to Software. Reading, MA: Addison-Wesley.
This collection of essays takes a broad look at interaction design as a profession.Issues such as the design process, prototyping, art, and people are discussed.

Software

DUB, University of Washington.
DENIM (http://dub.washington.edu/projects/denim).
Developed by two of the authors of the book you have in hand, DENIM is a sketch-based design tool for quickly prototyping Web sites.
Chapter 5: Processes for Developing Customer-Centered Sites

Books, Research Papers, and News Articles

Brinck, T., D. Gergle, and S. Wood. (2002)
Usability for the Web: Designing Web Sites That Work. San Francisco: Kaufmann.
This book covers a spectrum of topics, including project management, user needs analysis, information architecture, page layout, writing for the Web,
visual design, and usability.

McConnell, S. (1996)
Rapid Development: Taming Wild Software Schedules. Redmond, WA: Microsoft Press.
This book is really about software development, not Web site development. However, it is an excellent resource on project management, and it is full of best practices, common mistakes, and lessons about planning, scheduling, designing, and creating software. If you’re interested in the Discovery and Implementation phases of the Web site development process, this is the book for you.

Newman, M. W., and J. A. Landay. (2000, August)
Sitemaps, storyboards, and specifications: A sketch of web site design practice as manifested through artifacts. In Proceedings of ACM Conference on Designing Interactive Systems, pp. 263274. New
York (http://guir.berkeley.edu/projects/denim/pubs/iwd-dis-2000.pdf).
This paper reports on our interviews with Web designers, leading to valuable conclusions about the Web design process, the artifacts, and the deliverables.

Publisher

Putting Patterns into Practice Easily

RESOURCES FROM THE BOOK

GLOSSARY

Frequently used tech talk defined, terminology, acronymns.