It’s Always Sunny in Mobile Accessibility

Do you want to be a Golden God of mobile accessibility? First you are going to need your tools. With the increased usage of mobile devices, it’s critical for development teams to understand how to build mobile applications that don’t obstruct accessibility/usability of individuals with disabilities. Currently the Web Content Accessibility Guidelines (WCAG) addresses a fraction of mobile web and native application-specific issues and largely anchors them to the standards for non-mobile software and web. Putting teams in the difficult position of having to decipher and validate their mobile accessibility approach on their own.

In this talk we will discuss how WCAG can be applied to mobile web and native applications, best practices and an overview into accessibility features and tools available for both android and iOS devices. After this talk you will see how mobile accessibility is governed by reason unlike bird law. This talk is for developers and testers on teams that are supporting native/hybrid apps, but will be helpful for any developer interested in building more accessible mobile applications.

Transcript

4. @ScopicEngineer #dvlpdnvr • Web Accessibility Overview • WCAG Overview • Exploring WCAG 2.1 Mobile Success Criteria • Android and iOS Features/Tools
6. Matt D. Smith @ScopicEngineer #dvlpdnvr
7. Sites and applications that accommodate all users on all devices regardless of the situation, circumstances or ability of the user. @ScopicEngineer #dvlpdnvr
8. @ScopicEngineer #dvlpdnvr About 1 billion of the world's population lives with some form of disability 56 million live in the United States 28 million use the Internet on a daily basis - World Health Organization - U.S. Census - Pew Research Center
9. Visual Motor Cognitive Auditory Types of Disabilities @ScopicEngineer #dvlpdnvr
10. Section 508 • Healthcare, Insurance Companies, Government Agencies (including some government-funded institutions), Banking/Financial Institutions, etc Legal Requirements Section 504 • Public K-12 schools and private schools, college and Universities (that receive some federal funding) @ScopicEngineer #dvlpdnvr
11. @ScopicEngineer #dvlpdnvr Credit: BBC
12. @ScopicEngineer #dvlpdnvr Credit: WebAIM
14. Web Content Accessibility Guidelines (WCAG) are a series of internationally recognized guidelines for improving web accessibility created by World Wide Web Consortium (W3C) @ScopicEngineer #dvlpdnvr
15. Four Principles of WCAG Perceivable: Users must be able to perceive the information being presented Operable: Users must be able to operate the interface Understandable: Users must be able to understand the information as well as the operation of the user interface Robust: Users must be able to access the content as technologies advance WCAG 2.1 Guidelines @ScopicEngineer #dvlpdnvr
16. WCAG Levels of Conformance Level A: The most basic web accessibility features Level AA: Deals with the biggest and most common barriers for disabled users Level AAA: The highest (and most complex) level of web accessibility @ScopicEngineer #dvlpdnvr
17. WCAG 2.0 vs WCAG 2.1 @ScopicEngineer #dvlpdnvr
18. WCAG 2.1 extends 2.0 (All success criteria from 2.0 are included in 2.1) @ScopicEngineer #dvlpdnvr
19. WCAG 2.1 has 8 new success criteria that specifically addresses mobile accessibility @ScopicEngineer #dvlpdnvr
21. 1.3.4 Orientation (AA) Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential. @ScopicEngineer #dvlpdnvr
22. @ScopicEngineer #dvlpdnvr Credit: Xiaolong Wong
23. 2.5.1 Pointer Gestures (A) All functionality that uses multipoint or path-based gestures for operation can be operated with a single pointer without a path- based gesture, unless a multipoint or path-based gesture is essential. @ScopicEngineer #dvlpdnvr
24. @ScopicEngineer #dvlpdnvr Credit: Sebastian Hietsch
25. 2.5.4 Motion Actuation (A) Functionality that can be operated by device motion or user motion can also be operated by user interface components and responding to the motion can be disabled to prevent accidental actuation, except when: Supported Interface or Essential @ScopicEngineer #dvlpdnvr
26. @ScopicEngineer #dvlpdnvr Credit: AndroidCentral
27. 2.5.2 Pointer Cancellation (A) For functionality that can be operated using a single pointer, at least one of the following is true: No Down-Event, Abort or Undo, Up Reversal, Essential @ScopicEngineer #dvlpdnvr
28. @ScopicEngineer #dvlpdnvr Credit: The Internet
29. 2.5.6 Concurrent Input Mechanisms (AAA) Web content does not restrict use of input modalities available on a platform except where the restriction is essential, required to ensure the security of the content, or required to respect user settings. @ScopicEngineer #dvlpdnvr
30. @ScopicEngineer #dvlpdnvr Credit: Hable
31. 2.5.5 Target Size (AAA) The size of the target for pointer inputs is at least 44 by 44 CSS pixels except when: Equivalent, Inline, User Agent Control, Essential @ScopicEngineer #dvlpdnvr
32. @ScopicEngineer #dvlpdnvr Credit: Apple Design
33. 2.5.3 Label in Name (A) For user interface components with labels that include text or images of text, the name contains the text that is presented visually. @ScopicEngineer #dvlpdnvr
34. @ScopicEngineer #dvlpdnvr Credit: The Internet
35. 4.1.3 Status Messages (AA) In content implemented using markup languages, status messages can be programmatically determined through role or properties such that they can be presented to the user by assistive technologies without receiving focus. @ScopicEngineer #dvlpdnvr
36. @ScopicEngineer #dvlpdnvr Credit: Knowbility
39. @ScopicEngineer #dvlpdnvr Credit: WebAIM
40. • VoiceOver • Zoom • Magnifier iOS A11y Features • Invert Colors • Larger Text • Switch Control Learn More: Accessibility on iOS @ScopicEngineer #dvlpdnvr
41. • TalkBack • Magnifier • Switch Control Android A11y Features • High Contrast Text • Larger Text • Switch Control Learn More: Android Accessibility Overview @ScopicEngineer #dvlpdnvr
42. TalkBack / VoiceOver @ScopicEngineer #dvlpdnvr
43. • Axe for iOS (pending) • Accessibility Inspector - Xcode iOS A11y Tools @ScopicEngineer #dvlpdnvr
44. Android A11y Tools • Axe for Android • Accessibility Scanner • Android Accessibility Test Kit @ScopicEngineer #dvlpdnvr
46. @ScopicEngineer #dvlpdnvr • Accessibility is important • Make your mobile sites and applications accessible because its the right thing to do • But if you don’t want to do it because its the right thing then do it because it’s the legally required thing • Be intentional in your coding and design • Don’t let WCAG scare you
47. Thank You! Website: https://crystalprestonwatson.com Linkedin: https://www.linkedin.com/in/crystalpw Twitter: @ScopicEngineer
48. Resources • Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile • Demystifying Accessibility • What’s New in WCAG 2.1 • Understanding WCAG 2.1 – Reviewing Mobile Success Criteria • TPG Mobile Accessibility Testing Guide • Mobile accessibility checklist • BBC Mobile Accessibility Guidelines