Over 1 billion people are estimated to experience disability. This corresponds to about 15% of the world's population - World Health Organization (WHO)
Deafness & Hard-of-hearing Motor Impairments Cognitive disabilities Blindness & Visual impairment Everyone could experiences one of these in their lives.
- Won “Innovation in Accessibility” award for the first time in Game awards - Even people without common disabilities start using these features! The Last of Us
Favorite/Like/Love Search Open Navigation Drawer Label images - Provide a screen readable label of your image and actions - Translated for different languages
ViewCompat.replaceAccessibilityAction( itemView, AccessibilityNodeInfoCompat.AccessibilityActionCompat.ACTION_CLICK, "Open $text", null ) “Double tap to open $text”
ViewCompat.replaceAccessibilityAction( itemView, AccessibilityNodeInfoCompat.AccessibilityActionCompat.ACTION_CLICK, "Open $text", null ) “Double tap to open $text”
@Composable fun ClickableRow( text: String, onClick: () -> Unit ) { Row( modifier = Modifier .clickable() { onClick() } ) { //Render Text and Arrow Right Icon } } “Double tap to click”
@Composable fun ClickableRow( text: String, onClick: () -> Unit ) { Row( modifier = Modifier .clickable(onClickLabel = "Open $text") { onClick() } ) { //Render Text and Arrow Right Icon } } “Double tap to open $text”
Merge components - Merge views to make screen reader navigate with fewer taps - Recommend to use for Lists + “Checkbox Checked” “With Soup” “Checkbox With Soup - Checked”
Describe the state - Telling screen reader to alert user for state change on interaction Paused Playing Image ref: https://medium.com/google-dev eloper-experts/state-description s-on-android-b2029283871f
Anti-patterns - Do not reinvent the wheel - Use material or androidx components as much as possible - Do not abuse accessibility announcements val event = AccessibilityEvent(AccessibilityEvent.TYPE_ANNOUNCEMENT) event.text.add("You got a new notification!") accessibilityManager.sendAccessibilityEvent(event)
Anti-patterns - Do not reinvent the wheel - Use material or androidx components as much as possible - Do not abuse accessibility announcements val event = AccessibilityEvent(AccessibilityEvent.TYPE_ANNOUNCEMENT) event.text.add("You got a new notification!") accessibilityManager.sendAccessibilityEvent(event)
Check List - Adjust button sizes, text sizes and color contrast - Label images - Skip unnecessary elements - Provide accessibility actions - Replace with meaningful actions - Adjust timeout - Merge elements
Automated Testing - Espresso provides a one-line code to test accessibility - Runs a list of test every time you interact with the view in a test class EspressoTest { init { AccessibilityChecks.enable() } }
Automated Testing There were 2 accessibility errors: AppCompatImageButton{id=2131165210, ...}: View is missing speakable text needed for a screen reader, AppCompatImageButton{id=2131165210,...}: View falls below the minimum recommended size ... ...
“Accessibility isn’t something that you check the list and say it’s done. It’s an user experience so you have to test it manually by yourself to know it’s a good experience”