SlideShare a Scribd company logo
Mobile Testing Guide
ANDROID & iOS
Version 2, April 2017
The details are correct at the time of writing and based on iOS 9+ and
Android 4.4+. Note that new releases on both platforms may mean the
details change or are adjusted slightly. Additionally Android features
can be inconsistent across devices and versions. The document flags
issues where known however there may be further issues.
ANDROID	 2
Talkback	3
Switch access	 10
Auto scanning	 11
Magnification gestures	 12
Greyscale	13
Browser & Talkback support	 14
Testing tools	 16
IOS	 17
Voiceover	18
The Rotor	 19
Basic gestures	 22
Screen Curtain	 25
Speech Off	 25
Pass-through Gesture	 25
Zoom 	 26
Invert colors 	 28
Grayscale 	 28
Testing tools	 28
RESOURCES	 29
Standards & Guidelines	 29
Android resources	 30
Apple Resources	 30
Articles and other resources	 31
CONTENTS
i
GETTING STARTED
Android accessibility features can be enabled on Android
devices through Settings → Accessibility.
ANDROID
TalkBack
Pre-installed Android screen reader. When enabled, Android reads
everything on the screen. In apps, this includes all buttons, images, form
elements, static text, etc. In the mobile browser, this should include all web
content (text, alternatives for images, links, form fields, tables, and so on).
TalkBack users include blind and low-vision users, as well as users with
some cognitive or learning difficulties.
Switch access
Switch access allows you to control your device using configurable key
combinations with an external keyboard. You can move focus to clickable
items and select an item.
Magnification gestures
When enabled, magnification allows you to zoom in and out by triple-
tapping the screen.
Grayscale view
When enabled, this setting removes all color from the display, which can
make it easier for users with vision disabilities, such as color-blindness, to
read the display.
2ANDROID
Note: This feature is not universal across devices.
For example it does not appear to work on the
Hudl running KitKat 4.4.2.
TALKBACK
To enable TalkBack, navigate to Settings
→ Accessibility → TalkBack then
switch the button to On. A ‘Use TalkBack’
confirmation screen will appear. When
used for the first time a tutorial will be
launched. Ensure the device volume is
turned up as TalkBack doesn’t
automatically adjust the volume if muted.
You can customize the TalkBack
experience through Settings →
Accessibility → TalkBack → Settings.
Mid-way down the settings screen under
the heading “Touch Exploration” ensure
that “Explore by touch” is selected, and
then launch and complete the “Explore by
touch” tutorial. It is recommended you
follow the Talkback tutorial accessed
mid-way down the settings screen under
the heading “Touch Exploration”.
Figure 1: The accessibility settings panel shown
on a Nexus Tablet
Switching Talkback on and off quickly
You can map the TalkBack on/off button to the Power key by navigating to Settings →
Accessibility → Accessibility shortcut and selecting On. Then you can then switch
TalkBack on and off using these two steps:
1.	 Press and hold the Power button until you hear a sound
or feel a vibration.
2.	 Touch and hold two fingers on the screen until you hear
spoken confirmation.
If the device has multiple users, using the shortcut on the lock screen temporarily
enables accessibility features until the device is unlocked.
3ANDROID
Basic gestures on Android
Once you enable TalkBack, the way you interact with the device changes.
There are two interaction methods:
nn Explore by touch: Drag your finger over the screen to have TalkBack
describe the items under your finger. You can double tap to open links,
press buttons, and so on. When you switch TalkBack on, touch
exploration is automatically enabled.
nn Gesture navigation: You can swipe right with a single finger to move
from one item to the next in sequence. Or you can swipe left to go
backward through this sequence. TalkBack describes items as you move
focus around the screen. You can double-tap to open links, press buttons,
and so on.
In some applications, you can zoom by putting two fingers on the screen and pinching
them together or pulling them apart. The chart below shows Android’s core touch and
gesture commands.
All TalkBack gestures use one finger.
When you use two or more fingers, your touch
or gesture goes straight to the application, rather
than to TalkBack.
For example, with TalkBack off on most pages you can
usually scroll by slowly dragging one finger. With
TalkBack on, you can scroll by dragging two fingers.
4ANDROID
Speak an element
Single tap
Scroll
Two-finger slide
Select next item
Swipe right / down
Select previous item
Swipe left / up
Scroll forward
Right then left
If you’re on a page
longer than one screen
Move to first item on screen
Up then down
Move to last item on screen
Down then up
Scroll back
Left then right
If you’re on a page
longer than one screen
Core TalkBack commands
Switch TalkBack on/off
Press and hold the off button, wait for the
vibration then hold two fingers down.
Or through Settings → Accessibility → TalkBack
Note: This only works if the Accessibility Shortcut has
been enabled in the accessibility settings screen
5ANDROID
Move slider down
Left then right
Such as volume
Home button
Up then left
Back button
Down then left
Recent apps
Left then up
Notifications
Right then down
Open local context menu
Up then right
Open global context menu
Down then right
Zoom
One-finger triple tap
Built in screen
magnification,
when enabled
6ANDROID
This isn’t considered necessary for testing, but you can assign new actions to the gestures
through
Settings → Accessibility → TalkBack → Settings → Manage gestures.
TalkBack global context
menu features
The following explains features available
in the global context menu.
Quick navigation
Hear all of the items on the screen as you
move your finger in a circle. This option
isn’t available if you’re using the list
version of the context menu instead of the
circle version (by enabling “Show Context
Menu as list” in TalkBack settings).
Read from top
Hear a read-out of all items on the screen,
starting from the top.
Read last utterance
Hear the last verbalization again.
Spell last utterance
Hear a letter-by-letter spelling of
TalkBack’s last verbalization.
Read from next item
Hear a read-out of all items on the screen,
starting from the last focused item.
TalkBack settings
This option is outside the circle menu, at
the top-right corner of your screen.
Selecting this option opens the TalkBack
settings screen.
Text to speech settings
This option is outside the circle menu, at
the bottom-right corner of your screen.
Selecting this option opens your text-to-
speech settings. You can disable TalkBack
or dim the screen from here.
Using the global
context menu
Swipe down then
right to open the
menu
Drag your finger
to hear menu
items.
When you hear
the item that
you’d like to
select, release
your finger.
Context menus
TalkBack has a global context menu and a local context menu to make it easy to find
settings and controls. The global context menu contains commands that work anywhere,
and the local context menu varies depending on the focused item. On older versions, the
global and local context menus are shaped like circles, so you can drag your finger in a
circle to hear the different options. On Android 5+ they are presented as lists.
7ANDROID
Local context menu
The local context menu contains
controls that relate to the focused item.
The options available in the menu change
depending on the item. If there are no
relevant options, TalkBack announces
‘No menu items’.
TalkBack local context
menu features
The following explains features available
in the local context menu.
Default
Each swipe to the right reads the content
of the focused item.
Characters
Each swipe to the right speaks one
character of the currently focused item.
Words
Each swipe to the right speaks one word
of the currently focused item.
Lines
Each swipe to the right speaks a single line
of the currently focused item.
Paragraph
Each swipe to the right speaks one
paragraph of the currently focused item.
Page
Each swipe to the right speaks all of the
items on the current page.
Alternative TalkBack
local context menu features
When you activate the local context menu
from screens other than your home
screen, you might hear the features in the
following table.
Page navigation
Open a new local context menu with
options for moving to the next or previous
page.
Using the local
context menu
Swipe up then
right to open the
local context menu.
Drag your finger
in a circle to hear
menu items.
When you hear
the item that
you’d like to
select, release
your finger.
8ANDROID
Cursor control menu
Open a new local context menu with
options for moving the cursor and editing
text.
Options in the cursor control menu include:
nn Move cursor to beginning
and move cursor to end
nn Cut, Copy, Paste, Select all
nn Start selection mode
and End selection mode.
To move the cursor while in an edit box,
you can tap the volume keys.
Links menu
When you navigate to text that contains
links, you can open the local context
menu, and select the Links submenu to
select one of the links included in the text.
Word
Each swipe to the right speaks one word
of the currently focused item.
Change granularity menu
Select this option to open a new local
context menu with the navigation
granularity options listed above (Default,
Page, Paragraph, Line, Word and
Character).
In certain apps (such as web browsers),
you may also see options to navigate by
Headings and Landmarks, Links, Lists,
Controls and Special Content, e.g. tables).
Label controls
This menu allows you to add, remove, and
edit customized labels for unlabeled
content. Sometimes applications are
missing labels on images. You can use
TalkBack to create your own labels for
these images, to make it easier to identify
them in the future.
Figure 2: The global context menu displayed on
screen when TalkBack is running
9ANDROID
Screen blanking
With TalkBack 4.2 and later, there is an option to dim/undim the screen from the Global
Context menu. For older devices you can download the free Android app Shades to
accomplish the same thing. This is a useful technique for testing since it allows the tester
to have a similar experience to users who can’t see the screen.
CC To blank the screen, run Shades and turn down the screen-brightness
slider to 0.
CC To un-blank the screen and bring it back to full brightness, press the
power button rapidly several times—that’s the trigger to disable Shades.
SWITCH ACCESS
To enable switch access, navigate to Settings → Accessibility → Switch access and
then switch the button to On.
Switch access allows you to control your device using configurable key combinations.
This means you can use an external keyboard or switch device to execute core keyboard
commands to navigate and interact with websites and native apps. As with the use of
TalkBack, this is a useful feature for testing keyboard access and content order.
To use switch access, you’ll need a keyboard paired with the tablet or mobile. Then you’ll
need to assign keys to actions through Settings → Accessibility → Switch access →
Settings. Select Actions under the heading “Assign Keys to Actions” to map a keystroke
to the action.
10ANDROID
Recommended keystroke mappings
While keystroke mappings depend on user preference, we recommend (for consistency)
that test teams use the same keystrokes, as shown in the table below.
Global context
menu features
Description
Auto scanning Space bar (this is already mapped)
Next Tab
Previous Shift + Tab
Click Enter
Long click Semi colon (;)
Scroll forward Right arrow
Scroll backwards Left arrow
Back Delete
Home Escape
Notifications Equals (=)
Quick settings Down arrow
Recent apps Up arrow
AUTO SCANNING
Auto scanning is a feature that moves focus automatically through all visible elements on
screen, both focusable and inactive (for example, static text). Once all visible content has
been auto scanned, the user is presented with five additional auto scan options:
1.	 Back
2.	 Home
3.	 Recent apps
4.	 Notifications
5.	 Quick navigation
This is a useful tool for testing content and focus order.
11ANDROID
2.	 You can also temporarily magnify what’s under your finger by triple-tapping
and holding. In this magnified state, you can drag your finger to explore
different parts of the screen. Lift your finger to return to your previous state.
MAGNIFICATION GESTURES
To enable Zoom, navigate to Settings → Accessibility → Magnification Gestures then
switch the button to On.
When magnification gestures are enabled, you can zoom, pan across the screen and pan
content:
1.	 Zoom in or out by triple-tapping the screen. Then, while zoomed in, you can:
Drag two or more fingers to pan across the screen.
Pinch two or more fingers together or spread them
apart to adjust the zoom level.
Note: If you enter or exit an app when zoomed in, you
automatically zoom out. Simply triple-tap to zoom in again.
Note: Triple-tap for magnification works everywhere
except the keyboard and navigation bar.
12ANDROID
GREYSCALE
To enable Android’s grayscale view, first enable Developer Mode on your device. (This is
a one-time process for each device.)
1.	 Go to Settings →
About Tablet
(which might also
be labeled About
Phone or About
Device).
2.	 Locate the Build
number section,
and tap on the
phrase “Build
number” 7 times.
3.	 Go back to the
main Settings page
and tap on
Developer
Options.
4.	 Enable the
Developer Options
switch.
From then on, you can enable Android ’s
grayscale view (Lollipop 5.0 onwards) by
going to Settings → Developer Options
→ Simulate color space and selecting
“Monochromacy.” Once you’ve made that
selection, display colors will be replaced
by shades of gray.
Grayscale is applied to all screens until
you turn off the feature, which you can do
by going back to Settings → Developer
Options → Simulate color space and
selecting “Disabled.”
Android ’s grayscale view can be used
alongside any of Android’s other modes or
applications, including TalkBack and
Shade, among others.
13ANDROID
BROWSER AND TALKBACK SUPPORT
The native Android browser, Chrome, has basic support for web browsing with TalkBack.
This means that some of the newer techniques found in WAI ARIA or HTML5 may not be
compatible and may not be announced correctly by TalkBack if you were to use it with
Chrome. Firefox for Android has better support for WAI ARIA and HTML5 as well as
more robust support for core HTML such as headings, WAI ARIA Landmarks, data tables
and so on. So we recommend testing on Firefox for Android.
Ideally, the best web development practice is to use core HTML where possible and only
use WAI ARIA and HTML5 where functionality can’t be achieved though core HTML.
Where WAI ARIA and HTML5 must be used, keep in mind that while they may not be
fully supported in Chrome with TalkBack, that support may exist elsewhere:
1.	 Firefox on Android
2.	 Other platforms such as iOS
3.	 Future versions of Chrome on Android
Navigating Firefox
Firefox uses the three-finger swipe to navigate elements.
A three-finger swipe up or down cycles between the options listed below.
nn List items (not lists)
nn Links
nn Headings
nn Form elements (edit boxes, checkboxes, buttons...)
nn Landmarks
A three-finger swipe left or right moves up or down the page by the
selected element:
The consistenty of this feature may vary across devices and versions. For example, three-
finger gestures do not appear to work on the Hudl running KitKat 4.4.2.
14ANDROID
Firefox quick-navigation keystrokes
that work with TalkBack
Firefox supports quick navigation keys with TalkBack. These work with a physical
keyboard, a Bluetooth keyboard connected to your Android device, or the Eyes-Free
keyboard in typing mode.
Keystrokes will only work when focus is in the HTML and not on the browser UI or in a
text field.
Key Description
a Moves to next named anchor
b Moves to next button
c Moves to next combobox or listbox
e Moves to next text entry or password field
f Moves to next form field (button, combobox,
text entry, radio button, slider, checkbox)
g Moves to next graphic
h Moves to next heading of any level
i Moves to next item in an unordered, ordered or
definition list
k Moves to next hyperlink
l Moves to next unordered, ordered or definition list
p Moves to next page tab (in ARIA-enabled web apps)
r Moves to next radio button
s Moves to next separator
t Moves to next data table
x Moves to next checkbox
15ANDROID
TESTING TOOLS
The Android Accessibility
Scanner suggests accessibility
improvements for Android
apps such as enlarging small
touch targets, increasing
contrast and providing content
descriptions.
The Accessibility Scanner is
only compatible with later
versions of Android and can be
accessed via Settings →
Accessibility → Accessibility
Scanner. To run the scanner
open the app and tap the
Accessibility Scanner button.
16ANDROID
GETTING STARTED
iOS accessibility features can be enabled on iOS devices
through Settings → General → Accessibility.
VoiceOver:
Pre-installed iOS screen reader. When enabled, VoiceOver reads
everything on the screen. In mobile Safari, this includes all web content
(text, alternatives for images, links, form fields, tables, and so on). In apps,
this includes all buttons, images, form elements, static text, etc.
Zoom:
A full screen magnifier that scales content by 200 percent when enabled
and the screen is double tapped with three fingers. Magnification can then
be adjusted between 100 and 500 percent. Zoom works throughout iOS as
well as together with VoiceOver when enabled.
Invert Colors:
A high-contrast mode for users with low vision, color blindness, and
sensitivity to brightness. Once enabled settings apply throughout the
system including video.
Grayscale:
This setting removes all color from the display, which can make it easier for
users with vision disabilities, such as color-blindness, to read the display.
iOS
17iOS
ACCESSIBILITY SHORTCUT
You are able to switch the
accessibility features on and off
using triple click on the home
button. To enable this go to
Settings → General →
Accessibility → Accessibility
Shortcut and select the features
(such as VoiceOver) from the list
of options. It is recommended you
do this as it makes testing a lot
quicker and easier as you don’t
have to go into settings each time
to switch VoiceOver on and off.
Figure 3: The accessibility settings panel
shown in iOS8
Figure 4: Accessibility shortcut menu
VOICEOVER
VoiceOver users include blind and
low-vision users, as well as users with
some cognitive or learning difficulties.
To enable VoiceOver, navigate to
Settings → General
→ Accessibility → VoiceOver
Then, touch and slide the white Off
button (beside the word VoiceOver) to
the right to enable VoiceOver. Once in
the On position, the button changes
color to indicate VoiceOver is enabled.
18iOS
THE ROTOR
The Rotor is a virtual control built into
VoiceOver. It allows you to select how you
navigate through a dial format that lists
marked-up elements on screen. It works
with web content as well as native apps.
Figure 5: The Rotor displayed on screen when
VoiceOver is running, showing the “Headings”
options selected
To use the Rotor:
Place two figures on the
screen and twist them
like you’re turning a
dial. The arrow points to
options for how you
wish to navigate (for
example, by headings)
Swipe up or down to
jump between headings
Swipe left or right to
move backward or
forward through all
content on the page
You can customize which features are
included in the Rotor through Settings →
Accessibility → VoiceOver → Rotor.
These features include:
19iOS
VoiceOver Rotor features
Rotor features Description Availability
Audio ducking Switch audio ducking (decreasing
the volume of background noise
when interacting with VoiceOver)
on and off
Web and apps
Braille screen support Shows an on screen Braille keyboard Web
Buttons Navigate between buttons Web
Characters Navigate one character at a time Web and apps
Containers Navigate by containers within a page,
such as lists, landmarks, tables, etc.
Web and apps
Form controls Navigate by form controls Web
Handwriting Fill in text fields by writing on screen Web
Headings Navigate between headings Web and apps
Hints Turn hints on and off Web and apps
Images Navigate images Web
In-page Links Navigate between in-page links Web
Landmarks Navigate between WAI ARIA
Landmarks
Web
Language Switch between supported Web
Links Navigate between links Web
Lists Navigate between lists Web
Lines Navigate line by line Web
Non-visited Links Navigate non-visited links Web
Punctuation Announces all punctuation, some
punctuation, some punctuation
Web and apps
20iOS
Rotor features Description Availability
Same Item Navigate the previous item
Search Fields Navigate search fields Web
Sounds Switch sounds on or off Web and apps
Speech Rate Increase and decrease the speech
rate
Web and apps
Static Text Navigate between static text Web
Tables Navigate between tables Web
Text Fields Navigate between text fields Web
Vertical Navigation Flicking up or down, left or right is
similar to using arrow keys on
desktop
Web and apps
Visited links Navigate between visited links Web
Volume Increase and decrease the volume Web and apps
Words Navigate between words Web and apps
Zoom Switch zoom on and off Web
For testing purposes we recommend that you select at least these features within the Rotor:
nn Buttons
nn Containers
nn Form controls
nn Headings
nn Hints
nn Images
nn Landmarks
nn Links
nn Lists
nn Search fields
nn Static Text
nn Tables
nn Zoom
There is also a Language Rotor that allows users to switch VoiceOver to use different
languages. This setting is important so that second-language users can select English in
the Rotor in order for content to be pronounced correctly.
21iOS
BASIC GESTURES
You may get an alert that VoiceOver changes the gestures used to control the device.
Select OK.
Once you enable VoiceOver, the way you interact with the device changes. There are
two interaction methods:
1.	 Explore by touch:
Drag your finger over the screen to have VoiceOver describe the
items under your finger.
You can tap with a second finger or double-tap to open links,
press buttons, and so on.
2.	 Gesture navigation:
You can swipe right with a single finger to move from one item to
the next in sequence.
You can swipe left to go backward through this sequence.
VoiceOver describes items as you move focus around the screen.
You can double-tap to open links, press buttons, and navigate
using the Rotor.
22iOS
Core VoiceOver commands
These are VoiceOver’s core touch and gesture commands:
Switch VoiceOver on/off
Triple-click
the home key
Speak an element
Single tap
Activate an element
Double tap
Scroll
Flick three fingers
Rotor
Turn a dial with two
fingers
Zoom
Three-finger double tap
Jump to the previous/next Rotor item
Swipe up / down
Select previous / next
Swipe left / right
23iOS
Read all top to bottom/bottom to top
Two-finger swipe
down / up
Next / previous page
Three-finger swipe
right / left
Speak additional information
Three-finger tap
Such as position on
screen, pagination,
position in a table, and
so on
Pass-through gesture
Two-finger tap and
hold
Play / pause media
Two-finger double tap
Audio, video, voice
memos, photos
Screen curtain on / off
Three-finger quadruple
tap
Mute / un-mute VoiceOver
Three-finger triple tap
Tip: A good place to practice VoiceOver gestures is in the VoiceOver
Practice area found in
Settings → General → Accessibility → VoiceOver.
VoiceOver needs to be enabled for the VoiceOver Practice button to appear.
24iOS
SPEECH OFF
You can temporarily mute VoiceOver by double-tapping the screen with three fingers.
SCREEN CURTAIN
Sighted developers and testers can turn off the screen to understand how well content is
communicated when it can’t actually be seen. Turn off the display by triple-tapping the
screen with three fingers. This is an essential feature when testing.
Note: If you have both VoiceOver and Zoom enabled at the same time,
Screen Curtain is enabled with a three-finger quadruple tap. For
accessibility testing, we require running the features in isolation. But it
could be useful to try running the features together on a few screens.
Note: If you have VoiceOver and Zoom enabled at the same time, you can
toggle speech output with a three-finger triple tap. For accessibility testing,
we require running the features in isolation. But it could be useful to try
running the features together on a few screens.
PASS-THROUGH GESTURE
You can use the pass-through gesture to tell VoiceOver to treat the next
gesture as a standard iOS gesture. You can perform the pass-through
gesture by double-tapping the screen and holding down your finger on
the second tap for one second before performing the standard iOS
gesture.
A short audio prompt after you’ve held the second tap for one second
tells you that iOS is ready for you to perform the standard gesture.
For example, to scroll a view, double-tap and hold for one second before swiping left or
right. You can also use the pass-through gesture for drag-and-drop functionality, or to
adjust a slider with more precision than the usual VoiceOver behavior of giving the
slider focus and requiring up and down swipes to adjust the value.
25iOS
ZOOM
People with low vision often use Zoom. Users with cognitive impairments, such as
autism, may also use Zoom to focus in on key content and reduce the amount of visual
clutter on the screen. To enable full screen Zoom, first navigate to the Zoom screen and
select Settings → General → Accessibility → Zoom
Then, touch and slide the white Off button (beside the word Zoom) to the right to enable
Zoom. Once in the On position, the button changes color to indicate Zoom is enabled.
Standard iOS gestures—flick, pinch, tap, and rotor—still work when the screen is magnified.
Invert Colors and Grayscale also work with Zoom. There are some differences in commands
when Zoom is run with VoiceOver: see the VoiceOver Basic Gestures section.
You can view magnified screens either in either “Full Screen Zoom” or “Window Zoom”.
Zoom Commands
Toggle Zoom on/off
Double-tap 3 fingers
Speak an element
Single tap
Activate an element
Double tap
Scroll
Flick three fingers
Rotor
Turn a dial with
two fingers
Jump to the previous/next Rotor item
Swipe up / down
26iOS
Select previous / next
Swipe left / right
Next / previous page
Three-finger swipe
right / left
Speak additional information
Three-finger tap
Such as position on
screen, pagination,
position in a table, and
so on
Pass- through gesture
Two-finger tap and
hold
Play / pause media
Two-finger double tap
Audio, video, voice
memos, photos
Screen curtain on / off
Three-finger
quadruple tap
Mute / un-mute VoiceOver
Three-finger triple tap
27iOS
INVERT COLORS
To enable Invert Colors, first navigate to Settings → General → Accessibility →
Display Accomodations and find Invert Colors in the Vision list.
Then, touch and slide the white Off button (beside the words Invert Colors) to the right to
enable Invert Colors. Once in the On position, the button changes color and display colors
are inverted to indicate Invert Colors is enabled.
The color inversion is applied to all screens until the feature is disabled by sliding the
button to the Off position.
Invert Colors can be used with VoiceOver, Zoom, and Grayscale.
GRAYSCALE
To enable Grayscale, first navigate to Settings → General → Accessibility → Display
Accomodations → Color Filters Accomodations and enable the Color Filters toggle to
view greyscale and other filters.
Then, touch and slide the white Off button (beside the words Grayscale) to the right to
enable Grayscale. Once in the On position, the button changes to dark gray and display
colors are replaced by grayscale colors to indicate Grayscale is enabled.
Grayscale is applied to all screens until the feature is disabled by sliding the button to the
Off position.
Grayscale can be used with VoiceOver, Zoom, and Invert Colors.
TESTING TOOLS
The Accessibility Inspector in Xcode can be used to test for missing or incorrect labels,
traits and hints amongst other things. This can be run in the developer environment or
using the iOS simulator.
28iOS
STANDARDS
CC Section 508 of the US Rehabilitation Act
CC W3C: Web Content Accessibility Guidelines (WCAG) 2.0
CC Draft Information and Communication Technology (ICT)
Standards and Guidelines (2010)
GUIDELINES
CC W3C Mobile Accessibility Task Force extension
CC W3C Note: Mobile Accessibility: How WCAG 2.0 and UAAG 2.0
Apply to Mobile Devices
CC W3C: Techniques for WCAG 2.0
CC WCAG 2.0 Techniques Applicable to Mobile without Changes
CC BBC: Mobile Accessibility Guidelines
CC Mobile Accessibility Guidelines for Developers
RESOURCES
29iOS
ANDROID RESOURCES
CC Accessibility – Android Developers
CC Accessibility – Android Design
CC Android Testing Tools
APPLE RESOURCES
CC Apple Accessibility
CC iOS Human Interface Guidelines
CC iOS Accessibility: Raising the Bar
CC Apple Accessibility Mailing List
CC Accessibility Programming Guide for iOS - A technical introduction to
iOS accessibility features, using its accessibility API to implementing
accessibility in native apps, and testing apps for accessibility.
CC Accessibility on iPhone – A technical introduction to iOS accessibility
features and API.
CC Making Your iPhone Application Accessible – A springboard for
implementing accessibility in native iOS apps.
CC Testing the Accessibility of Your iPhone Application
CC UIAccessibility Protocol Reference – A full reference for iOS’s main
accessibility API methods and properties, a great place to start when
you need to find a way to handle special use cases.
CC UIAccessibilityContainer Protocol – Useful for understanding how to
contain and group interface elements, especially when creating
custom views.
CC UIAccessibilityFocus Protocol – Useful when handling focus, listening
to changes in VoiceOver focus, and so on.
CC Xcode toolset
CC iOS Simulator User Guide
30iOS
ARTICLES AND OTHER RESOURCES
CC WebAIM Articles
CC Georgia Tech Research Institute: Accessibility Assistant:
Accessibility Information
CC Native, HTML5, or Hybrid: Understanding Your Mobile Application
Development Options
CC What’s ‘large text’ in WCAG 2.0 parlance? – Helpful for deciding the
color contrast requirements for text of different sizes.
CC Google I/O 2013 Enabling blind and low-vision accessibility on
Android (video)
CC Google I/O 2012 – Making android apps accessible (video)
CC Testing with Android
CC Accessibility Testing Criteria for Android
CC Browsing the Web with Chrome and TalkBack
CC Browsing the Web with Firefox and TalkBack
CC Learning iOS VoiceOver gestures (PDF) – A cheat sheet that will help
you to remember the gestures used to control VoiceOver.
CC Accessibility for iPhone and iPad apps
31iOS

