Defensive Design for the Web : How to improve error messages, help, forms, and o
暫譯: 網頁防禦性設計：如何改善錯誤訊息、幫助、表單及其他元素

Description 

Let's admit it: Things will go wrong online. No matter how carefully you design a site, no matter how much testing you do, customers still encounter problems. So how do you handle these inevitable breakdowns? With defensive design. In this book, the experts at 37signals (whose clients include Microsoft, Qwest, Monster.com, and Clear Channel) will show you how.

Defensive design is like defensive driving brought to the Web. The same way drivers must always be on the lookout for slick roads, reckless drivers, and other dangerous scenarios, site builders must constantly search for trouble spots that cause visitors confusion and frustration. Good site defense can make or break the customer experience.

In these pages, you'll see hundreds of real-world examples from companies like Amazon, Google, and Yahoo that show the right (and wrong) ways to get defensive. You'll learn 40 guidelines to prevent errors and rescue customers if a breakdown occurs. You'll also explore how to evaluate your own site's defensive design and improve it over the long term.

This book is a must read for designers, programmers, copywriters, and any other site decision-makers who want to increase usability and customer satisfaction.

Table of Contents

1. Understanding Defensive Design.

Making mistakes well.

Introduction. No One's Perfect. Why "Defensive Design"? Crisis Points. Contingency Design to the Rescue. Success Stories. So What Will This Book Teach Me? What Won't I Learn from This Book? Who Should Read It? How Should I Use This Book? A Brief Introduction to the Guidelines. Be Flexible. One Last Thing: See People, Not Users. Let's Get to It.

2. Show the Problem.

Display obvious error messages and alerts.

Introduction. Guideline 1: Give an error message that's noticeable at a glance. QwestDex: Where's My Error Message? Hilton: But I Just Entered My Login. MotherNature: This Isn't What I Wanted. KB Toys: Obvious Error Notice. Excite: Try Again Error. Guideline 2: Use color, icons, and text to clearly highlight and explain the. problem area. Topica: The Wrong Way. Sony: Wrong Spot. Expedia: The Right Way. Google: Can't-Miss Error Message. Banana Republic: Clear Explanation. Guideline 3: Always identify errors the same way. E*Trade: Inconsistent Error Notification. Priceline: Same Style, Same Place. Guideline 4: Eliminate the need for back-and-forth clicking. EBay: It's Your Problem. Shutterfly: No More Backtracking. United Airlines: Which Airport in Chicago? Head to Head: Ticketmaster vs. Victoria's Secret. Summary.

3. Language Matters.

Provide clear instructions.

Introduction. Guideline 5: Don't use language that might be unfamiliar to your customers. ESPN and USPS: What's That Mean? Network Solutions: What's a TLD? Switchboard: Keep Internal Terms Internal. Typebox: Add to Buybox? University of Chicago: Funky Acronyms Explained. Guideline 6: Keep text brief and easy to understand. Aer Lingus and Fortune: Is There an Echo in Here? Motley Fool: Straightforward Messaging. C2it: Cash or No Cash? Head to Head: Qwest vs. AT&T. UPS: Invalid. Verify Validity. FedEx: Simpler Is Better. Guideline 7: Be polite. Best Deal Magazines: We Warned You. Hallmark: Apologetic Tone. Lands' End: We Owe It All To You. Summary.

4. Bulletproof Forms.

Create friendly forms that are easy to complete.

Introduction. Guideline 8: Highlight either required or optional fields. Victoria's Secret: Turned Off. Washington Post: Marked With *. Guideline 9: Accept entries in all common formats. Nordstrom: No Hyphens or Spaces. KB Toys: It's All Good. AOL: Autoformat. Zagat Survey: They've Got My Number. Guideline 10: Provide sample entries, pull-downs, and formatting hints to. ensure clean data. E*Trade:Which Dates Are Valid? United Airlines: Month Pull-Down. DeepDiscountCD: Improving the Odds. Expedia and E*Trade: MM/DD/YYYY and XXX-XX-XXXX. Yahoo! and Citysearch: Sample Answers. Dell: Boxed In. Guideline 11: Explicitly state limits to characters, number of entries, and. so forth. Yahoo!: Then How Many? CDNow: What's the Limit? Google: 25 Max. Head to Head: Paypal vs. SprintPCS. Guideline 12: If customers can't choose it, don't show it. Google: Then Don't Offer 2003. Ticketmaster: Why Not Tell Me It's Sold Out? Peapod: Only Show Available Times. EasyJet: Easy Picking. Guideline 13: Validate entries (as soon as possible). AOL: New York, Alaska? UPS: Match City and Zip. Motley Fool: Enter a Valid Number. NBA: Invalid Email. ATI: Check Compatibility. Guideline 14: Button up: Eliminate the Reset button and disable the Submit. button after it's clicked. Bank One: Reset Only. FedEx: Asking for Button Trouble. University of Washington:Are You Sure? E*Trade: Click Only Once. Applied Biosystems: Disabling a Button. Guideline 15: Assist form dropouts by saving information. Discover: It's Now or Never. Bank One: Saving for Later. Netflix: Finish Up. Summary.

5. Missing in Action.

Overcome missing pages, images, or plug-ins.

Introduction. Guideline 16: Offer customized "Page Not Found" error pages. Home Depot: Where's the Beef? Apple: Top-Notch 404. Hewlett Packard: Explaining Why It's Not Found. Head to Head:Moviefone vs. IBM. The New York Times: Back to the News. Guildeline 17: Successfully redirect near-miss URLs. Apple: Uppercase vs. Lowercase. Excite: One Too Many. Amazon: One Too Few "W"s. Google: Ooo Yeah. Yahoo!: Photo or Photos? Guideline 18: Use ALT tags for images. J. Crew: No Alternative. Red Envelope: Missing Navigation. Apple:Text Rather Than Images. Guideline 19: Don't shut out visitors with old technology: Offer alternative. versions and technology upgrade information. Warren Center: Simpler Is Better. Versace: Have It Your Way. Connected Earth: Plug-In Breakdown. Sumomusic: Flash Help. Yellow Pencil: It works, but please upgrade. Summary.

