1 / 35

The 5 C’s of Web Design

The 5 C’s of Web Design. Craig Duncan Project Manager ReliefWeb www.reliefweb.int United Nations Office for the Coordination of Humanitarian Affairs Email: duncanc@un.org. The 5 C’s of Web Design. Content Continuity Cut to the chase Context Community + USABILITY !.

jolie
Download Presentation

The 5 C’s of Web Design

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. The 5 C’s of Web Design Craig Duncan Project Manager ReliefWeb www.reliefweb.int United Nations Office for the Coordination of Humanitarian Affairs Email: duncanc@un.org

  2. The 5 C’s of Web Design • Content • Continuity • Cut to the chase • Context • Community + USABILITY !

  3. The 5 C’s of Web Design (1) Content • The reason people VISIT websites • Users are TASK ORIENTED • Write FOR the WEB = Scannable • HIGHLIGHT new content

  4. The 5 C’s of Web Design (2) Continuity • Graphics are NOT IMPORTANT • Trust IS • Design for the USER EXPERIENCE

  5. The 5 C’s of Web Design (2)

  6. The 5 C’s of Web Design (3) Cut to the Chase • 3 click rule…BUT – Painless clicks • Make SHORTCUTS to popular content

  7. The 5 C’s of Web Design (4) Context • Avoid POGO-STICKING • Where AM I, and where can I go from here? • Related documents…

  8. The 5 C’s of Web Design (5) Community • Email links on ALL PAGES • Include a Mailing Address and Phone • Put people together

  9. The 5 C’s of Web Design (5) + USABILITY ISO definition: The effectiveness, efficiency, and satisfaction with which specified users achieve specified goals in particular environments

  10. The 5 C’s of Web Design (+) + USABILITY Heuristic Evaluations • Jacob Nielsen’s 113 guidelines for Home Page Usability • Information Architecture review

  11. The 5 C’s of Web Design (+) + USABILITY Usability Testing • Yes, with real people ! • Because YOU ARE NOT THE USER

  12. The 5 C’s of Web Design (+) Don Norman

  13. The 5 C’s of Web Design (+) + USABILITY Usability Testing • Solves arguments – Amazon.com • Guaranteed revelation • BUT - Leave your EGO at the door

  14. The 5 C’s of Web Design (+)

  15. The 5 C’s of Web Design (+) + USABILITY Usability Testing – when to test • Test early, test often • Iterative design

  16. The 5 C’s of Web Design (+) + USABILITY Usability Testing – SAVES MONEY ! • Low Fidelity prototyping • Paper Prototyping

  17. The 5 C’s of Web Design (+) + USABILITY Paper prototyping • Paper screen shots • One person acts as the computer • Have an ‘Under Construction’ page

  18. The 5 C’s of Web Design (+) + USABILITY User Testing • Does NOT make up for lack of knowledge about your target audience

  19. The 5 C’s of Web Design (+) + USABILITY User Testing • Decide on top 10 tasks • Create Scenarios

  20. The 5 C’s of Web Design (+) + USABILITY User Testing • Test typical users – new and experienced • Warm bodies will do… • Hallway grab

  21. The 5 C’s of Web Design (+) + USABILITY User Testing • 4-5 users will do • Test fewer people but more often

  22. The 5 C’s of Web Design (+) + USABILITY User Testing • One facilitator – advising and conducting test • Two observers – not in line of sight

  23. The 5 C’s of Web Design (+) + USABILITY User Testing – How To • Facilitator welcomes participant and explains procedure

  24. The 5 C’s of Web Design (+) + USABILITY User Testing • Testing the SITE not the USER! • Verbal protocol – keep talking • Encourage questions – no answers

  25. The 5 C’s of Web Design (+) + USABILITY User Testing • Facilitator keeps ‘poker face’ • Observers stay silent and take notes

  26. The 5 C’s of Web Design (+) + USABILITY User Testing – What to look for • Task completion • User confidence • Errors – time spent in error state

  27. The 5 C’s of Web Design (+) + USABILITY User Testing – Observables • Head slappers • Confusion of terminology • Areas missed or overlooked

  28. The 5 C’s of Web Design (+) + USABILITY User Testing – Subjective feedback • After tasks are finished

  29. The 5 C’s of Web Design (+) + USABILITY User Testing – Debriefing • After Subjective feedback • Explain the goals of the test to the user

  30. The 5 C’s of Web Design (+) + USABILITY Usability Testing – when to test • Iterative design • Design, test, design, test… then code it.

  31. The 5 C’s of Web Design • Content • Continuity • Cut to the chase • Context • Community + USABILITY !

  32. The 5 C’s of Web Design Resources: • www.useit.com- Nielson Norman Group • Don’t Make Me Think – Steve Krug • Home Page Usability – Jacob Nielsen • Information Architecture for the WWW • SIG CHI + SIG IA - Google

  33. The 5 C’s of Web Design Questions?

More Related