Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The importance of accessibility and inclusivity

The importance of accessibility and inclusivity

With this talk, Radimir explains the common impairment challenges in the context of digital products and provides practical solutions based on the inclusive design principles for enabling people with diverse characteristics to use products in various environments.

Radimir Bitsov

July 01, 2021
Tweet

More Decks by Radimir Bitsov

Other Decks in Technology

Transcript

  1. @radibit The importance of accessibility and inclusivity

  2. 2

  3. 3

  4. 1. What does digital accessibility mean

  5. 5 The level at which a website or an app

    and its features are e ff ective to as many people as possible, regardless of their physical or functional capacity
  6. 6 Accessibility is perception

  7. 7 Accessibility is perception

  8. 8 Accessibility is usability

  9. 9 Accessibility is logic

  10. 10 Accessibility is equal opportunity

  11. 11 Accessibility is empathy

  12. 12 Accessibility is about you and me

  13. 13 “By designing with accessibility in mind what we're actually

    doing is we're designing for our friends, family, and our future selves.” — Alistair Duggin
  14. 14 1 billion people in the world have some form

    of disability
  15. 15 🧔 👱

  16. 16 👨🦳 👩🦳

  17. 17 80% of disability cases are due to population aging

  18. 2. Impairment challenges in the context of digital products

  19. 19 “Disability is not just a health problem. It is

    a complex phenomenon, re fl ecting the interaction between features of a person’s body and features of the society in which they live.” –World Health Organization
  20. 20 Microsoft inclusive toolkit

  21. 21 As web and mobile producers, it’s our responsibility to

    know how our products a ff ect human interactions and avoid creating mismatches
  22. 22 Types of disability

  23. 23 Hearing (hearing loss)

  24. 24 5% of the world’s population (~ 466 million people)

    has some form of auditory impairment
  25. 25 By 2050 over 900 million people (1 in 10

    people) will have hearing impairment
  26. 26 Hearing loss can be conductive

  27. 27 Hearing loss can be conductive

  28. 28 www.atalan.fr/agissons/en/malentendance.html Alt: mu ff l ed sound of a

    person talking
  29. 29 Hearing loss can be perceptive

  30. 30 www.atalan.fr/agissons/en/malentendance.html Alt: a person talking with crackling and whistling

    noises on the background
  31. 31 1. Captions and text transcript synced with video content

    Solutions
  32. 32 1. Captions and text transcript synced with video content

    2. Use of sign language while transmitting live content e.g. news websites, webinars Solutions
  33. 33 Chris Heilmann, Microsoft

  34. 34 Eyesight (visual impairments)

  35. 35 Globally, at least 2.2 billion people have a vision

    impairment or blindness
  36. 36 Vision impairment — color blindness

  37. 37 Vision impairment — color blindness

  38. 38 www.atalan.fr/agissons/en/daltonisme.html Alt: a slider moving from right to left

    changing the colors of a pie chart and its legend
  39. 39 www.atalan.fr/agissons/en/daltonisme.html

  40. 40 Vision impairment — eyesight loss

  41. 41 Alt: a hand is holding up a lens that

    blurs vision and moves it across a picture of a mountain scenery
  42. 42 Experiencing an interface through the eyes of people with

    certain impairments helps you to establish a great level of empathy and boosts your creative thinking
  43. 43 1. Avoid using color as a single cue Solutions

  44. 44 1. Avoid using color as a single cue 2.

    Readable text colors against background Solutions
  45. 45 1. Avoid using color as a single cue 2.

    Readable text colors against background 3. Keep it minimal Solutions
  46. 46 Mobility (motor impairments)

  47. 47 Motor impairments can be caused by a wide range

    of conditions like stroke, Parkinson's disease, cerebral palsy, muscular dystrophy, broken arm.
  48. 48 www.atalan.fr/agissons/en/handicap-moteur.html Alt: a mouse pointer with activated hand tremor

    attempting to click a button
  49. 49 1. Optimize for keyboard usage Solutions

  50. 50 1. Optimize for keyboard usage 2. Provide enough area

    for actionable elements Solutions
  51. 51 Cognitive di ffi culties (dyslexia, literacy)

  52. 52 1. Memory

  53. 53 1. Memory 2. Problem-solving

  54. 54 1. Memory 2. Problem-solving 3. Attention

  55. 55 1. Memory 2. Problem-solving 3. Attention 4. Text processing

  56. 56 1. Memory 2. Problem-solving 3. Attention 4. Text processing

    5. Complex expressions
  57. 57 1. Memory 2. Problem-solving 3. Attention 4. Text processing

    5. Complex expressions 6. Visual processing
  58. 58 1. Avoid drawing people’s attention away from the main

    content or functionality Solutions
  59. 59 1. Avoid drawing people’s attention away from the main

    content or functionality 2. Use clear and simple language Solutions
  60. 60 1. Avoid drawing people’s attention away from the main

    content or functionality 2. Use clear and simple language 3. O ff er multiple-choice rather than free-form text fi elds Solutions
  61. 61 Vestibular disorders and seizures

  62. 62 1. O ff er people option to turn o

    ff or reduce motion Solutions
  63. 63 1. O ff er people option to turn o

    ff or reduce motion 2. Avoid fl ashing or fl ickering e ff ects and animations Solutions
  64. 64 Permanent, temporary, situational scenarios

  65. 3. Inclusive design

  66. 66 Inclusive design is a methodology that enables people with

    diverse characteristics to use a product in various environments
  67. 67 By embracing inclusive design, we strive to build web

    products that can be used by as many people as possible
  68. 68 Inclusive design principles

  69. 69 1. Recognize exclusion

  70. 70 1. Recognize exclusion 2. O ff er choice

  71. 71 1. Recognize exclusion 2. O ff er choice 3.

    Consider situation
  72. 72 1. Recognize exclusion 2. O ff er choice 3.

    Consider situation 4. Provide equivalent experiences
  73. 73 1. Recognize exclusion 2. O ff er choice 3.

    Consider situation 4. Provide equivalent experiences 5. Prioritize core features
  74. 4. Accessibility as part of the product work fl ow

  75. 75 ♻ Integrate accessibility on each step of the product’s

    lifecycle
  76. 76 🎨 🛠 Involve everyone who is part of the

    design and implementation decision making process
  77. 77 💸 Estimate the value of each core feature and

    how it can meet the needs of more people
  78. 78 🧪 Test and maintain with accessibility in mind

  79. 79 “I could change lives and make a bigger impact,

    and that's why I have never been able to turn o ff that switch for accessibility.” — Marcy Sutton
  80. Thank you!

  81. 5. Q&A