Adding Accessibility Features to Apps for Blind and Visually-Impaired Users

SPEAKER: There are
approximately 285 million people with visual impairments
around the world. Making your app accessible
not just opens it up to these users, but
it has a potential to improve design for everyone. Most people are familiar with
an accessibility service called TalkBack, which
is a screen viewer utility for people who are
blind and visually impaired. With TalkBack, the
user performs input via gestures such as
swiping or dragging, or an external keyboard. The output is usually
spoken feedback. There are two
gesture input modes. The first one is
touch exploration, where you drag your
finger across the screen. And the second one
is linear navigation, where you swipe left and
right with your finger until you find the
item of interest. Once you arrive to the
item you’re interested in, you double tap on
it to activate. The primary way in which you
can attach alternative text description for your UI elements
to be spoken by TalkBack is by using an Android attribute
called ContentDescription. If you don’t provide
ContentDescription for an image button, for example, the
experience for a TalkBack user can be jarring. AUTOMATED VOICE:
Unlabelled button. Double tap to activate. Unlabelled button. Double tap to activate. SPEAKER: For decorative elements
such as spacers and dividers, setting
ContentDescription to null will tell TalkBack to ignore
and not speak these elements. Make sure to not
include control type or control state in your
content description– words like buttons,
selected, checked, etc., as Android natively
does that for you. Android linked
automatically show you which UI controls lack
content descriptions. To keep TalkBack
spoken output tidy, you can arrange related
content into groups by using focusable containers. When TalkBack encounters
such a container, it will present the content
as a single announcement. For more complex
structures such as tables, you can assign
focus to a container holding one piece
of the structure, such as a single row. Grouping content both reduces
the amount of swiping the user has to do while
streamlining speech output. Here is an example of how
ungrouped table of contents works. AUTOMATED VOICE: Song details. Name. Hey Jude. Artists. The Beatles. Cost $1.45. SPEAKER: And here’s the same
content with grouping applied. AUTOMATED VOICE: Content
grouping activity. Song details. Name, Hey Jude. Artists, the Beatles. Cost $1.45. SPEAKER: You should manually
test your app with TalkBack and eyes closed
to understand how a blind user may experience it. We also provide
Accessibility Scanner as an app in Google Play. It suggests accessibility
improvements automatically by looking
at content labels, clickable items,
contrast, and more. Vision impairments doesn’t
just refer to blindness. 65% percent of our population
is farsighted, for example. With careful design,
you can make sure that many of your
visually impaired users can have a positive
experience without having to rely on TalkBack. Begin by making sure
that UI of your apps works with other
accessibility settings, including increased font
size and magnification. Keep your touch targets large– at least 48 x 48 dp. This makes them easier
to distinguish and touch. Provide adequate color contrast. The World Wide Web Consortium
created color contrast accessibility
guidelines to help. And to assist users
with color deficiencies, use cues other than color
to distinguish UI elements. For example, more descriptive
instructional text. If you’re using custom views
or drawing your app window using OpenGL, you need
to manually define accessibility metadata, so
that Accessibility Services can interpret your app properly. The easiest way to
achieve this goal is to rely on the
ExploreByTouchHelper class. With just a few
methods, you can build a hierarchy of
virtual views that are accessible to TalkBack. Making your app
accessible doesn’t just open it to new users. It helps to make the
world a better place, one app at a time. To read more about
developing and testing your apps for users with visual
impairment, check out the links below. Also check out the video
on developing for users with motor impairments. [MUSIC PLAYING]

, , , , , , , , , , , , , , , , , , , , , , , , , , , ,

Post navigation

10 thoughts on “Adding Accessibility Features to Apps for Blind and Visually-Impaired Users

  1. Awesome video! There's not NEARLY enough content around accessibility best practices, this is super useful.

  2. Hi. Thanks for this video!

    I'm curious about the suggestion to add focus to text elements (to group them). I thought that the standard is to only add focus to elements that the user might interact with (buttons, input). Any thoughts or advice?

  3. I think as developers, a lot of us are guilty of ignoring accessibility in its entirety. This video reinstated the importance of being cognizant of all types of users on the net and provide a seamless and enjoyable experience for all. Thank you very much for this, much appreciated.

Leave a Reply

Your email address will not be published. Required fields are marked *