An introduction to mobile accessibility for Mobile Monday, June 11, 2012

1. Inclusive
and
Accessible
Mobile
#MobA11y
Henny
Swan
Senior
Usability
and
Accessibility
Specialist,
BBC
henny@iheni.com

2. Mobile
and
Diverse
user
model,
age,
technology,
accessibility
temporary
Mobile
is
by
defini9on
disabling
Mobile
is
by
defini9on
enabling
USA
21st
Century
Communica9ons
and
Video
Act
‘There
are
62
million
poten9ally
disabled
users
in
the
UK’
Gareth
Ford
Williams,
BBC

3. Mobile
Accessibility
Guidelines
&
techniques
Coming
soon

4. 1.
Support
device
capabiliEes
Content
must
not
break
device
accessibility
Web
and
plaKorm
specific
controls
should
be
used
as
intended
Accessibility
features
must
be
implemented
in
a
way
that
is
not
mutually
exclusive
Device
specific
guidelines
should
be
followed
Device
capability

5. 2.
AlternaEves
Provide
alterna9ves
for
content
and
func9onality:
HTML:
alt=“Description”!
iOS:
labels,
hints and
traits!
Android:
android:contentDescription!
Hide
non
content
and
func9onality
objects:
HTML:
alt=“”!
iOS
do
not
‘Enable
Accessibility’
Android
do
not
make
focusable
via
android:focusable !
Provide
appropriate
editorial
Alterna9ves

6. 3.
NavigaEon
Provide
consistent,
recognisable
naviga9on
Group
related
links:
Tabindex=“-1”not
supported
a
single
link
ahref
is
supported
Remove
skip
links
on
touch
and
mobile
Links

7. Provide
a
logical
focus
order
and
content
order
4.
Structure
Use
headings
(H1
to
H6),
WAI
ARIA
Landmarks,
HTML5
sec9oning
elements
‘Accordion’
structure
from
desktop
to
mobile
Structure

8. Desktop
www.smashingmagazine.com
Structure

9. Main
naviga9on
packed
away
Mobile
Banner,
naviga9on
landmarks
can
be
removed
Heading
structure
collapsed
Structure

10. 5.
Touch
Visual
cues
to
help
users
navigate
BBC
iPhone
app
for
iPlayer
Audible
cues
for
voice
output
users
‘BBC
Two'
No9fy
screen
readers
of
changes
to
layout
Provide
enough
‘read-­‐tap
symmetry’
Touch
targets
should
be
large
enough
Touch

11. Talk
is
cheap
Screen
reader
tes9ng
on
mobile

12. There
is
no
subs9tute
for
tes9ng
with
users
with
disabili9es
on
mobile

13. Thank
you
henny@iheni.com