Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Practical Usability Guidelines For Your Website (An Evening Of Web Usability - 7th Feb 2012 - Malta)

2,285 views

Published on

This presentation first introduces website usability and why it is important for anyone who designs, develops or even owns a website. It then provides practical usability guidelines and examples. It concludes with a quick usability evaluation of a website.

Published in: Design, Technology

Practical Usability Guidelines For Your Website (An Evening Of Web Usability - 7th Feb 2012 - Malta)

  1. 1. Practical Usability GuidelinesFor Your WebsiteJustin Mifsud
  2. 2. About MePersonal Justin Mifsud Core expertise: Usability, User Experience (UX), User Interface Design, MarketingEducation Marketing Graduate with the Chartered Institute of Marketing (UK) BSc (Hons) Computing & Information Systems (Goldsmiths, University of London)Occupation Head of Marketing at Holistic Group Usability Blog – www.usabilitygeek.comJustin Mifsud - Practical Usability Guidelines for your Website Page 2
  3. 3. What is Web Site Usability? “The ease with which users learn to use a web site, how efficient they are when using it, how easy it is for them to remember how to use it and how satisfied they are when they use it “ (Nielsen & Loranger, 2006)Justin Mifsud - Practical Usability Guidelines for your Website Page 3
  4. 4. Why is Usability Important for My Site? Users Achieving Goals (Theirs & Company) Inc. Customer Satisfaction, Retention & Loyalty Importance inc. In Competitive Environments 83% Avg. Improvement in KPI after Usability RedesignJustin Mifsud - Practical Usability Guidelines for your Website Page 4
  5. 5. The Benefits are Obvious ….but 90% of all websites ...or approximately 331million websites have poor usability (as at December 2011) 97% of top 100 websites from 20 countries did not achieve Single-A accessibilityJustin Mifsud - Practical Usability Guidelines for your Website Page 5
  6. 6. Luckily for us, we have Guidelines Used for Usability Inspection Methods – to identify usability violations Based on extensive studies from various fields Adherence to usability guidelines effectively improves website usabilityJustin Mifsud - Practical Usability Guidelines for your Website Page 6
  7. 7. What are the Main Usability Problems? 1. Findability (27%) 2. Information (19%) 3. Search (15%) 4. Page Design (7%) Total = 68% of all Usability ProblemsJustin Mifsud - Practical Usability Guidelines for your Website Page 7
  8. 8. 1. Findability How easily users can locate the content they are looking for Information Category Names Architecture Findability Navigation LinksJustin Mifsud - Practical Usability Guidelines for your Website Page 8
  9. 9. 1. Findability violations No Info Scent Mysterious Navigation Clutter Multi-level menusJustin Mifsud - Practical Usability Guidelines for your Website Page 9
  10. 10. 2. Information Text, images and other media presented on your website Product Content Information Information Corporate Prices InformationJustin Mifsud - Practical Usability Guidelines for your Website Page 10
  11. 11. 2. Information ViolationsJustin Mifsud - Practical Usability Guidelines for your Website Page 11
  12. 12. 3. Search18.2 billion monthly searches using Search Engines in the U.S. alone Users expect your search interface to look like and = behave like that of major Search Engines!Justin Mifsud - Practical Usability Guidelines for your Website Page 12
  13. 13. 3. Search Usability Guidelines Textbox & Button Search Site but Not Top Right Outside Hand Corner Button Must Present on be Called Search All Pages Search Textbox Must Be Not a Search Empty Link 20 Char TextboxJustin Mifsud - Practical Usability Guidelines for your Website Page 13
  14. 14. 3. SearchGOOD BADJustin Mifsud - Practical Usability Guidelines for your Website Page 14
  15. 15. 4. Page DesignThe User ReadabilityInterface (UI) ofyour Website Graphics Layout Page Design Amateur ScrollingJustin Mifsud - Practical Usability Guidelines for your Website Page 15
  16. 16. 4. Page Design GOOD BADJustin Mifsud - Practical Usability Guidelines for your Website Page 16
  17. 17. Even the Big Guns Fail!Justin Mifsud - Practical Usability Guidelines for your Website Page 17
  18. 18. Even the Big Guns Fail!LogoPositioning Justin Mifsud - Practical Usability Guidelines for your Website Page 18
  19. 19. No Search? Even the Big Guns Fail!LogoPositioning Justin Mifsud - Practical Usability Guidelines for your Website Page 19
  20. 20. No Search? Even the Big Guns Fail! Menu DisappearingLogoPositioning Justin Mifsud - Practical Usability Guidelines for your Website Page 20
  21. 21. No Search? Even the Big Guns Fail! Menu DisappearingLogoPositioningPOPUPS !!!Seriously?? Justin Mifsud - Practical Usability Guidelines for your Website Page 21
  22. 22. No Search? Even the Big Guns Fail! Menu Disappearing Logo Positioning POPUPS !!! Seriously??LowContrastText Justin Mifsud - Practical Usability Guidelines for your Website Page 22
  23. 23. No Search? Even the Big Guns Fail! Menu Disappearing Logo Positioning POPUPS !!! Seriously??LowContrast Too muchText importance Justin Mifsud - Practical Usability Guidelines for your Website Page 23
  24. 24. No Search? Even the Big Guns Fail! Menu Disappearing Logo Positioning POPUPS !!! Seriously??LowContrast Too muchText importanceBad convention for links Justin Mifsud - Practical Usability Guidelines for your Website Page 24
  25. 25. No Search? Even the Big Guns Fail! Menu Disappearing Logo Positioning POPUPS !!! Seriously??LowContrast Too muchText importanceBad convention for links Justin Mifsud - Practical Usability Guidelines for your Website Utility Navigation badly placed Page 25
  26. 26. No Search? Even the Big Guns Fail! Menu Disappearing Logo Positioning Too Large POPUPS !!! Seriously??LowContrast Too muchText importanceBad convention for links Justin Mifsud - Practical Usability Guidelines for your Website Utility Navigation badly placed Page 26
  27. 27. No Search? Even the Big Guns Fail! Menu Disappearing Logo Positioning Too Large F L POPUPS !!! A Seriously?? S HLowContrast Too muchText importanceBad convention for links Justin Mifsud - Practical Usability Guidelines for your Website Utility Navigation badly placed Page 27
  28. 28. Even the Big Guns Fail! RESOLUTION 1024 x 768 (14% Still use it!)Justin Mifsud - Practical Usability Guidelines for your Website Page 28
  29. 29. Even the Big Guns Fail! RESOLUTION BROWSER RENDERING 1024 x 768 (14% Still use it!) I’d Rather Avoid This!Justin Mifsud - Practical Usability Guidelines for your Website Page 29
  30. 30. Even the Big Guns Fail! DEVICES iPhone iPadJustin Mifsud - Practical Usability Guidelines for your Website Page 30
  31. 31. Where Do We Go From Here? Books, Blogs, Journals Social Networking Sites – Twitter, LinkedIn Conferences Malta Usability & User Experience GroupJustin Mifsud - Practical Usability Guidelines for your Website Page 31
  32. 32. My Blog - UsabilityGeekJustin Mifsud - Practical Usability Guidelines for your Website Page 32
  33. 33. Thanks For Your Attendance! info@usabilitygeek.com @justinmifsud http://mt.linkedin.com/in/justinmifsud http://usabilitygeek.comJustin Mifsud - Practical Usability Guidelines for your Website Page 33

×