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.

The Velvet Rope - making user experience accessible

1,576 views

Published on

There is little use in compliance with accessibility standards if your audience is unable to use your product. Accessibility is not just about meeting the standards. It’s not just a developer’s sport. Or an exercise in quality assurance. It’s about equivalent user experience for people with different abilities. How we get there can be as innovative and creative as you want as long as the principles of accessible user experience are honoured.

Published in: Internet
  • Be the first to comment

The Velvet Rope - making user experience accessible

  1. 1. The velvet rope Henny Swan @iheni
  2. 2. This talk we given at NUX5, 2016. For notes accompanying the slides please download as a PDF. Images should all be accessible, and video is described in the note.
  3. 3. Colin late 60s retired EastEnders fan iPlayer user blind screen-reader user
  4. 4. BBC iPlayer v3
  5. 5. Multiple headings with updating copy
  6. 6. Duplicated links to the same page
  7. 7. Primary content far down in the content order
  8. 8. Links with dual actions
  9. 9. What do these issues have in common?
  10. 10. They are not accessibility issues.
  11. 11. What does a disabled person want? compliance with WCAG support for WAI ARIA page validation an accessibility policy Said nobody, ever!
  12. 12. #aux accessible user experience
  13. 13. “Applying accessibility techniques to an unusable site is like putting lipstick on a pig. No matter how much you apply, it will always be a pig.” —Lipstick on a Usability Pig, Jared Smith
  14. 14. “It pains me to say this but web developers may not be the most important people when it comes to making accessible websites and apps.” —Ian Pouncey
  15. 15. Guidelines focus on… code over design output over outcome compliance over experience
  16. 16. Guidelines focus on… code over design output over outcome compliance over experience
  17. 17. Accessible User Experience Principles 1. BBC - How to Design for Accessibility 2. Microsoft Inclusive Design Toolkit 3. A Web for Everyone - Sarah Horton and Whitney Quesenbery
  18. 18. Accessible User Experience Principles 1.People first 2.Equivalence 3.Choice 4.Control 5.Consistency 6.Value
  19. 19. People first Place the needs of people above the needs of technology
  20. 20. “The potential audience of a website or app is anyone human. Inclusivity of ability, preference and circumstance is paramount.” —Heydon Pickering, Inclusive Design Patterns
  21. 21. Legacy content
  22. 22. Legacy content Procurement
  23. 23. Legacy content Procurement Third-party content
  24. 24. Legacy content Procurement Third-party content Pattern libraries
  25. 25. Equivalence Disabled people can perceive, understand, navigate and interact with content equally without barriers
  26. 26. Accessible 1.2.2 Captions (Prerecorded): Captions are provided for all prerecorded audio content in synchronized media, except when the media is a media alternative for text and is clearly labeled Netflix
  27. 27. Equivalent experience: Colour-coded speakers ITV Player
  28. 28. Equivalent experience: Colour-coded speakers Custom styles YouTube
  29. 29. Equivalent experience: Colour-coded speakers Custom styles Repositioning Ted Talks
  30. 30. Equivalent experience: Colour-coded speakers Custom styles Repositioning iPlayer
  31. 31. Equivalent experience: Colour-coded speakers Custom styles Repositioning Understandable BuzzfeedBuzzfeed
  32. 32. In 2015, Ofcom reported 80% of subtitle users in the UK do not identify as having hearing loss. Microsoft Inclusive Design Toolkit
  33. 33. Choice Provide multiple ways to find content and complete complex or non-standard tasks
  34. 34. Beware of assumptions and be aware of context
  35. 35. www.brightonmuseums.org
  36. 36. “It can be difficult today to visualise the building as it looked a hundred years ago, but as we follow the tour, imagine the rooms with their royal furniture and ornaments removed, and with lino covering the floors, and boards protecting the walls. You’ll have the opportunity to see photographs of the Pavilion during its time as a hospital throughout our tour.” www.brightonmuseums.org
  37. 37. “It can be difficult today to visualise the building as it looked a hundred years ago, but as we follow the tour, imagine the rooms with their royal furniture and ornaments removed, and with lino covering the floors, and boards protecting the walls. You’ll have the opportunity to see photographs of the Pavilion during its time as a hospital throughout our tour.” www.brightonmuseums.org
  38. 38. www.brightonmuseums.org
  39. 39. Visual design Non visual design Inclusive design
  40. 40. “…choice is a privilege. One whose luxury some of us don’t have.” —Sina Braham
  41. 41. Control Ensure the user always has control over content and can customise the display
  42. 42. Pinch zoom Legibility Interaction Distraction Don’t disable zoom —Adrian Roselli
  43. 43. Fixed orientation www.Stuff4Sam.com
  44. 44. Consistency Use consistent and familiar design patterns
  45. 45. Standard versus custom components
  46. 46. Inconsistent focus order “Since navigation is at the bottom focus should start here.”
  47. 47. Consistency across platforms
  48. 48. Value Features add value for everyone but some features add more value than others
  49. 49. Features Filters Grid / list layout Wizards Data visualisation UXMovement
  50. 50. Just Eat AmazonYouTube Voice API Geolocation API Camera and voice API
  51. 51. Consider disabled people when prioritising features
  52. 52. The principles of accessible user experience is all user experience
  53. 53. Billy Gregory @TheBillyGregory
  54. 54. When is something accessible? Johnny Taylor @ableaccess When I can use it!
  55. 55. Inclusive Design Patterns —Hendon Pickering
  56. 56. Thank you Henny Swan @iheni

×