Your SlideShare is downloading. ×
0
One User Experiencefor Better Usability, Accessibility & SEOJohn H Douglasstwitter   @JDouglassemail     jdouglass@apcowor...
Introduction
To truly succeed in usability, accessibility or optimizationindividually, we need to pay attention to them all.           ...
Usability• “I can’t remember where that report is on our intranet.”• “Why can’t I upload my video?”• “It takes me forever ...
Accessibility• “I can’t distinguish green and red.”• “My dad is losing his hearing.”• “My right hand will be in a cast for...
Optimization (SEO)• “What’s new on the iPad 2?”• “I need help with my taxes.”• “Who has the best seafood in the city?”• “W...
“[User Experience] is a common awareness, athread that ties together people from differentdisciplines who care about good ...
EM           E                               PA      AT                                 THVA LID               I T E R AT ...
A Broken Experience                                                     EM                                 E              ...
A Broader Picture                                                   EM                               E                    ...
EM           E                               PA      AT                                 THVA LID               I T E R AT ...
How Do We Improve Usability,Accessibility and SEO by Focusingon the Holistic Experience?
EM           E                               PA      AT                                 THVA LID               I T E R AT ...
EM           E                                         E                               PA      AT                         ...
EM                                         E                                                             PA               ...
EM                                E                                                    PA                           AT    ...
EM                                           E                                                               PA           ...
EM                                                    E                                                                   ...
EM                                            E                                                                PA         ...
EM                                     E                                                         PA                       ...
EM                                   E                                                       PA                           ...
EM                                           E                                                               PA           ...
EM                                                                   E                                                    ...
EM                                                                   E                                                    ...
EM                                                                      E                                                 ...
M                                        EM                      EPA                                          PA          ...
EM                                        EM                                   E                                         E...
EM                                        EM                                   E                                         E...
EM                                        EM                                                E                             ...
EM                                        EM                                  E                                         E ...
EM                                        EM                                     E                                        ...
EM                                        EM                                              E                               ...
EM                                        EM                                E                                         E   ...
EM                                        EM                                                        E                     ...
EM                                        EM                                                     E                        ...
EM                                        EM                                                         E                    ...
EM           E                               PA      AT                                 THVA LID               I T E R AT ...
EM                                       E                                                           PA                   ...
photo: Jimmy Chandler (uxprinciples.com)   Validate
EM                                              E                                                                  PA     ...
EM                                      E                                                          PA                     ...
EM                                                   E                                                                    ...
EM                                                         E                                                              ...
EM                                                                   E                                                    ...
EM                                                      E                                                                 ...
EM                          E                                              PA                     AT                      ...
EM                                                         E                                                              ...
APCO IN - Challenge
APCO IN - Solution
APCO IN - Results“We were under real time pressure – APCO INwas easy to use and we found all the documentsreally easily.  ...
EM           E                               PA      AT                                 THVA LID               I T E R AT ...
EM                                                                              E                                         ...
EM                                                                                E                                       ...
Thank YouRate my presentation! http://spkr8.com/t/5819John H Douglasstwitter   @JDouglassemail     jdouglass@apcoworldwide...
Upcoming SlideShare
Loading in...5
×

One User Experience for Better Usability, Accessibility & SEO

2,161

Published on

I presented this talk at SharePoint Conference.Org 2011.