More Related Content

PPT
I pad 101 2013a
PPTX
U Pointer Detailed Training Manual
PPTX
iPad assistivetouch
PPTX
Native Mobile Testing for Newbies
PPTX
Sony PMW-EX3 Annotation
PPTX
UbiDuo2 SGD training overview - sComm
PPTX
Lesson One Fourth Quarter First Year High School Running A Presentation
PPT
Bling Tutorial
I pad 101 2013a
U Pointer Detailed Training Manual
iPad assistivetouch
Native Mobile Testing for Newbies
Sony PMW-EX3 Annotation
UbiDuo2 SGD training overview - sComm
Lesson One Fourth Quarter First Year High School Running A Presentation
Bling Tutorial

What's hot (18)

PPTX
How to use red eye removal
PPT
How to present ppt presentation
PPTX
Create with google slides
PPTX
ISD8WT_GoogleSlides
PPTX
Mrs. feilbach's google slides on google skills
PPTX
Windows 8.1 Start Screen Features
PPT
foredumed:Smart board tastersession_m-ed 07_16
PPT
Power point tips.pptx eacker
PDF
Remote Desktop App: Splashtop 2 Take a Tour
PPTX
02 unity 3_d_part_1
PPT
Et 5063 week 4 analysis smartboard training
PPTX
Power pointlabs quick tutorial
PPTX
Information Communication Technology
PPTX
Class 6 computer part 4
PPT
Et 5063 week 4 analysis smartboard training
PPT
Et 5063 week 4 analysis smartboard training
PPT
05. Input devices - computer
PPTX
Grade 4 Computer
How to use red eye removal
How to present ppt presentation
Create with google slides
ISD8WT_GoogleSlides
Mrs. feilbach's google slides on google skills
Windows 8.1 Start Screen Features
foredumed:Smart board tastersession_m-ed 07_16
Power point tips.pptx eacker
Remote Desktop App: Splashtop 2 Take a Tour
02 unity 3_d_part_1
Et 5063 week 4 analysis smartboard training
Power pointlabs quick tutorial
Information Communication Technology
Class 6 computer part 4
Et 5063 week 4 analysis smartboard training
Et 5063 week 4 analysis smartboard training
05. Input devices - computer
Grade 4 Computer
Ad