6. Lend a Helping Hand.

Offer help that's actually helpful.

Introduction. Guideline 20: Answer questions on the same page they arise. Lands' End: On-the-Spot Help. Wedding Channel:Sanity Savers. Yahoo!: Contextual Help. Amazon: The Shipping News. Guideline 21: Offer an easy-to-use "Help" section and provide clear links to. it. PC Mall: Hidden Help. EBay: Bare-Bones Help. Yahoo! Chat: Help That's Actually Helpful. Orbitz: 4 Ways to Receive Help. Amazon: Need Further Assistance? Guideline 22: Let customers help themselves through online forums and. training sessions. Blogger: Help from Other Customers? EBay and Adobe: Self-Serve Help. Guideline 23: Provide a human fallback plan (help via chat, phone, or email). EBay: Snail-Mail Help? Lands' End: Help That's Convenient for You. 1-800 Flowers and Gap: Help Avenues. Guideline 24: Answer emails quickly and effectively. Gap: Short and Sweet. Dell: "Customer Support, This Is Tarzan". Lands' End: Return Policy Explained. Guideline 25: Help login with tips or email. Lego: What's My Username Again? Pottery Barn: Password Savior. Yahoo!: Give Me a Hint. Apple: Three Strikes and You're Sent an Email. Summary.

7. Get Out of the Way.

Eliminate obstacles to conversion (e.g. unnecessary ads, registration, navigation, etc.)

Introduction. Guideline 26: Don't disable the browser's Back button. Ticketmaster: Back Isn't a Bad Request. EBay: Input (T)error. Expedia: Back = No Problem. Guideline 27: Make it fast, not cute. Star Wars: Episode Ugh. EXPN: Too Cute. Thrifty: Getting to the Point. Comedy Central: Playing It Straight. Guideline 28: Don't force registration. Apple: Don't Make Me Sign In for Help. Sun: Getting to the Point. Guideline 29: Don't block content with ads. About: Owl Blockage. Yahoo!: Cruising for a Bruising. Orbitz: Ad Trumps Error. News: Bannerless. Guideline 30: Eliminate unnecessary navigation during multi-step processes. Pottery Barn: Checkout Distraction. EBay: Stay on Track. Summary.

8. Search and Rescue.

Deliver the right results with smart search engine assistance.

Introduction. Guideline 31: Offer a clear explanation when no results are found or inexact. matches are shown. Pepsi: Less Is Not More. Target: A Mop That Plays MP3s? Spun: No Keyword Matches. Crate & Barrel: Votive Explanation. Head to Head: Marshall Field's vs. Sears. Guideline 32: Anticipate common errors and provide relevant results. IRS: W2 or W-2? Google: Bad Spelling = No Problem. Head to Head: MarketWatch vs. Yahoo! Finance. Amazon: You Know What I Mean. Google: Using Search Logs. Head to Head: Bluelight vs. Wal-Mart. Guideline 33: Too many results? Offer features that let searchers refine and. filter results. Best Buy: I Just Wanted a DVD Player!. L.L. Bean: Give Me the Boot. Amazon: Which Cash? Sears: Sort Options. Citysearch: Have It Your Way. Yahoo!: Narrow My Search. HotJobs: Refine Results. EBay: Get More Specific. Qwest: Suggest Related Documents. CDNow: If You Like This… Head to Head: Foot Locker vs. Finish Line. Amazon: Letting the Customer Decide. Guideline 34: No results? Let customers easily expand search criteria. Marriott: No Quick Fix. EBay: Try These Search Alternatives. News: Expand Your Search. Yahoo!: Need More Results? Guideline 35: Offer tips on how to improve results. Reebok: No Tips. Amazon: Search Examples. AllRecipes: For Better Results… Guideline 36: Don't rely on advanced searches. Musician's Friend: Too Complex. Palm: Pull-down Overload. Chicago Tribune: Basic First, Then Advanced. Summary.

9. Out of Stocks and Unavailable Items.

Make sure unavailable items don't become dead ends.

Introduction. Guideline 37: Be upfront about item unavailability. Baby Ultimate: Don't Tease Like That. Amazon and Tower Records: Stock Notification. Lands' End: Inventory Alert. Guideline 38: If a product will be available at a later date, explain when,. provide product details, and take advance orders. Bookpool: When Will I Get It? CDNow: Expected Release Date. Head to Head: Barnes & Noble vs. Amazon. Guideline 39: Offer email notification. UPS: Can't You Get Back to Me? Kill Rock Stars: Tell Me When This Item Is in Stock. Mother Nature: "We will watch this product…". Guideline 40: Show similar items that are available. Terrific Toy: Less Is Not More. Gap and L.L. Bean:…But These Are Available. Hotmail: Try One of These Instead. Head to Head: Domain Bank vs. Register.com. Summary.

10. The Contingency Design Test.

See how your site rates.

Who Should Perform the Tasks? How Does This Differ from Other Site Usability Tests? Scoring Your Test. The Contingency Design Test. Tally Your Score. See How You Stack Up.

Conclusion.

Contingency Design.

A Long-Term Commitment.

Study Customer Support Inquiries. Solicit Feedback. Analyze Server Log Files. Get Outside Opinions. Put Someone in Charge of Contingency Design. Build a Contingency Design Knowledgebase. Prepare to Fail. Conclusion: One Step at a Time.