Published in: Design
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,161
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
23
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Transcript of "One User Experience for Better Usability, Accessibility & SEO"

  1. 1. One User Experiencefor Better Usability, Accessibility & SEOJohn H Douglasstwitter @JDouglassemail jdouglass@apcoworldwide.comwork APCO Worldwide
  2. 2. Introduction
  3. 3. To truly succeed in usability, accessibility or optimizationindividually, we need to pay attention to them all. flickr photo: @photolivier
  4. 4. Usability• “I can’t remember where that report is on our intranet.”• “Why can’t I upload my video?”• “It takes me forever to enter my time.”• “What am I supposed to do next?”• “The search doesn’t work.”
  5. 5. Accessibility• “I can’t distinguish green and red.”• “My dad is losing his hearing.”• “My right hand will be in a cast for two months.”• “I’m using my iPhone.”• “I don’t know how to use our intranet.”
  6. 6. Optimization (SEO)• “What’s new on the iPad 2?”• “I need help with my taxes.”• “Who has the best seafood in the city?”• “Who else hates the 5 cents bag tax?”
  7. 7. “[User Experience] is a common awareness, athread that ties together people from differentdisciplines who care about good design, and whorealize that today’s increasingly complex designchallenges require the synthesis of differentvarieties of design expertise.” Louis Rosenfeld Rosenfeld Media
  8. 8. EM E PA AT THVA LID I T E R AT E IZ E
  9. 9. A Broken Experience EM E PA AT TH VA LID IZ E I T E R AT E 2006 - 2008
  10. 10. A Broader Picture EM E PA AT TH VA LID IZ E I T E R AT E 1904 - 1962
  11. 11. EM E PA AT THVA LID I T E R AT E IZ E
  12. 12. How Do We Improve Usability,Accessibility and SEO by Focusingon the Holistic Experience?
  13. 13. EM E PA AT THVA LID I T E R AT E IZ E
  14. 14. EM E E PA AT AT THVA LID VA LID I T E R AT E IZ E
  15. 15. EM E PA AT A TH VA LID VA LID IZ E I T E R AT EUnderstand and share another personsperspective, feelings and needs Empathize
  16. 16. EM E PA AT A TH VA LID VA LIDUnderstand & Share IZ E I T E R AT E Empathize
  17. 17. EM E PA AT A TH VA LID VA LIDPerspective, Feelings, Needs IZ E I T E R AT E Pitch? 53 Definitions Empathize
  18. 18. EM E PA AT A TH VA LID VA LID IZ EBest Processes & Practices I T E R AT E1. Identify a Design Challenge2. Target Your Audience3. Choose Your Method4. Identify Patterns & Themes5. Use Relevant Nomenclature6. Accommodate for Flow7. Use Friendly Menus and Navigation Empathize
  19. 19. EM E PA AT A TH VA LID VA LID1. Identify a Design Challenge IZ E I T E R AT E Empathize
  20. 20. EM E PA AT A TH VA LID VA LID2. Target Your Audience IZ E I T E R AT E Empathize
  21. 21. EM E PA AT A TH VA LID VA LID3. Choose Your Method IZ E I T E R AT E Empathize
  22. 22. EM E PA AT A TH VA LID VA LID4. Identify Patterns & Themes IZ E I T E R AT E Empathize
  23. 23. EM E PA AT A TH VA LID VA LID4. Use Relevant Nomenclature IZ E I T E R AT E • Use meaningful page names, titles and text • Create friendly URLS • Avoid jargon • Always use appropriate anchor, alt and descriptive text Empathize
  24. 24. EM E PA AT A TH VA LID VA LID5. Accommodate for Flow IZ E I T E R AT E• Stay out of people’s way• Present few choices• Give a clear scent of information• Load pages quickly (review via SP developer dashboard) Empathize
  25. 25. EM E PA AT A TH VA LID VA LID6. Use Friendly Navigation IZ E I T E R AT E• Avoid using Flash / Silverlight / Javascript for navigation menus.• Provide alternatives for interactive elements, when possible. Empathize
  26. 26. M EM EPA PA AT TH TH VA LID IZ E I T E R AT E IZ E
  27. 27. EM EM E E PA PA AT AT TH TH VA LID VA LID IZ E IZ E I T E R AT E I T E R AT EEvaluate, brainstorm, and prototypeideas to find the best Iteration
  28. 28. EM EM E E PA PA AT AT TH TH VA LID VA LIDCollaboration Over Artifacts IZ E IZ E I T E R AT E I T E R AT E Iteration
  29. 29. EM EM E E PA PA AT AT TH TH VA LID VA LIDBest Process & Practices IZ E IZ E I T E R AT E I T E R AT E 1. Create Opportunity Areas 2. Brainstorm Solutions 3. Follow the Rules 4. Prototype Ideas 5. (But) Don’t Fall in Love 6. Go Mobile First 7. Be Inclusive & Collaborative Iteration
  30. 30. EM EM E E PA PA AT AT TH TH VA LID VA LID1. Create Opportunity Areas IZ E IZ E I T E R AT E I T E R AT E Iteration
  31. 31. EM EM E E PA PA AT AT TH TH VA LID VA LID2. Brainstorm Solutions IZ E IZ E I T E R AT E I T E R AT E Iteration
  32. 32. EM EM E E PA PA AT AT TH TH VA LID VA LID3. Follow the Rules IZ E IZ E I T E R AT E I T E R AT E 1. Defer judgement 2. Encourage wild ideas 3. Build on the ideas of others 4. Be visual 5. Stay focused on the topic 6. One conversation at a time 7. Go for quantity Iteration
  33. 33. EM EM E E PA PA AT AT TH TH VA LID VA LID4. Prototype Ideas IZ E IZ E I T E R AT E I T E R AT E Iteration
  34. 34. EM EM E E PA PA AT AT TH TH VA LID VA LID5. Don’t Fall in Love IZ E IZ E I T E R AT E I T E R AT E• Prototypes should be rough and rapid• Disposable tools to help validate and generate ideas• Not just for interface design• What question is a prototype answering? Usability, findability, accessibility? Iteration
  35. 35. EM EM E E PA PA AT AT TH TH VA LID VA LID6. Go Mobile First IZ E IZ E I T E R AT E I T E R AT E• Enhancing the mobile experience can also improve accessibility and vice versa.• Focus on core actions• Use scalable design• Focus on innovation Iteration
  36. 36. EM EM E E PA PA AT AT TH TH VA LID VA LID7. Be Inclusive & Collaborative IZ E IZ E I T E R AT E I T E R AT E• Remember the holistic experience• Include admins, analysts, designers, developers, managers• Illustrate complexity of issues to stakeholders• Get buy-in early Iteration
  37. 37. EM E PA AT THVA LID I T E R AT E IZ E
  38. 38. EM E PA AT TH VA LID IZ E I T E R AT EFail early and fail often Validate
  39. 39. photo: Jimmy Chandler (uxprinciples.com) Validate
  40. 40. EM E PA AT TH VA LIDBest Processes & Practices IZ E I T E R AT E1. Choose Your Test2. Follow the Analytics Trinity3. Conduct Evaluative Interviews4. Include Disabled in Testing5. Follow Principle of One6. Go Remote7. Focus on a Continuum Validate
  41. 41. EM E PA AT TH VA LID1. Choose Your Test IZ E I T E R AT ETuxedo Guerilla Validate
  42. 42. EM E PA AT TH VA LID2. Follow the Analytics Trinity IZ E I T E R AT E • Experience • Behavior • Outcomes image: Avinash Kaushik Validate
  43. 43. EM E PA AT TH VA LID3. Conduct Evaluative Interviews IZ E I T E R AT E• Solicit honest feedback, even if negative• Improvise on the fly• Build on ideas. Ask “should”. Validate
  44. 44. EM E PA AT TH VA LID4. Include Disabled in Testing IZ E I T E R AT EIncluding at least one person in testing: • Provides insight into mental models, behaviors & habits • Transcends “checklist” development mentality • Brings struggles to life • Increase buy-in potential Validate
  45. 45. EM E PA AT TH VA LID5. Follow Principle of One IZ E I T E R AT E1. Test or talk to one person, at least2. Go guerilla3. Fight intimation4. Leverage the many resources available Validate
  46. 46. EM E PA AT TH VA LID6. Go Remote IZ E I T E R AT E Validate
  47. 47. EM E PA AT TH VA LID7. Focus on a Continuum IZ E I T E R AT E Accessibility, optimization and usability operate on sliding scale. Validate
  48. 48. APCO IN - Challenge
  49. 49. APCO IN - Solution
  50. 50. APCO IN - Results“We were under real time pressure – APCO INwas easy to use and we found all the documentsreally easily.  Without it, we would really havestruggled to meet the deadline on what was animportant new business prospect.” APCO Employee
  51. 51. EM E PA AT THVA LID I T E R AT E IZ E
  52. 52. EM E PA AT TH VA LIDResources IZ E I T E R AT EIntroduction• Peter Morville’s honeycomb: http://semanticstudios.com/• A Project Guide to User Experience (Unger / Chandler)• Information Architecture for the World Wide Web (Morville / Rosenfeld)• About Face 3: Essentials of Interaction Design (Cooper / Reimann / Cronin)• UXExchange.com / Alltop - User Interface / Quora.comEmpathize• Observing the User Experience (Kuniavsky)• Design of Everyday Things & Emotional Design (Norman)• Card Sorting (Spencer)• Mental Models (Young)
  53. 53. EM E PA AT TH VA LIDResources IZ E I T E R AT EIterate• Gamestorming (Gray) (http://www.gogamestorm.com/)• Prototyping: A Practitioners Guide (Warfel)• Paper Prototyping (Snyder)• Luke Wroblewski’s on “Designing for Mobile First” (http://bit.ly/4j9TXI)• Sketching User Experiences (Buxton)• Mental Notes (http://getmentalnotes.com/)Validate• Rocket Surgery Made Easy (Krug)• Web Analytics in an Hour a Day (Kaushik)• Just Ask: Integrating Accessibility Throughout Design (http://www.uiaccess.com/ JustAsk/)• Remote testing Google spreadsheet: http://bit.ly/hPNUrl
  54. 54. Thank YouRate my presentation! http://spkr8.com/t/5819John H Douglasstwitter @JDouglassemail jdouglass@apcoworldwide.comwork APCO Worldwide
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×