Similar to Mobile Testing Guide iOS and Android 2017 (20)

PPTX
Accessible User Experience Handbook
DOCX
Trabajo en ingles[1]
PDF
Windows 8 brochure
PDF
W8 brochure download
PDF
Meet the New Microsoft Windows 8 - User Guide
PDF
W8 brochure download
PDF
En gb kitkat-1.11
PDF
Windows 8 Tutorial
DOC
Practical File Itm
PDF
Ipad quick-reference-2
PDF
Ipad quick-reference
PPT
Ipods are cool and now they are for school 2010
DOCX
Quickword How To
PDF
Android Design Guidelines 4.0
PDF
Work space additionaltopics pc
DOCX
Quickword How To
DOCX
Quickword How To
DOCX
Quickword How To
DOCX
Quickword How To
DOCX
Quickword How To
Accessible User Experience Handbook
Trabajo en ingles[1]
Windows 8 brochure
W8 brochure download
Meet the New Microsoft Windows 8 - User Guide
W8 brochure download
En gb kitkat-1.11
Windows 8 Tutorial
Practical File Itm
Ipad quick-reference-2
Ipad quick-reference
Ipods are cool and now they are for school 2010
Quickword How To
Android Design Guidelines 4.0
Work space additionaltopics pc
Quickword How To
Quickword How To
Quickword How To
Quickword How To
Quickword How To
Ad

