Debugging Accessibility @ Craft Conf

1. DEBUGGING ACCESSIBILITY SALLY SHEPARD @MOSTGOOD

2. -QUICK INTRO TO ACCESSIBILITY -MANUAL DEBUGGING -ACCESSIBILITY INSPECTOR -UI TESTING -ACCESSIBILITY & WORKFLOW

3. QUICK INTRO TO ACCESSIBILITY

4. THE RELATIONSHIP BETWEEN ACCESSIBILITY & DISABILITY

5. “Disability is…a complex phenomenon, reflecting the interaction between features of a person’s body and features of the society in which he or she lives.” -World Health Organisation, definition of disability

6. PEOPLE HAVE IMPAIRMENTS, IMPAIRMENTS AREN’T THE SAME AS A DISABILITY.

7. DISABILITY ONLY EXISTS IF THERE IS NO WAY FOR A PERSON TO BE INCLUDED.

8. ☹

9. 😀

10. ACCESSIBILITY IS ABOUT ENABLING PEOPLE.

11. ACCESSIBILITY IS ABOUT ENABLING PEOPLE BY REMOVING BARRIERS.

12. IF YOUR APP ISN’T ACCESSIBLE, YOU ARE CREATING BARRIERS, YOU’RE MAKING A USERS IMPAIRMENT A DISABILITY.

13. YOU CAN REMOVE BARRIERS BY SUPPORTING ACCESSIBILITY FEATURES.

14. ACCESSIBILITY IS NOT JUST VOICEOVER.

15. https://www.microsoft.com/en-us/design/inclusive

16. THERE ARE SO MANY ACCESSIBILITY FEATURES!

17. VoiceOver Zoom Invert Colors Greyscale Color Filters Speak Screen Dynamic Type Bold Text Button Shapes Reduce Transparency Darken Colours Reduce White Point Reduce Motion On/Off Labels Switch Control AssistiveTouch Hold Duration Ignore Repeat Tap Assistance Dictation/Siri Flash for alerts Mono Audio Audio Volume Balance Hearing Aids Phone noise cancellation Subtitles & Captioning Audio Descriptions Haptic Feedback Guided Access Differentiate without colour Increase Contrast Display contrast Cursor Size Dwell Control Keyboard Access Light Sensitivity Focus Style ACCESSIBILITY FEATURES ON iOS/macOS/watchOS/tvOS

18. MOST ACCESSIBILITY FEATURES ARE HANDLED BY THE SYSTEM (NO ADDITIONAL WORK FOR YOU) 🎉 🎉 🎉 🎉 🎉

21. QUITE A FEW ACCESSIBILITY FEATURES ONLY APPLY TO SOME APPS.

23. VoiceOver Zoom *Invert Colors* Greyscale Color Filters Speak Screen Dynamic Type Bold Text Button Shapes Reduce Transparency Darken Colours Reduce White Point Reduce Motion On/Off Labels Switch Control AssistiveTouch Hold Duration Ignore Repeat Tap Assistance Dictation/Siri Flash for alerts *Mono Audio* Audio Volume Balance Hearing Aids Phone noise cancellation *Subtitles & Captioning* *Audio Descriptions* *Haptic Feedback* *Guided Access* Differentiate without colour Increase Contrast Display contrast Cursor Size Dwell Control Keyboard Access Light Sensitivity Focus Style ACCESSIBILITY FEATURES ON iOS/macOS/watchOS/tvOS

24. A LOT CAN BE HANDLED IN THE DESIGN PHASE.

25. VoiceOver Zoom *Invert Colors* Greyscale Color Filters Speak Screen Dynamic Type Bold Text Button Shapes Reduce Transparency Darken Colours Reduce White Point Reduce Motion On/Off Labels Switch Control AssistiveTouch Hold Duration Ignore Repeat Tap Assistance Dictation/Siri Flash for alerts *Mono Audio* Audio Volume Balance Hearing Aids Phone noise cancellation *Subtitles & Captioning* *Audio Descriptions* *Haptic Feedback* *Guided Access* Differentiate without colour Increase Contrast Display contrast Cursor Size Dwell Control Keyboard Access Light Sensitivity Focus Style ACCESSIBILITY FEATURES ON iOS/macOS/watchOS/tvOS

