Table of Contents
Introduction.
Goals and Objectives. Why I Wrote Making the Web Work. Who You Are.
What You Will Find. What You Will Not Find. Conventions Used in
This Book. Terminology. Examples. Onward.
I. FOUNDATIONS.
1. Common Ground: Defining Web Applications and Establishing the
Goals of Design.
Defining Web Applications. Web Applications: The Good, The Bad, and
The Unfortunate. Bringing Design to Software. Marketing and
Engineering: What Can We Sell? What Can We Build? 34. Design: What
Do Users Want? 37. Summary.
2. Putting the User First: Describing
Target Users and Product Goals.
Anchoring Design: The Core Values of Control and Satisfaction. Core
Value: Control. Core Value: Satisfaction. Bounding the Problem:
Creating a Comprehensive Product Vision. The Opportunity Statement:
Outlining the Business Opportunity. Persona Bios and Goals: Making
“Users” Real. The Concept Statement: Describing the Products
Essence 65. Summary.
3. Deconstructing the Problem: Prioritizing
and Categorizing Different Aspects of an Interface.
Deconstructing Cinema: Looking at Movies from the Ground Up.
Deconstructing an Interface: Designing from the Conceptual to the
Concrete. Tier 1: Structure. Tier 2: Behavior. Tier 3:
Presentation. Living with a Model: What the Model Implies About
Design Priorities, Resources, and Feedback. Summary.
II. TIER 1: STRUCTURE.
4. The Conceptual Model: Selecting a Fundamental Motif.
First Things First: The Importance of a Conceptual Model. Building
on the Vision: Identifying and Selecting an Appropriate Conceptual
Model. Putting Conceptual Models to Work: Whats in a Store? What
Defines a Store? What Defines a Catalog? What Defines
BananaRepublic.com? Summary.
5. The Structural Model:
Understanding the Building Blocks of a Web Interface.
Pages: Building Blocks of the Web. Views: Pages for Viewing and
Navigating. Forms: Pages for Editing and Manipulating. The
View/Form Construc t. Constructing Workflows Using Views and Forms.
Hubs: You Go, You Come Back. Wizards: Step 1, Step 2, Step 3.
Guides: The Hub/Wizard Hybrid. Summary.
6. The Organizational
Model: Organizing and Structuring Content and
Functionality.
Deconstructing Organizational Models. Classification Schemes.
Objective Classification Schemes. Subjective Classification
Schemes. Evaluating Classification Schemes. Models of Association.
Indexes. Hierarchies. Webs. Case Study: The Organizational Model(s)
of eBay. Summary.
III. TIER 2: BEHAVIOR.
7. Viewing and Navigation: Creating Consistent Sorting,
Filtering, and Navigation Behaviors.
Navigation. Navigation: Whats It Good For? Deconstructing
Navigation. High-Level Navigation Mechanisms. Low-Level Navigation.
Selecting Objects and Issuing Commands. Shared Controls. Dedicated
Controls. Viewing Lists of Data. Changing Column Sets. Paging.
Sorting. Filtering. Searching. Summary.
8. Editing and
Manipulation: Using HTML Input Controls to Accurately Capture Users
Data.
Designing Forms: Thinking in Terms of the Whole. Pace
Appropriately. Limit Navigation. Indicate Status and Progress.
Support Intelligent Flow and Keyboard Navigation. Provide Multiple
Clues. Make Choices Visible. Input Controls: Picking the Right Tool
for the Job. Check Boxes. Radio Buttons. List Boxes. Menus. Text
Boxes. Buttons. Common Interaction Problems and Solutions. Picking
a Single Item from a List. Selecting Dates. Summary.
9. User
Assistance: Communicating with Users Through Help, Status, and
Alerts.
Help. Types of Help. Designing Helpful Help. Alerts. Error Alerts.
Status Alerts. Confirmation Alerts. Summary.
IV. TIER 3: PRESENTATION.
10. Layout: Positioning Elements to Maximize Understanding and
Readability.
Design Value: Simplicity. Clarity: Simple, Direct Expression.
Reduction: Arriving at Essential Elements and Forms. Leverage:
Using a Single Element for Multiple Roles. Design Value:
Consistency. Consistency with the Web: Conventions. Consistency in
Placement and Visual Flow: Templates and Grids. Consistency in
Visual Detail: Standards and Guidelines. Design Value: Order.
Placing Like Elements Together: Grouping. Visually Ranking Elements
by Importance: Hierarchy. Supporting Visual Flow: Alignment.
Putting It All Together. Summary.
11. Style: Defining Visual
Appearance.
Evaluating Style. Individuality. Brand Consistency. Appropriateness
for the Audience and Function. Preventing Style from Messing Other
Things Up. Working Within the Medium. Legibility. Providing Visual
Cues to Behavior. Summary.
12. Text and Labels: Writing for the
Web and Calling Things by Their Right Names.
Eliminate Superfluous Text. Text: Whats It Good For? Navigation.
Titles. Labels. Instructions and Help. Marketing Messages. Writing
for the Web. Be Courteous, Not Patronizing. Leverage the Context.
Dont Repeat Yourself. Avoid Multisyllabic Words That Obfuscate.
Summary.
V. CASE STUDIES.
13. Amazon.com: Browsing the Aisles of the Webs Supreme
Retailer.
Tier I: Structure. Layer 1: Conceptual Model. Layer 2: Structural
Model. Layer 3: Organizational Model. Tier II: Behavior. Layer 4:
Viewing and Navigation. Layer 5: Editing and Manipulation. Layer 6:
User Assistance. Tier III: Presentation. Layer 7: Layout. Layer 8:
Style. Layer 9: Text. Summary.
14. Ofoto: Looking at the Leading
Online Photo Processor.
Tier I: Structure. Layer 1: Conceptual Model. Layer 2: Structural
Model. Layer 3: Organizational Model. Tier II: Behavior. Layer 4:
Viewing and Navigation. Layer 5: Editing and Manipulation. Layer 6:
User Assistance. Tier III: Presentation. Layer 7: Layout. Layer 8:
Style. Text. Summary.
Afterword.
Index.Promotional Information
The purpose of Making The Web Work is to provide readers with a
thorough understanding of the issues involved in designing the user
experience for web-based applications. By definition, web-based
applications are those web sites that create and maintain a
one-to-one relationship with users, allowing them to edit and
manipulate data over multiple sessions. The key issues covered are
as follows: definition of web-based applications and the technical
architecture required to create and deliver them, overview of what
roles and responsibilities are typical of an effective design team,
methodology for the design process, and detailed description of
issues involved at each phase and level of design.
About the Author
Bob Baxley is a practicing designer who lives and works
in Silicon Valley. Specializing in interaction design for both Web
applications and services as well as desktop products, Bob has
worked in a variety of corporate and startup environments. He began
his career in 1990 as the designer for ClarisWorks, and later
worked on a variety of projects for Adobe Systems, Apple Computer,
Epiphany, NetObjects, Ameritrade, and others. Currently, Bob runs
the Design and Usability teams at myCFO, a leading wealth
management firm. In 1985, he received a B.A. in History and a B.S.
in Radio/Television/Film from the University of Texas at Austin. He
also received a Masters of Liberal Arts from Stanford University in
2000.