Recently uploaded (20)

PDF
Building Integrated photovoltaic BIPV_UPV.pdf
PDF
MIND Revenue Release Quarter 2 2025 Press Release
PDF
Hindi spoken digit analysis for native and non-native speakers
PPTX
cloud_computing_Infrastucture_as_cloud_p
PDF
Unlocking AI with Model Context Protocol (MCP)
PDF
Enhancing emotion recognition model for a student engagement use case through...
PPTX
Programs and apps: productivity, graphics, security and other tools
PDF
A novel scalable deep ensemble learning framework for big data classification...
PPTX
OMC Textile Division Presentation 2021.pptx
PPTX
Chapter 5: Probability Theory and Statistics
PDF
Heart disease approach using modified random forest and particle swarm optimi...
PDF
From MVP to Full-Scale Product A Startup’s Software Journey.pdf
PDF
ENT215_Completing-a-large-scale-migration-and-modernization-with-AWS.pdf
PPTX
A Presentation on Artificial Intelligence
PDF
A comparative study of natural language inference in Swahili using monolingua...
PDF
gpt5_lecture_notes_comprehensive_20250812015547.pdf
PDF
A comparative analysis of optical character recognition models for extracting...
PPTX
Tartificialntelligence_presentation.pptx
PDF
Univ-Connecticut-ChatGPT-Presentaion.pdf
PDF
Mushroom cultivation and it's methods.pdf
Building Integrated photovoltaic BIPV_UPV.pdf
MIND Revenue Release Quarter 2 2025 Press Release
Hindi spoken digit analysis for native and non-native speakers
cloud_computing_Infrastucture_as_cloud_p
Unlocking AI with Model Context Protocol (MCP)
Enhancing emotion recognition model for a student engagement use case through...
Programs and apps: productivity, graphics, security and other tools
A novel scalable deep ensemble learning framework for big data classification...
OMC Textile Division Presentation 2021.pptx
Chapter 5: Probability Theory and Statistics
Heart disease approach using modified random forest and particle swarm optimi...
From MVP to Full-Scale Product A Startup’s Software Journey.pdf
ENT215_Completing-a-large-scale-migration-and-modernization-with-AWS.pdf
A Presentation on Artificial Intelligence
A comparative study of natural language inference in Swahili using monolingua...
gpt5_lecture_notes_comprehensive_20250812015547.pdf
A comparative analysis of optical character recognition models for extracting...
Tartificialntelligence_presentation.pptx
Univ-Connecticut-ChatGPT-Presentaion.pdf
Mushroom cultivation and it's methods.pdf