26. VoiceOver Zoom *Invert Colors* *Greyscale* Color Filters Speak Screen Dynamic Type *Bold Text* Button Shapes *Reduce Transparency* *Darken Colours* Reduce White Point *Reduce Motion* On/Off Labels Switch Control AssistiveTouch Hold Duration Ignore Repeat Tap Assistance Dictation/Siri Flash for alerts *Mono Audio* Audio Volume Balance Hearing Aids Phone noise cancellation *Subtitles & Captioning* *Audio Descriptions* *Haptic Feedback* *Guided Access* *Differentiate without colour* *Increase Contrast* Display contrast Cursor Size Dwell Control Keyboard Access Light Sensitivity Focus Style ACCESSIBILITY FEATURES ON iOS/macOS/watchOS/tvOS

27. VoiceOver Zoom *Invert Colors* *Greyscale* Color Filters Speak Screen Dynamic Type *Bold Text* Button Shapes *Reduce Transparency* *Darken Colours* Reduce White Point *Reduce Motion* On/Off Labels Switch Control AssistiveTouch Hold Duration Ignore Repeat Tap Assistance Dictation/Siri Flash for alerts *Mono Audio* Audio Volume Balance Hearing Aids Phone noise cancellation *Subtitles & Captioning* *Audio Descriptions* *Haptic Feedback* *Guided Access* *Differentiate without colour* *Increase Contrast* Display contrast Cursor Size Dwell Control Keyboard Access Light Sensitivity Focus Style ACCESSIBILITY FEATURES ON iOS/macOS/watchOS/tvOS

28. RELATIONSHIP BETWEEN VOICEOVER AND SWITCH CONTROL

29. -ACCESSIBILITY API -ACCESSIBILITY ELEMENTS

30. VoiceOver Zoom *Invert Colors* *Greyscale* Color Filters Speak Screen Dynamic Type *Bold Text* Button Shapes *Reduce Transparency* *Darken Colours* Reduce White Point *Reduce Motion* On/Off Labels *Switch Control* AssistiveTouch Hold Duration Ignore Repeat Tap Assistance Dictation/Siri Flash for alerts *Mono Audio* Audio Volume Balance Hearing Aids Phone noise cancellation *Subtitles & Captioning* *Audio Descriptions* *Haptic Feedback* *Guided Access* *Differentiate without colour* *Increase Contrast* Display contrast Cursor Size Dwell Control Keyboard Access Light Sensitivity Focus Style ACCESSIBILITY FEATURES ON iOS/macOS/watchOS/tvOS

32. ~300 MILLION VISUALLY IMPAIRED DYNAMIC TYPE IS SUPER IMPORTANT TO SUPPORT IN YOUR APPS!

33. WHAT IF WE CAN’T RELY ON OUR DESIGNS TO SUPPORT ACCESSIBILITY?

35. DON’T WORRY ABOUT WHAT A USER CAN’T DO. FOCUS ON WHAT THE TECHNOLOGY CAN DO.

36. WHY DO WE TAKE PHOTOS?

38. MANUAL TESTING & DEBUGGING

39. MANUAL TESTING ON HARDWARE

40. *DEMO*

41. -FOCUSABLE -LABELED -TRAITS -ACTIONABLE -STATE -CONTEXT VOICEOVER

42. MANUAL TESTING IN XCODE -LOG OUT ACCESSIBILITY INFO -DEBUG VIEW HIERARCHY

43. MAKING THE MOST OF MANUAL TESTING

44. RATHER THAN TESTING EVERY ELEMENT ON THE SCREEN, TEST A FEATURE FROM START TO FINISH.

45. SIMPLIFY ELEMENTS: GROUP ITEMS & MAKE LARGER TAP TARGETS.

46. NOTHING IS BETTER THAN MANUAL TESTING.

47. MANUAL TESTING GOOD ✅ COMPREHENSIVE BAD 🕰 SLOW

48. SPEEDING UP MANUAL TESTING

49. KNOW YOUR VOICEOVER GESTURES!

