Principles of Web Usability I - Summer 2006
- 1. Principles of Usability II Strategy and Design for Web Sites Present by Patrick Bieser Sr., President Northwoods Software Who am I? • Created hundreds of web sites • Search logs and web site statistics • Usability studies • Usability books • Made mistakes • Studied best / most successful sites • Mom and Dad are web users • User (just like you) October 16, 2006 1
- 2. Summary of Today’s Presentation • Lots of little things • McDonalds • Examples • User behaviors • More examples • Usability testing • Fixes cost 75% less before launch • No “right” way. It depends. October 16, 2006 If your web site is too hard to use… people won’t use it. October 16, 2006 2
- 3. 3
- 4. 4
- 5. 5
- 6. Amazon’s Three Things 1. Powerful Search 2. Exhaustive Information - Cleanly Presented 3. Simple Conversion October 16, 2006 6
- 7. Craig’s List – Three Things 1. Instant ‘Get it’ thru Simple design 2. Navigation as Content - Scanable 3. Simple Conversion October 16, 2006 7
- 8. 8
- 9. Airlines Formula 1. Good Usability… 2. Leads to Conversions… 3. Sell More, Save $$ October 16, 2006 Users • Scan - they’re in a hurry • Are goal-oriented • Get frustrated easily • Dislike choices that require thinking • Are easily disoriented October 16, 2006 9
- 10. Aoccdrnig to a rscheearch at Cmabrigde Uinervtisy, it deosn't mttaer in waht oredr the ltteers in a wrod are, the olny iprmoatnt tihng is taht the frist and lsat ltteer be at the rghit pclae. Tihs is bcuseae the huamn mnid deos not raed ervey lteter by istlef, but the wrod as a wlohe. 10
- 11. 11
- 12. Low home page entrance Low home page entrance Large Trailing Tail Large Trailing Tail First 5 Seconds • Use Search / Key Application (50%) • Scan the navigation / home page (30%) • Mixed strategies (site map, etc.) (20%) October 16, 2006 12
- 13. 13
- 14. 14
- 15. Writing for the Web • Write to be scanned • One thought per paragraph – especially on home page • Cut your words in half then cut again • Use graphic accents to draw attention – Not to show off your graphic skill • “Flytrap” your content October 16, 2006 15
- 16. Web Page Tips • No marketing lingo or brands in navigation • No “happy talk” or instructions • Show – don’t tell! October 16, 2006 16
- 17. 17
- 18. Home Page - I • Don’t make content look like an Ad • Skip “Welcome!” messages • Magic 7 • Group Corporate stuff – about us, stock price, contact us, jobs, etc. • Group Utilities – search, site map, login, etc. • Graphics: less is more – 5% - 15% October 16, 2006 Home Page - II • Avoid navigation redundancy – waste of space • Use conventions of popular sites – search – site map – breadcrumbs – logo click takes you to Home Page October 16, 2006 18
- 19. 19
- 20. 20
- 21. 21
- 22. 22
- 23. So What? Lessons learned apply to your website • Substance 98% trumps Sizzle 2% • Content 80% trumps Brand 20% • Conventions 75% trump Creative 25% • Simplicity is King • A focus on usability is the single largest factor common among successful websites. • Lemmings…. October 16, 2006 Stereotypes of Key Influencers Web Designers • Are not normal • They are power users • Don’t think / behave like our audiences • Went to school to learn: visual design, branding and marketing for print, TV, radio. • Not taught about the web (it’s a technical thing) • Paid to be creative and clever, not to follow conventions October 16, 2006 23
- 24. Stereotypes of Key Influencers Directors / Executives • Don’t always “get” the web • Want more “Sizzle” • Listen to well meaning people they trust (who may not “get” the web) • Need to be patiently educated by credible sources October 16, 2006 Stereotypes of Key Influencers IT Professionals • See the web as a technology • Don’t get all this “branding” and “usability” stuff • Make decisions based on tools, certifications, and integration needs • Need to have their web sensitivity patiently increased by credible sources October 16, 2006 24
- 25. Stereotypes of Key Influencers Marketing Types • Put too much emphasis on look and feel • See the web as an extension of their branding initiatives • Assume print and web are mostly the same • Need to read ‘Don’t Make Me Think’ October 16, 2006 The Differences The purpose of non-web marketing • Grab eyeballs • Create an impression • Build brand awareness • Drive conversions (i.e. go to your website) The purpose of a website • Offer intuitive and useful information, without annoying or confusing your visitor, so they will reach a goal page and convert. The purpose of a web application • Offer intuitive interface for retrieving / entering information that requires minimal training and results in high accuracy. October 16, 2006 25
- 26. Aim for simplicity The truth is…simplicity is hard October 16, 2006 26
- 27. Group Usability Study Can you find… October 16, 2006 October 16, 2006 27
- 28. Usability Methods • Card Sorting: – Group top and second navigation – Name them • Current Site: – Ten tasks – Talk out loud – Tape it • Paper Prototype: – What would you click on? • Look at web / search logs • 80% of 80% October 16, 2006 Usability Testing • Informal • Low cost and effective • As few as 3-5 users October 16, 2006 28
- 29. Top Eight User Complaints • Flash (the bad kind) • Font is too small • Non-standard links • Content Not Written for the Web • Bad Search Results • Browser Incompatibility • No Contact / Company Info • Inadequate Photo Enlargement October 16, 2006 29
- 30. 30
- 31. 31
- 32. “It’s not the number of clicks... it’s how hard each click is!” - Steve Krug October 16, 2006 32