Mobile Testing Guide iOS and Android 2017

  • 1. Mobile Testing Guide ANDROID & iOS Version 2, April 2017 The details are correct at the time of writing and based on iOS 9+ and Android 4.4+. Note that new releases on both platforms may mean the details change or are adjusted slightly. Additionally Android features can be inconsistent across devices and versions. The document flags issues where known however there may be further issues.
  • 2. ANDROID 2 Talkback 3 Switch access 10 Auto scanning 11 Magnification gestures 12 Greyscale 13 Browser & Talkback support 14 Testing tools 16 IOS 17 Voiceover 18 The Rotor 19 Basic gestures 22 Screen Curtain 25 Speech Off 25 Pass-through Gesture 25 Zoom 26 Invert colors 28 Grayscale 28 Testing tools 28 RESOURCES 29 Standards & Guidelines 29 Android resources 30 Apple Resources 30 Articles and other resources 31 CONTENTS i
  • 3. GETTING STARTED Android accessibility features can be enabled on Android devices through Settings → Accessibility. ANDROID TalkBack Pre-installed Android screen reader. When enabled, Android reads everything on the screen. In apps, this includes all buttons, images, form elements, static text, etc. In the mobile browser, this should include all web content (text, alternatives for images, links, form fields, tables, and so on). TalkBack users include blind and low-vision users, as well as users with some cognitive or learning difficulties. Switch access Switch access allows you to control your device using configurable key combinations with an external keyboard. You can move focus to clickable items and select an item. Magnification gestures When enabled, magnification allows you to zoom in and out by triple- tapping the screen. Grayscale view When enabled, this setting removes all color from the display, which can make it easier for users with vision disabilities, such as color-blindness, to read the display. 2ANDROID
  • 4. Note: This feature is not universal across devices. For example it does not appear to work on the Hudl running KitKat 4.4.2. TALKBACK To enable TalkBack, navigate to Settings → Accessibility → TalkBack then switch the button to On. A ‘Use TalkBack’ confirmation screen will appear. When used for the first time a tutorial will be launched. Ensure the device volume is turned up as TalkBack doesn’t automatically adjust the volume if muted. You can customize the TalkBack experience through Settings → Accessibility → TalkBack → Settings. Mid-way down the settings screen under the heading “Touch Exploration” ensure that “Explore by touch” is selected, and then launch and complete the “Explore by touch” tutorial. It is recommended you follow the Talkback tutorial accessed mid-way down the settings screen under the heading “Touch Exploration”. Figure 1: The accessibility settings panel shown on a Nexus Tablet Switching Talkback on and off quickly You can map the TalkBack on/off button to the Power key by navigating to Settings → Accessibility → Accessibility shortcut and selecting On. Then you can then switch TalkBack on and off using these two steps: 1. Press and hold the Power button until you hear a sound or feel a vibration. 2. Touch and hold two fingers on the screen until you hear spoken confirmation. If the device has multiple users, using the shortcut on the lock screen temporarily enables accessibility features until the device is unlocked. 3ANDROID
  • 5. Basic gestures on Android Once you enable TalkBack, the way you interact with the device changes. There are two interaction methods: nn Explore by touch: Drag your finger over the screen to have TalkBack describe the items under your finger. You can double tap to open links, press buttons, and so on. When you switch TalkBack on, touch exploration is automatically enabled. nn Gesture navigation: You can swipe right with a single finger to move from one item to the next in sequence. Or you can swipe left to go backward through this sequence. TalkBack describes items as you move focus around the screen. You can double-tap to open links, press buttons, and so on. In some applications, you can zoom by putting two fingers on the screen and pinching them together or pulling them apart. The chart below shows Android’s core touch and gesture commands. All TalkBack gestures use one finger. When you use two or more fingers, your touch or gesture goes straight to the application, rather than to TalkBack. For example, with TalkBack off on most pages you can usually scroll by slowly dragging one finger. With TalkBack on, you can scroll by dragging two fingers. 4ANDROID
  • 6. Speak an element Single tap Scroll Two-finger slide Select next item Swipe right / down Select previous item Swipe left / up Scroll forward Right then left If you’re on a page longer than one screen Move to first item on screen Up then down Move to last item on screen Down then up Scroll back Left then right If you’re on a page longer than one screen Core TalkBack commands Switch TalkBack on/off Press and hold the off button, wait for the vibration then hold two fingers down. Or through Settings → Accessibility → TalkBack Note: This only works if the Accessibility Shortcut has been enabled in the accessibility settings screen 5ANDROID
  • 7. Move slider down Left then right Such as volume Home button Up then left Back button Down then left Recent apps Left then up Notifications Right then down Open local context menu Up then right Open global context menu Down then right Zoom One-finger triple tap Built in screen magnification, when enabled 6ANDROID This isn’t considered necessary for testing, but you can assign new actions to the gestures through Settings → Accessibility → TalkBack → Settings → Manage gestures.
  • 8. TalkBack global context menu features The following explains features available in the global context menu. Quick navigation Hear all of the items on the screen as you move your finger in a circle. This option isn’t available if you’re using the list version of the context menu instead of the circle version (by enabling “Show Context Menu as list” in TalkBack settings). Read from top Hear a read-out of all items on the screen, starting from the top. Read last utterance Hear the last verbalization again. Spell last utterance Hear a letter-by-letter spelling of TalkBack’s last verbalization. Read from next item Hear a read-out of all items on the screen, starting from the last focused item. TalkBack settings This option is outside the circle menu, at the top-right corner of your screen. Selecting this option opens the TalkBack settings screen. Text to speech settings This option is outside the circle menu, at the bottom-right corner of your screen. Selecting this option opens your text-to- speech settings. You can disable TalkBack or dim the screen from here. Using the global context menu Swipe down then right to open the menu Drag your finger to hear menu items. When you hear the item that you’d like to select, release your finger. Context menus TalkBack has a global context menu and a local context menu to make it easy to find settings and controls. The global context menu contains commands that work anywhere, and the local context menu varies depending on the focused item. On older versions, the global and local context menus are shaped like circles, so you can drag your finger in a circle to hear the different options. On Android 5+ they are presented as lists. 7ANDROID
  • 9. Local context menu The local context menu contains controls that relate to the focused item. The options available in the menu change depending on the item. If there are no relevant options, TalkBack announces ‘No menu items’. TalkBack local context menu features The following explains features available in the local context menu. Default Each swipe to the right reads the content of the focused item. Characters Each swipe to the right speaks one character of the currently focused item. Words Each swipe to the right speaks one word of the currently focused item. Lines Each swipe to the right speaks a single line of the currently focused item. Paragraph Each swipe to the right speaks one paragraph of the currently focused item. Page Each swipe to the right speaks all of the items on the current page. Alternative TalkBack local context menu features When you activate the local context menu from screens other than your home screen, you might hear the features in the following table. Page navigation Open a new local context menu with options for moving to the next or previous page. Using the local context menu Swipe up then right to open the local context menu. Drag your finger in a circle to hear menu items. When you hear the item that you’d like to select, release your finger. 8ANDROID
  • 10. Cursor control menu Open a new local context menu with options for moving the cursor and editing text. Options in the cursor control menu include: nn Move cursor to beginning and move cursor to end nn Cut, Copy, Paste, Select all nn Start selection mode and End selection mode. To move the cursor while in an edit box, you can tap the volume keys. Links menu When you navigate to text that contains links, you can open the local context menu, and select the Links submenu to select one of the links included in the text. Word Each swipe to the right speaks one word of the currently focused item. Change granularity menu Select this option to open a new local context menu with the navigation granularity options listed above (Default, Page, Paragraph, Line, Word and Character). In certain apps (such as web browsers), you may also see options to navigate by Headings and Landmarks, Links, Lists, Controls and Special Content, e.g. tables). Label controls This menu allows you to add, remove, and edit customized labels for unlabeled content. Sometimes applications are missing labels on images. You can use TalkBack to create your own labels for these images, to make it easier to identify them in the future. Figure 2: The global context menu displayed on screen when TalkBack is running 9ANDROID
  • 11. Screen blanking With TalkBack 4.2 and later, there is an option to dim/undim the screen from the Global Context menu. For older devices you can download the free Android app Shades to accomplish the same thing. This is a useful technique for testing since it allows the tester to have a similar experience to users who can’t see the screen. CC To blank the screen, run Shades and turn down the screen-brightness slider to 0. CC To un-blank the screen and bring it back to full brightness, press the power button rapidly several times—that’s the trigger to disable Shades. SWITCH ACCESS To enable switch access, navigate to Settings → Accessibility → Switch access and then switch the button to On. Switch access allows you to control your device using configurable key combinations. This means you can use an external keyboard or switch device to execute core keyboard commands to navigate and interact with websites and native apps. As with the use of TalkBack, this is a useful feature for testing keyboard access and content order. To use switch access, you’ll need a keyboard paired with the tablet or mobile. Then you’ll need to assign keys to actions through Settings → Accessibility → Switch access → Settings. Select Actions under the heading “Assign Keys to Actions” to map a keystroke to the action. 10ANDROID
  • 12. Recommended keystroke mappings While keystroke mappings depend on user preference, we recommend (for consistency) that test teams use the same keystrokes, as shown in the table below. Global context menu features Description Auto scanning Space bar (this is already mapped) Next Tab Previous Shift + Tab Click Enter Long click Semi colon (;) Scroll forward Right arrow Scroll backwards Left arrow Back Delete Home Escape Notifications Equals (=) Quick settings Down arrow Recent apps Up arrow AUTO SCANNING Auto scanning is a feature that moves focus automatically through all visible elements on screen, both focusable and inactive (for example, static text). Once all visible content has been auto scanned, the user is presented with five additional auto scan options: 1. Back 2. Home 3. Recent apps 4. Notifications 5. Quick navigation This is a useful tool for testing content and focus order. 11ANDROID
  • 13. 2. You can also temporarily magnify what’s under your finger by triple-tapping and holding. In this magnified state, you can drag your finger to explore different parts of the screen. Lift your finger to return to your previous state. MAGNIFICATION GESTURES To enable Zoom, navigate to Settings → Accessibility → Magnification Gestures then switch the button to On. When magnification gestures are enabled, you can zoom, pan across the screen and pan content: 1. Zoom in or out by triple-tapping the screen. Then, while zoomed in, you can: Drag two or more fingers to pan across the screen. Pinch two or more fingers together or spread them apart to adjust the zoom level. Note: If you enter or exit an app when zoomed in, you automatically zoom out. Simply triple-tap to zoom in again. Note: Triple-tap for magnification works everywhere except the keyboard and navigation bar. 12ANDROID
  • 14. GREYSCALE To enable Android’s grayscale view, first enable Developer Mode on your device. (This is a one-time process for each device.) 1. Go to Settings → About Tablet (which might also be labeled About Phone or About Device). 2. Locate the Build number section, and tap on the phrase “Build number” 7 times. 3. Go back to the main Settings page and tap on Developer Options. 4. Enable the Developer Options switch. From then on, you can enable Android ’s grayscale view (Lollipop 5.0 onwards) by going to Settings → Developer Options → Simulate color space and selecting “Monochromacy.” Once you’ve made that selection, display colors will be replaced by shades of gray. Grayscale is applied to all screens until you turn off the feature, which you can do by going back to Settings → Developer Options → Simulate color space and selecting “Disabled.” Android ’s grayscale view can be used alongside any of Android’s other modes or applications, including TalkBack and Shade, among others. 13ANDROID
  • 15. BROWSER AND TALKBACK SUPPORT The native Android browser, Chrome, has basic support for web browsing with TalkBack. This means that some of the newer techniques found in WAI ARIA or HTML5 may not be compatible and may not be announced correctly by TalkBack if you were to use it with Chrome. Firefox for Android has better support for WAI ARIA and HTML5 as well as more robust support for core HTML such as headings, WAI ARIA Landmarks, data tables and so on. So we recommend testing on Firefox for Android. Ideally, the best web development practice is to use core HTML where possible and only use WAI ARIA and HTML5 where functionality can’t be achieved though core HTML. Where WAI ARIA and HTML5 must be used, keep in mind that while they may not be fully supported in Chrome with TalkBack, that support may exist elsewhere: 1. Firefox on Android 2. Other platforms such as iOS 3. Future versions of Chrome on Android Navigating Firefox Firefox uses the three-finger swipe to navigate elements. A three-finger swipe up or down cycles between the options listed below. nn List items (not lists) nn Links nn Headings nn Form elements (edit boxes, checkboxes, buttons...) nn Landmarks A three-finger swipe left or right moves up or down the page by the selected element: The consistenty of this feature may vary across devices and versions. For example, three- finger gestures do not appear to work on the Hudl running KitKat 4.4.2. 14ANDROID
  • 16. Firefox quick-navigation keystrokes that work with TalkBack Firefox supports quick navigation keys with TalkBack. These work with a physical keyboard, a Bluetooth keyboard connected to your Android device, or the Eyes-Free keyboard in typing mode. Keystrokes will only work when focus is in the HTML and not on the browser UI or in a text field. Key Description a Moves to next named anchor b Moves to next button c Moves to next combobox or listbox e Moves to next text entry or password field f Moves to next form field (button, combobox, text entry, radio button, slider, checkbox) g Moves to next graphic h Moves to next heading of any level i Moves to next item in an unordered, ordered or definition list k Moves to next hyperlink l Moves to next unordered, ordered or definition list p Moves to next page tab (in ARIA-enabled web apps) r Moves to next radio button s Moves to next separator t Moves to next data table x Moves to next checkbox 15ANDROID
  • 17. TESTING TOOLS The Android Accessibility Scanner suggests accessibility improvements for Android apps such as enlarging small touch targets, increasing contrast and providing content descriptions. The Accessibility Scanner is only compatible with later versions of Android and can be accessed via Settings → Accessibility → Accessibility Scanner. To run the scanner open the app and tap the Accessibility Scanner button. 16ANDROID
  • 18. GETTING STARTED iOS accessibility features can be enabled on iOS devices through Settings → General → Accessibility. VoiceOver: Pre-installed iOS screen reader. When enabled, VoiceOver reads everything on the screen. In mobile Safari, this includes all web content (text, alternatives for images, links, form fields, tables, and so on). In apps, this includes all buttons, images, form elements, static text, etc. Zoom: A full screen magnifier that scales content by 200 percent when enabled and the screen is double tapped with three fingers. Magnification can then be adjusted between 100 and 500 percent. Zoom works throughout iOS as well as together with VoiceOver when enabled. Invert Colors: A high-contrast mode for users with low vision, color blindness, and sensitivity to brightness. Once enabled settings apply throughout the system including video. Grayscale: This setting removes all color from the display, which can make it easier for users with vision disabilities, such as color-blindness, to read the display. iOS 17iOS
  • 19. ACCESSIBILITY SHORTCUT You are able to switch the accessibility features on and off using triple click on the home button. To enable this go to Settings → General → Accessibility → Accessibility Shortcut and select the features (such as VoiceOver) from the list of options. It is recommended you do this as it makes testing a lot quicker and easier as you don’t have to go into settings each time to switch VoiceOver on and off. Figure 3: The accessibility settings panel shown in iOS8 Figure 4: Accessibility shortcut menu VOICEOVER VoiceOver users include blind and low-vision users, as well as users with some cognitive or learning difficulties. To enable VoiceOver, navigate to Settings → General → Accessibility → VoiceOver Then, touch and slide the white Off button (beside the word VoiceOver) to the right to enable VoiceOver. Once in the On position, the button changes color to indicate VoiceOver is enabled. 18iOS
  • 20. THE ROTOR The Rotor is a virtual control built into VoiceOver. It allows you to select how you navigate through a dial format that lists marked-up elements on screen. It works with web content as well as native apps. Figure 5: The Rotor displayed on screen when VoiceOver is running, showing the “Headings” options selected To use the Rotor: Place two figures on the screen and twist them like you’re turning a dial. The arrow points to options for how you wish to navigate (for example, by headings) Swipe up or down to jump between headings Swipe left or right to move backward or forward through all content on the page You can customize which features are included in the Rotor through Settings → Accessibility → VoiceOver → Rotor. These features include: 19iOS
  • 21. VoiceOver Rotor features Rotor features Description Availability Audio ducking Switch audio ducking (decreasing the volume of background noise when interacting with VoiceOver) on and off Web and apps Braille screen support Shows an on screen Braille keyboard Web Buttons Navigate between buttons Web Characters Navigate one character at a time Web and apps Containers Navigate by containers within a page, such as lists, landmarks, tables, etc. Web and apps Form controls Navigate by form controls Web Handwriting Fill in text fields by writing on screen Web Headings Navigate between headings Web and apps Hints Turn hints on and off Web and apps Images Navigate images Web In-page Links Navigate between in-page links Web Landmarks Navigate between WAI ARIA Landmarks Web Language Switch between supported Web Links Navigate between links Web Lists Navigate between lists Web Lines Navigate line by line Web Non-visited Links Navigate non-visited links Web Punctuation Announces all punctuation, some punctuation, some punctuation Web and apps 20iOS
  • 22. Rotor features Description Availability Same Item Navigate the previous item Search Fields Navigate search fields Web Sounds Switch sounds on or off Web and apps Speech Rate Increase and decrease the speech rate Web and apps Static Text Navigate between static text Web Tables Navigate between tables Web Text Fields Navigate between text fields Web Vertical Navigation Flicking up or down, left or right is similar to using arrow keys on desktop Web and apps Visited links Navigate between visited links Web Volume Increase and decrease the volume Web and apps Words Navigate between words Web and apps Zoom Switch zoom on and off Web For testing purposes we recommend that you select at least these features within the Rotor: nn Buttons nn Containers nn Form controls nn Headings nn Hints nn Images nn Landmarks nn Links nn Lists nn Search fields nn Static Text nn Tables nn Zoom There is also a Language Rotor that allows users to switch VoiceOver to use different languages. This setting is important so that second-language users can select English in the Rotor in order for content to be pronounced correctly. 21iOS
  • 23. BASIC GESTURES You may get an alert that VoiceOver changes the gestures used to control the device. Select OK. Once you enable VoiceOver, the way you interact with the device changes. There are two interaction methods: 1. Explore by touch: Drag your finger over the screen to have VoiceOver describe the items under your finger. You can tap with a second finger or double-tap to open links, press buttons, and so on. 2. Gesture navigation: You can swipe right with a single finger to move from one item to the next in sequence. You can swipe left to go backward through this sequence. VoiceOver describes items as you move focus around the screen. You can double-tap to open links, press buttons, and navigate using the Rotor. 22iOS
  • 24. Core VoiceOver commands These are VoiceOver’s core touch and gesture commands: Switch VoiceOver on/off Triple-click the home key Speak an element Single tap Activate an element Double tap Scroll Flick three fingers Rotor Turn a dial with two fingers Zoom Three-finger double tap Jump to the previous/next Rotor item Swipe up / down Select previous / next Swipe left / right 23iOS
  • 25. Read all top to bottom/bottom to top Two-finger swipe down / up Next / previous page Three-finger swipe right / left Speak additional information Three-finger tap Such as position on screen, pagination, position in a table, and so on Pass-through gesture Two-finger tap and hold Play / pause media Two-finger double tap Audio, video, voice memos, photos Screen curtain on / off Three-finger quadruple tap Mute / un-mute VoiceOver Three-finger triple tap Tip: A good place to practice VoiceOver gestures is in the VoiceOver Practice area found in Settings → General → Accessibility → VoiceOver. VoiceOver needs to be enabled for the VoiceOver Practice button to appear. 24iOS
  • 26. SPEECH OFF You can temporarily mute VoiceOver by double-tapping the screen with three fingers. SCREEN CURTAIN Sighted developers and testers can turn off the screen to understand how well content is communicated when it can’t actually be seen. Turn off the display by triple-tapping the screen with three fingers. This is an essential feature when testing. Note: If you have both VoiceOver and Zoom enabled at the same time, Screen Curtain is enabled with a three-finger quadruple tap. For accessibility testing, we require running the features in isolation. But it could be useful to try running the features together on a few screens. Note: If you have VoiceOver and Zoom enabled at the same time, you can toggle speech output with a three-finger triple tap. For accessibility testing, we require running the features in isolation. But it could be useful to try running the features together on a few screens. PASS-THROUGH GESTURE You can use the pass-through gesture to tell VoiceOver to treat the next gesture as a standard iOS gesture. You can perform the pass-through gesture by double-tapping the screen and holding down your finger on the second tap for one second before performing the standard iOS gesture. A short audio prompt after you’ve held the second tap for one second tells you that iOS is ready for you to perform the standard gesture. For example, to scroll a view, double-tap and hold for one second before swiping left or right. You can also use the pass-through gesture for drag-and-drop functionality, or to adjust a slider with more precision than the usual VoiceOver behavior of giving the slider focus and requiring up and down swipes to adjust the value. 25iOS
  • 27. ZOOM People with low vision often use Zoom. Users with cognitive impairments, such as autism, may also use Zoom to focus in on key content and reduce the amount of visual clutter on the screen. To enable full screen Zoom, first navigate to the Zoom screen and select Settings → General → Accessibility → Zoom Then, touch and slide the white Off button (beside the word Zoom) to the right to enable Zoom. Once in the On position, the button changes color to indicate Zoom is enabled. Standard iOS gestures—flick, pinch, tap, and rotor—still work when the screen is magnified. Invert Colors and Grayscale also work with Zoom. There are some differences in commands when Zoom is run with VoiceOver: see the VoiceOver Basic Gestures section. You can view magnified screens either in either “Full Screen Zoom” or “Window Zoom”. Zoom Commands Toggle Zoom on/off Double-tap 3 fingers Speak an element Single tap Activate an element Double tap Scroll Flick three fingers Rotor Turn a dial with two fingers Jump to the previous/next Rotor item Swipe up / down 26iOS
  • 28. Select previous / next Swipe left / right Next / previous page Three-finger swipe right / left Speak additional information Three-finger tap Such as position on screen, pagination, position in a table, and so on Pass- through gesture Two-finger tap and hold Play / pause media Two-finger double tap Audio, video, voice memos, photos Screen curtain on / off Three-finger quadruple tap Mute / un-mute VoiceOver Three-finger triple tap 27iOS
  • 29. INVERT COLORS To enable Invert Colors, first navigate to Settings → General → Accessibility → Display Accomodations and find Invert Colors in the Vision list. Then, touch and slide the white Off button (beside the words Invert Colors) to the right to enable Invert Colors. Once in the On position, the button changes color and display colors are inverted to indicate Invert Colors is enabled. The color inversion is applied to all screens until the feature is disabled by sliding the button to the Off position. Invert Colors can be used with VoiceOver, Zoom, and Grayscale. GRAYSCALE To enable Grayscale, first navigate to Settings → General → Accessibility → Display Accomodations → Color Filters Accomodations and enable the Color Filters toggle to view greyscale and other filters. Then, touch and slide the white Off button (beside the words Grayscale) to the right to enable Grayscale. Once in the On position, the button changes to dark gray and display colors are replaced by grayscale colors to indicate Grayscale is enabled. Grayscale is applied to all screens until the feature is disabled by sliding the button to the Off position. Grayscale can be used with VoiceOver, Zoom, and Invert Colors. TESTING TOOLS The Accessibility Inspector in Xcode can be used to test for missing or incorrect labels, traits and hints amongst other things. This can be run in the developer environment or using the iOS simulator. 28iOS
  • 30. STANDARDS CC Section 508 of the US Rehabilitation Act CC W3C: Web Content Accessibility Guidelines (WCAG) 2.0 CC Draft Information and Communication Technology (ICT) Standards and Guidelines (2010) GUIDELINES CC W3C Mobile Accessibility Task Force extension CC W3C Note: Mobile Accessibility: How WCAG 2.0 and UAAG 2.0 Apply to Mobile Devices CC W3C: Techniques for WCAG 2.0 CC WCAG 2.0 Techniques Applicable to Mobile without Changes CC BBC: Mobile Accessibility Guidelines CC Mobile Accessibility Guidelines for Developers RESOURCES 29iOS
  • 31. ANDROID RESOURCES CC Accessibility – Android Developers CC Accessibility – Android Design CC Android Testing Tools APPLE RESOURCES CC Apple Accessibility CC iOS Human Interface Guidelines CC iOS Accessibility: Raising the Bar CC Apple Accessibility Mailing List CC Accessibility Programming Guide for iOS - A technical introduction to iOS accessibility features, using its accessibility API to implementing accessibility in native apps, and testing apps for accessibility. CC Accessibility on iPhone – A technical introduction to iOS accessibility features and API. CC Making Your iPhone Application Accessible – A springboard for implementing accessibility in native iOS apps. CC Testing the Accessibility of Your iPhone Application CC UIAccessibility Protocol Reference – A full reference for iOS’s main accessibility API methods and properties, a great place to start when you need to find a way to handle special use cases. CC UIAccessibilityContainer Protocol – Useful for understanding how to contain and group interface elements, especially when creating custom views. CC UIAccessibilityFocus Protocol – Useful when handling focus, listening to changes in VoiceOver focus, and so on. CC Xcode toolset CC iOS Simulator User Guide 30iOS
  • 32. ARTICLES AND OTHER RESOURCES CC WebAIM Articles CC Georgia Tech Research Institute: Accessibility Assistant: Accessibility Information CC Native, HTML5, or Hybrid: Understanding Your Mobile Application Development Options CC What’s ‘large text’ in WCAG 2.0 parlance? – Helpful for deciding the color contrast requirements for text of different sizes. CC Google I/O 2013 Enabling blind and low-vision accessibility on Android (video) CC Google I/O 2012 – Making android apps accessible (video) CC Testing with Android CC Accessibility Testing Criteria for Android CC Browsing the Web with Chrome and TalkBack CC Browsing the Web with Firefox and TalkBack CC Learning iOS VoiceOver gestures (PDF) – A cheat sheet that will help you to remember the gestures used to control VoiceOver. CC Accessibility for iPhone and iPad apps 31iOS