50. http://bit.ly/2nGZLgx Focus an element Tap Activate the focused element Double-tap Double-tap an item Triple-tap Move focus to the next or previous item Swipe right or left Adjust a Slider value Swipe up or down Move through custom actions Swipe up or down Read all the elements in order, from the top of the screen Two-finger swipe up Read all the elements in order, from currently focused element Two-finger swipe down Stop/resume speaking Two-finger tap Go back to the previous view or dismiss an alert Two-finger scrub, quickly making a “z” Scroll by a page in a table view or scroll view Three-finger swipe up or down Scroll continuously in a table view or scroll view Double-tap and hold until you hear three rising tones, then drag up or down Go to the next or previous page Three-finger swipe right or left Speak additional information about the element, such as position within a list or whether text is selected Three-finger tap Focus on the first element on the screen Four-finger tap at top of screen Focus on the last element on the screen Four-finger tap at bottom of screen Mute or unmute VoiceOver Three-finger double-tap

51. 2-FINGER SWIPE UP READ CONTENTS OF SCREEN IN ORDER FROM THE TOP

52. COMBINE DISPLAY ACCOMMODATION SETTINGS. Greyscale Dynamic Type Bold Text Reduce Transparency Reduce Motion Differentiate without colour (macOS) Increase Contrast (macOS)

53. ACCESSIBILITY SHORTCUT! (AT THE BOTTOM OF THE LIST IN ACCESSIBILITY) SETTINGS -> GENERAL -> ACCESSIBILITY -> ACCESSIBILITY SHORTCUT

54. SUPPORT.APPLE.COM/ACCESSIBILITY

55. TESTING & DEBUGGING WITH THE ACCESSIBILITY INSPECTOR

56. ACCESSIBILITY INSPECTOR *NEW IN XCODE 8*

59. -ACCESSIBILITY ELEMENT INSPECTION -AUDIT -SETTINGS ACCESSIBILITY INSPECTOR

60. WORKS WITH HARDWARE OR THE SIMULATOR

61. CONTROL SETTINGS ON HARDWARE

62. “SPY” ON OTHER APPS

63. *DEMO*

64. TESTING & DEBUGGING WITH UI TESTING

65. UI TESTING IN XCODE RELIES ON ACCESSIBILITY ELEMENTS.

66. IF YOUR APP IS NOT UI TESTABLE, IT’S BECAUSE IT HAS POOR ACCESSIBILITY DATA.

67. UI TESTABLE == ACCESSIBLE?

68. UI TESTING DOESN’T GUARANTEE ACCESSIBILITY.

69. UI TESTING CAN BE HELPFUL FOR SUPPORTING VOICEOVER (AND SWITCH CONTROL TO AN EXTENT)

70. BUT ACCESSIBILITY IS NOT JUST VOICEOVER.

71. *DEMO*

72. MAKE ACCESSIBILITY PART OF YOUR WORKFLOW

73. A LOT OF ACCESSIBILITY WORK CAN BE DONE IN THE DESIGN PHASE.

74. ACCESSIBILITY IS NOT A FEATURE, EVERY FEATURE SHOULD BE ACCESSIBLE.

75. IF IT’S NOT ACCESSIBLE, IT’S NOT DONE.

76. MAKE TESTING FOR ACCESSIBILITY PART OF YOUR TEST PLAN.

77. GET REAL USERS INVOLVED!

78. GET BETA TESTERS WHO USE A VARIETY OF ASSISTIVE TECHNOLOGIES.

79. APPLEVIS.COM @APPLEVIS

81. THINGS TO REMEMBER

82. KNOW YOUR VOICEOVER GESTURES!

83. DON’T LET THE SIZE OF WORK DISCOURAGE YOU FROM STARTING IT.

84. REDUCING COSTS •Move most Accessibility work to design phase •Focus on testing the right things •Work incrementally •Prioritise most important features

85. IF IT’S NOT ACCESSIBLE, IT’S NOT DONE.

87. THANK YOU! @MOSTGOOD

88. QUESTIONS? @MOSTGOOD

Debugging Accessibility @ Craft Conf

Recommended

Recommended

More Related Content

Similar to Debugging Accessibility @ Craft Conf

Similar to Debugging Accessibility @ Craft Conf (20)

More from Sally Shepard

More from Sally Shepard (13)

Recently uploaded

Recently uploaded (20)

Debugging Accessibility @ Craft Conf