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

Mobile Application Accessibility

Mobile Application Accessibility

A presentation given in February 2013 summarizing challenges and solutions to increase the accessibility of mobile applications.

Adrian Kosmaczewski

February 19, 2013
Tweet

More Decks by Adrian Kosmaczewski

Other Decks in Technology

Transcript

  1. Mobile Accessibility

    View Slide

  2. Adrian Kosmaczewski

    View Slide

  3. View Slide

  4. View Slide

  5. View Slide

  6. View Slide

  7. View Slide

  8. What is
    “Accessibility”?

    View Slide

  9. “The degree to which a
    product, device, service, or
    environment is available to as
    many people as possible.”
    http://en.wikipedia.org/wiki/Accessibility

    View Slide

  10. Accessibility

    Usability

    View Slide

  11. Accessibility is about
    everyone

    View Slide

  12. Accessibility is about
    everything

    View Slide

  13. Transportation

    View Slide

  14. http://www.openideo.com/open/voting/inspiration/enhanced-urban-mobility-the-people-s-way
    Architecture and
    Urbanism

    View Slide

  15. http://www.georgiancollege.ca/news/wp-content/uploads/2010/01/ACCESSIBILITY-003-300x281.jpg
    Employment

    View Slide

  16. Example:
    Conferences

    View Slide

  17. •Wheelchair access?
    •Restrooms?
    •Copies of papers?
    •Sign language
    interpreters?
    •Quiet places for
    conversations?
    •Braille copies of the
    printed material?
    •Volunteers to
    describe and guide?
    •Food allergies or
    religious
    preferences?
    •Flashing lights?

    View Slide

  18. Legal Implications

    View Slide

  19. View Slide

  20. Article 4.g

    View Slide

  21. To undertake or promote research
    and development of (…) new
    technologies, including information
    and communications technologies,
    mobility aids, devices and assistive
    technologies, suitable for persons
    with disabilities, giving priority to
    technologies at an affordable cost;
    http://www.un.org/disabilities/convention/conventionfull.shtml

    View Slide

  22. Switzerland?

    View Slide

  23. http://en.wikipedia.org/wiki/Convention_on_the_Rights_of_Persons_with_Disabilities

    View Slide

  24. http://www.admin.ch/ch/d/sr/151_31/index.html

    View Slide

  25. http://www.admin.ch/ch/f/rs/151_31/index.html

    View Slide

  26. Article 10

    View Slide

  27. View Slide

  28. View Slide

  29. Mobile Technologies

    View Slide

  30. Disruption

    View Slide

  31. http://www.flickr.com/photos/oskay/365607662/

    View Slide

  32. http://www.flickr.com/photos/justdrew1985/4348527596/

    View Slide

  33. Lifestyle change

    View Slide

  34. http://www.flickr.com/photos/garryknight/4659579077/
    http://www.flickr.com/photos/aidanmcmichael/295397071/
    http://www.flickr.com/photos/lwr/27361510/

    View Slide

  35. for everyone

    View Slide

  36. http://www.flickr.com/photos/luc/6800884507/
    http://www.flickr.com/photos/faceme/3578347527/

    View Slide

  37. Mobile developers?

    View Slide

  38. http://www.flickr.com/photos/digital_femme/4979749085/
    http://www.flickr.com/photos/jenniferconley/6897584703/
    http://www.flickr.com/photos/digital_femme/4979750047/

    View Slide

  39. Demographics

    View Slide

  40. Male

    View Slide

  41. Healthy

    View Slide

  42. http://www.flickr.com/photos/slworking/5757370044/
    (sorta)

    View Slide

  43. 20 - 40 years old

    View Slide

  44. Medium to high
    income

    View Slide

  45. Not a good start

    View Slide

  46. Anecdote

    View Slide

  47. iPhone Dev Days
    London 2010

    View Slide

  48. “10 Commandments
    for iOS Developers”

    View Slide

  49. Attendee

    View Slide

  50. Blind

    View Slide

  51. “You forgot the 11th”

    View Slide

  52. Accessibility

    View Slide

  53. View Slide

  54. Mobile Paradox

    View Slide

  55. Mobile technologies
    enable users

    View Slide

  56. •Focused
    •Immediate
    •Geolocalized
    •Cameras
    •Accelerometer
    •Compass
    •Gyroscope
    •Microphone
    •Cheaper

    View Slide

  57. Mobile technologies
    disable users

    View Slide

  58. •Small screen
    •Small keyboard
    •On-screen
    keyboard
    •Poor battery life
    •Small font sizes
    •Operated with
    one hand
    •Stripped-down
    contents

    View Slide

  59. View Slide

  60. Axis of mobile
    accessibility

    View Slide

  61. •Types of content
    •Types of user needs
    •Types of challenges posed by mobile
    devices

    View Slide

  62. 1. Mobile content

    View Slide

  63. •Websites
    •Apps

    View Slide

  64. 2. User needs

    View Slide

  65. •Visual
    •Motor/Mobility
    •Auditory
    •Seizures
    •Cognitive/
    Intellectual
    •Localization and
    cultural issues

    View Slide

  66. •Temporary
    •Permanent

    View Slide

  67. 3. Challenges

    View Slide

  68. •Small devices
    •Different form factors
    •Touch screens
    •Diverse UI designs
    •Lack of expandability
    •Outdoor use
    http://www.flickr.com/photos/solgrundy/5365304165/
    http://www.flickr.com/photos/johanl/6798184016/

    View Slide

  69. View Slide

  70. How?

    View Slide

  71. http://www.flickr.com/photos/jenniferconley/6897571105/
    Include Accessibility in
    the Design Process

    View Slide

  72. Considerations

    View Slide

  73. •Standards
    •Platforms
    •Guidelines
    •APIs
    •… end users

    View Slide

  74. 7 Guidelines

    View Slide

  75. 1.
    Descriptive Text in UI
    Controls

    View Slide

  76. A short, localized word or
    phrase that succinctly
    describes the control or view,
    but does not identify the
    element’s type.
    A brief, localized phrase that
    describes the results of an
    action on an element.

    View Slide

  77. View Slide

  78. Source: developer.apple.com (akos.ma/hnw)

    View Slide

  79. 2.
    Do not convey meaning
    with color alone

    View Slide

  80. http://www.cultofmac.com/200268/clear-for-mac-a-refreshingly-fun-and-simple-task-manager-inspired-by-ios-review/

    View Slide

  81. 3.
    Minimize text input

    View Slide

  82. 4.
    Semantic HTML
    markup

    View Slide

  83. 5.
    Avoid scrolling

    View Slide

  84. 6.
    Do not use gestures
    alone

    View Slide

  85. 7.
    Allow zooming

    View Slide

  86. http://www.flickr.com/photos/79578508@N08/8381182759/

    View Slide

  87. View Slide

  88. Summary

    View Slide

  89. 1. Descriptive text in UI controls
    2. Do not convey meaning with color
    3. Minimize text input
    4. Semantic HTML markup
    5. Avoid scrolling
    6. Do not use gestures alone
    7. Allow zooming

    View Slide

  90. And remember

    View Slide

  91. Think accessible!

    View Slide

  92. Thanks!

    View Slide

  93. Contains elements adapted from 

    “Mobile Accessibility - Challenges and
    Best Practices” 

    by Shyamala Prayaga"
    http://akos.ma/sj7"
    "
    "
    Copyright © 2013 Adrian Kosmaczewski"
    All Rights Reserved

    View Slide