A11y camp 2018 - Dos and Don't when building an accessible app

Dos and don’ts
when building an
accessible app
Amir Ansari and Kira Eviston

2
Kira EvistonWho are we?
Senior User Experience Consultant
12 years’ in the design industry and
eight of those years as a marketing
professional.
Amir Ansari
Head of User Experience
21 years’ experience in the field of
design, both as a Practitioner and
Manager.
INTRODUCTION
amir_ansari kira_eviston transpire
amir_ansari kira_eviston
A11y Camp 2018

amir_ansari kira_eviston transpire
creating digital experiences that
transform and inspire
3 A11y Camp 2018
INTRODUCTION

INTRODUCTION
4 amir_ansari kira_eviston transpireA11y Camp 2018
The reality when building
accessible apps
Dos and Don'ts
Resources

6 amir_ansari kira_eviston transpire
Scope
Least important Most important
Time
Budget
Accessibility
A11y Camp 2018

Scope
Time
Budget
Accessibility
A11y Camp 2018

Scope
Time
Budget
Accessibility is no longer a line item

Create your minimum
accessible level
DO

Baseline accessibility
acceptance criteria
● Colour contrast
○ Small text: at least 4.5:1 against its background
○ Large text (at 14 pt bold/18 pt regular and up):
at least 3:1
○ Icons: at least 4.5:1 contrast
● Screens have been uploaded and checked via Chrome
extension: Funkify
1
0
11
DO: Create your minimum accessible level
● No autoplay /continuous (flashing speed slow)
● Touch target - Android: 48x48 dp iOS: 44x44 pt
○ Sit 8dp away from another touch state
○ Labelled to allow for screen readers and assistive
technology on all read parts of the interface.
● Dynamic fonts / adjusting containers
● Complimentary text and images groupings
● Image alt text
A11y Camp 2018

DON’T
Assume baseline acceptance
criteria will be used

DON'T: Assume baseline acceptance criteria will be used
1
0

1
0
● Touch targets: Android: 48x48 dp | iOS: 44x44 pt | 8dp away from other
touch states
● Colour contrast: 4.5:1 minimum
● VoiceOver to announce: “Check-in” - Button

1
0

DO
Test with a wide range of
user types

The difference in
finding the right
partner...
1
0
Total of 5 participants with impairments - 1 per session:
● 2 participants with vision impairments (not short or long
sighted) or totally blind who use their phone’s
accessibility features (such as Talk Back or Voice Over) or
text / screen magnification.
● 2 with physical impairments (limited finger/hand
dexterity or range of motion) such as MS, Parkinson's.
● 1 with cognitive impairment (if possible).
DO: Test with a wide range of user types

An aha moment
1
0
DO: Test with a wide range of user types

DON’T
Shy away from challenging
brand guidelines

DON'T: Shy away from challenging brand guidelines
Before
1
0
After Before After Before After
3.3 : 1 5.4 : 1 1.9 : 1 5.1 : 1 1.9 : 1 3.7 : 1
Airline Bank Not-for-profit
# # # # # #

1
0
Custom font
Custom font
Why use system fonts:
● Readability
● Optimised for smaller screens
● Trusted and tried rendering weights
● Dynamic text size support
DON'T: Shy away from challenging brand guidelines

DO
Think of accessibility at a
screen level

DO: Think of accessibility at a screen level
1
0

DON’T
Let accessibility training slip
with your team

261
0
Training hubs
● Apple WWDC recordings and Tech Talks
https://www.apple.com/au/accessibility/
● Android Guidelines:
https://support.google.com/accessibility/android/
● Web Content Accessibility Guidelines (WCAG) 2.1
https://www.w3.org/TR/WCAG21/
● Apps for All
https://www.appsforall.com.au/
DON’T: Let accessibility training slip with your team

Gestures are
everything
1
0
● Without shortcuts, you’re in trouble!
● Phone form factor changes accessibility
gestures (e.g. iPhone’s removal of physical
home button)
● Users use diverse gestures to suit their
needs (e.g. two finger scrub, rotor, curtains)
DON’T: Let accessibility training slip with your team

To announce or not to
announce…
That is the question!
DO: Discuss and disagree
1
0

Colour Contrast
Tools for designers
Accessibility scanner
app
Resources
Appsforall.com.au
Tips for all members
of a product team on
what their
responsibility is.
Platform
Guidelines
Google Material
Guidelines
Apple Human
Centred Guidelines
For Android, scans your
app and tells you all the
accessibility issues.
Colour Contrast
Analyzer
Funkify Chrome
extension
1
0
3131 A11y Camp 2018 amir_ansari kira_eviston transpire
Resources

Final
takeaways
1
0
● Start somewhere - building an accessible app
is an evolution.
● It’s OK to get it wrong. Good, better, best.
● Showcase the impact being accessible has.
● Don’t underestimate the benefits of grouping
and going the extra mile.
● Keep up the conversation.
A11y Camp 2018

amir_ansari
kira_eviston
transpire
Thank you
Do the best you can until
you know better. Then
when you know better, do
better.
Maya Angelou

A11y camp 2018 - Dos and Don't when building an accessible app

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie A11y camp 2018 - Dos and Don't when building an accessible app

Ähnlich wie A11y camp 2018 - Dos and Don't when building an accessible app (20)

Mehr von Amir Ansari

Mehr von Amir Ansari (16)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

A11y camp 2018 - Dos and Don't when building an accessible app