Are you our next client? Contact us at george@goodwally.ca
George Zamfir & Billy Gregory - Good Wally
Good Wally is a digital accessibility consulting firm based in Toronto, Canada.
This presentation was delivered at:
- Accessibility Conference in Guelph, May 2013
- CSUN in San Diego, March 2014
Practical tips on how to ask for and get accessible web products from your web agency. We are drawing from our experience of working with web agencies (to deliver web products to clients) and with clients outsourcing web projects to agencies.
In the last few years it has become apparent that organizations are more aware of the accessibility requirements. Not surprising, this responsibility has started to transfer to the web projects outsourced to web agencies as well. For both parties the responsibility to deliver accessible web products is becoming more and more visible.
This shared responsibility can be viewed as added pressure or as a competitive advantage. Either way we can use this to our users' advantage and we are here to discuss how.
Contact Information:
George Zamfir: twitter.com/good_wally - george@goodwally.ca - www.goodwally.ca
Billy Gregory: twitter.com/thebillygregory
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
How to win the accessibility 3-legged race
1. Insider information!
How to get the most accessibility
from your web agency
Wednesday, 29 May, 13
Photo:
h'p://mlp.wikia.com/wiki/File:The_3_legged_race_S3E8.png
2. (or in other words)
How to win the
accessibility 3-legged race
Wednesday, 29 May, 13
Photo:
h'p://mlp.wikia.com/wiki/File:The_3_legged_race_S3E8.png
3. goodwally.ca 🌎 @good_wally
How to win the
accessibility 3-legged race
HI@goodwally.ca
#accessconf accessconf.ca
George Billy
Wednesday, 29 May, 13
4. Accessibility solutioneer at Good Wally
goodwally.ca
twitter.com/good_wally
George - Accessibility Solutioneer - Good Wally
George Zamfir
Accessibility consultant at Scotiabank slideshare.net/GeorgeZamfir
Co-organizer at Toronto
Accessibility and Inclusive
Design meetup group
meetup.com/a11yTO
Wednesday, 29 May, 13
5. goodwally.ca 🌎 @good_wally
In my spare time...
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
dance
at
weddings
-‐
SUCCESSFULLY
jump
off
cliffs
-‐
in
the
wedding
tux
I
drink
my
tea
out
of
beer
mugs
6. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
dance
at
weddings
-‐
SUCCESSFULLY
jump
off
cliffs
-‐
in
the
wedding
tux
I
drink
my
tea
out
of
beer
mugs
7. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
dance
at
weddings
-‐
SUCCESSFULLY
jump
off
cliffs
-‐
in
the
wedding
tux
I
drink
my
tea
out
of
beer
mugs
8. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
dance
at
weddings
-‐
SUCCESSFULLY
jump
off
cliffs
-‐
in
the
wedding
tux
I
drink
my
tea
out
of
beer
mugs
9. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
dance
at
weddings
-‐
SUCCESSFULLY
jump
off
cliffs
-‐
in
the
wedding
tux
I
drink
my
tea
out
of
beer
mugs
10. Accessibility solutioneer at Good Wally
goodwally.ca
twitter.com/good_wally
George - Accessibility Solutioneer - Good Wally
Billy Gregory
Member of “Team Canada” in the
Knowbility 2012 Open Air Competition
slideshare.net/BillyGeek
Front-end developer with over 5 years
experience writing accessible code
Wednesday, 29 May, 13
11. goodwally.ca 🌎 @good_wally
In my spare time...
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
am
a
recovering
rap
metal
singer
I
have
two
awesome
daughters
that
like
to
dress
up
as
zombies
I
have
been
to
the
future...
and
I
look
amazing
12. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
am
a
recovering
rap
metal
singer
I
have
two
awesome
daughters
that
like
to
dress
up
as
zombies
I
have
been
to
the
future...
and
I
look
amazing
13. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
am
a
recovering
rap
metal
singer
I
have
two
awesome
daughters
that
like
to
dress
up
as
zombies
I
have
been
to
the
future...
and
I
look
amazing
14. goodwally.ca 🌎 @good_wally
Wednesday, 29 May, 13
HOWEVER,
In
my
spare
2me...
I
am
a
recovering
rap
metal
singer
I
have
two
awesome
daughters
that
like
to
dress
up
as
zombies
I
have
been
to
the
future...
and
I
look
amazing
15. Let us help you with the handshake
Wednesday, 29 May, 13
We’re here to help you make that handshake happen!
Photo: http://imgur.com/gallery/CRUvO
16. Let us help you with the handshake
Wednesday, 29 May, 13
We’re here to help you make that handshake happen!
Photo: http://imgur.com/gallery/CRUvO
17. How to win the accessibility 3-legged race
Agenda
How to win the accessibility 3-legged race
1. Set yourself up for success with accessibility
2. Create a strategy and stick to it
3. Be realistic about your team's accessibility knowledge
4. Use them testing tools AND test with users
5. Always be closing
Round-the-room discussion
Moderated discussion on our collective experiences
Wednesday, 29 May, 13
18. “Oh yes, it's keyboard accessible!
To open the menu press
Ctrl-Shift-Alt-F2-W-O-O-T!”
Wednesday, 29 May, 13
Photo: http://www.theregister.co.uk/2011/04/08/osborne_1_teardown/page2.html
19. “On our website we sell [product X]. Blind people don’t
use our product so, they don’t visit our site!”
Wednesday, 29 May, 13
Photo: http://www.flickr.com/photos/evilaugust/3255600143/
20. “Accessible websites are ugly”
Wednesday, 29 May, 13
Photo: http://www.twcenter.net/forums/showthread.php?535883-Total-War-Battles-SHOGUN-out-and-Rally-Point-Episode-
One-live!/page3
21. So is your website accessible or not?
"Accessibility is not only an issue of basic
human rights, but also one of citizenship. In
recognition of this, and to commemorate the
International Day of Persons with Disabilities,
the [awesome organization]... We are taking
part in a global Disability Community
Involvement Initiative launched in association
with leading advocacy groups for the disabled."
Wednesday, 29 May, 13
22. So is your website accessible or not?
Wednesday, 29 May, 13
23. 1. Set yourself up for success with
accessibility
Early, in that planning / budget phase.
Wednesday, 29 May, 13
24. "We can make it accessible. And WCAG 2 AAAA
compliant. And Section 508. W3C-validated. And ponies.”
Wednesday, 29 May, 13
25. 1. Set yourself up for success with accessibility
Agency
• "We need an accessible website" is not a good
requirement.
• Take it one step further, try to read between the
lines. Is accessibility a legal requirement for the
client? Do they have corporate buy-in?
• Hint: What if you're the only agency who is
successful in delivering accessible web products?
Wednesday, 29 May, 13
• "We
need
an
accessible
website"
is
not
a
good
requirement.
Vague
is
another
word
for
future
trouble,
idenTfy
the
client's
needs.
Is
it
Sec)on
508,
AODA?
Is
it
WCAG
2?
Which
level?
• Take
it
one
step
further,
try
to
read
between
the
lines.
Is
accessibility
a
legal
requirement
for
the
client?
Do
they
have
corporate
buy-‐in?
Does
the
client
have
other
accessible
web
products?
The
answers
to
these
quesTons
can
provide
extremely
valuable
insight
for
your
strategy
and
future
collaboraTon
with
the
client.
• Hint:
What
if
you're
the
only
agency
who
is
successful
in
delivering
accessible
web
products?
That
is
a
differenTator
for
you,
a
compeTTve
advantage.
26. 1. Set yourself up for success with accessibility
Client
• Take extra steps to clearly set expectations:
"We want an accessible website conforming with
WCAG 2, level AA.".
• Any documents that are signed should clearly
define what the expectation is.
• Make sure you know what you're asking for or you
have someone who can help with that.
Wednesday, 29 May, 13
• Take
extra
steps
to
clearly
set
expectaTons:
"We
want
an
accessible
website
conforming
with
WCAG
2.
Documents
accessibility
and
live
capTons
is
not
in
scope
for
this
projects".
• Any
documents
that
are
signed
should
clearly
define
what
the
expectaTon
is.
That
can
be
a
contract,
statement
of
work,
RFP.
etc.
• Make
sure
you
know
what
you're
asking
for
or
you
have
someone
who
can
help
with
that.
27. 2. Create a strategy and stick to it
"We want GreatWebsite.com to be accessible"
=
NOT a strategy
Wednesday, 29 May, 13
"We
want
GreatWebsite.com
to
be
accessible"
is
not
a
strategy.
Reflect
the
accessibility
strategy
in
the
planning
documents
everyone
is
using,
usually
those
are
"workback
schedules".
28. "Other companies put a plugin on their website for
users to download. That made their website accessible!"
Wednesday, 29 May, 13
Photo: http://cubemate.blogs.com/cubemate/page/6/
29. 2. Create a strategy and stick to it
Agency
• You should make accessibility an integral part of your workflow - it's
becoming a competitive advantage. Also, it benefits you on
interoperability, SEO and mobile development.
• Your best accessibility strategy? Bake accessibility in at every stage.
• Your account / project manager needs to clearly articulate how
accessibility is done, at which stage and who is doing it.
• If you made a commitment for accessibility and don't know where
to start get help. ASAP.
• Example: workback schedule we amended for accessibility for one
of our clients.
Wednesday, 29 May, 13
• You
should
make
accessibility
an
integral
part
of
your
workflow
-‐
it's
becoming
a
compeTTve
advantage.
Also,
it
benefits
you
on
interoperability,
SEO
and
mobile
development.
• Your
best
accessibility
strategy?
Bake
accessibility
in
at
every
stage.
Dropping
accessibility
on
Billy
the
developer
will
get
you
nowhere
and
frustrate
Billy
to
no
end.
• Your
account
manager
/
project
manager
needs
to
be
able
to
clearly
arTculate
what
is
being
done
for
accessibility,
at
which
stage
and
who
is
doing
it.
• Example:
workback
schedule
we
amended
for
accessibility
for
one
of
our
clients.
• If
you
made
a
commitment
for
accessibility
and
don't
know
where
to
start
get
help.
ASAP.
But
get
the
help
that
will
leave
the
accessibility
knowledge
30. 2. Create a strategy and stick to it
Client
• Your relationship with the agency will dictate the strategy
and what / how you approach accessibility.
• Ask 1 question: What's your accessibility strategy? In
your strategy include accessibility at every stage: planning,
design, wireframes, prototype, final product.
• Benefits: you get the agency to think and plan for
accessibility before the project starts.
• Pro tip: if you gave style guides / development guidelines
that include accessibility share those with the agency.
• Compromising is OK as long as it’s realistic.
Wednesday, 29 May, 13
• Your
relaTonship
with
the
agency
will
dictate
the
strategy
and
what
/
how
you
approach
accessibility.
• Ask
1
simple
quesTon:
What's
your
accessibility
strategy?
You
can
get
a
lot
of
informaTon
from
this
alone.
If
they
don't
have
one,
you
make
one
and
get
them
to
price
it
and
sign-‐off
on
it.
• In
your
strategy
include
accessibility
at
every
stage:
planning,
design,
wireframes,
prototype,
final
product.
• Ask
the
agency
to
report
on
the
accessibility
implementaTon
strategy.
• Benefits:
you
get
the
agency
to
think
and
plan
for
accessibility
before
the
project
starts.
• Pro
2p:
if
you
gave
style
guides
/
development
guidelines
that
include
accessibility
share
those
with
the
agency.
Request
that
all
people
assigned
to
31. Accessibility Pricing
”Average cost to fix #a11y bug: on developer's
machine $25; in testing $500; once released
$15,000!”
- Susann Keohane, AccessU 2013
• Some people say 30-50% increase
• How about 9.13% ?
• IBM’s Web-Costing Model [pdf]
2. Create a strategy and stick to it
Wednesday, 29 May, 13
How
much
does
the
project
cost
with
and
without
a11y?
Some
people
say
30-‐50%
increase
Our
number?
9.13%
(based
on
a
recent
RFP)
-‐
as
expensive
as
project
management
-‐
the
agency’s
32. 3. Be realistic about your team's
accessibility knowledge
It’s a team effort, not the developer’s job.
Wednesday, 29 May, 13
33. "Bob from IT says it works with JAWS 5"
Wednesday, 29 May, 13
Photo: http://abduzeedo.com/avengers-kickass-wallpapers
34. 3. Be realistic about your team's accessibility knowledge
Agency
• Use your strongest HTML/CSS guy for the
job, your share point guy ain't gonna cut it!
• You need your whole team to know accessibility.
Teamwork not "the one guy who knows
VoiceOver".
• Start small, ask your team to take the short online
AODA / Customer Service course.
Wednesday, 29 May, 13
• Use
your
strongest
HTML/CSS
guy
for
the
job,
your
share
point
guy
ain't
gonna
cut
it!
The
backbone
of
any
accessible
site
is
solid/semanTc
HTML
• You
need
your
whole
team
to
know
accessibility.
An
excellent
content
creator
understands
the
benefit
of
good
alt=
text
for
SEO
and
accessibility,
a
developer
may
not.
You
need
teamwork
not
"the
one
guy
who
knows
VoiceOver".
• Keyboard
accessibility
doesn’t
being
and
end
with
the
TAB
key...
• "Oh
yes,
it's
keyboard
accessible.
We
put
in
keyboard
shortcuts
for
the
navigaTon
menu
-‐
press
Shig-‐Ctrl-‐Alt-‐F2-‐W-‐T-‐F
to
open
menu
tabs".
Hint:
this
is
not
keyboard
accessible.
• Start
small,
ask
your
team
to
take
the
short
online
AODA
/
Customer
Service
course.
35. 3. Be realistic about your team's accessibility knowledge
Client
• Testing only with screen readers is not going to cut it.
• Make sure you're comfortable with the agency's
accessibility knowledge. Don't get into meetings / calls
with the sales team, ask for the PM, BAs, designers,
etc.
• Ask for examples of their work with other accessible
projects. If the agency has no proven knowledge of
accessibility, hire a third party.
• No time to kick back and relax - help the agency.
Wednesday, 29 May, 13
• TesTng
only
with
screen
readers
is
not
going
to
cut
it.
We've
seen
web
products
that
were
coded
to
work
with
screen
readers
that
were
completely
inaccessible
to
other
users.
• But
also
make
sure
you're
comfortable
with
the
agency's
accessibility
knowledge.
Don't
get
into
meeTngs
/
calls
with
the
sales
team,
ask
for
the
PM,
BAs,
designers,
developers
and
prod
the
team.
• Ask
for
examples
of
their
work
with
other
accessible
projects.
If
the
agency
has
no
proven
knowledge
of
accessibility,
hire
a
third
party.
• Do
not
rely
on
the
agency
alone
to
implement
accessibility.
You
need
to
be
able
to
confirm
it.
36. 4. Use them testing tools AND
test with users
Some are manual, some are automated, some
work straight in your browser - you have options.
AND test with real users!
Wednesday, 29 May, 13
37. "Accessibility is part of our workflow. When we do
QA testing" (which is 5 days before we go live)
Wednesday, 29 May, 13
38. 4. Use them testing tools AND test with users
Agency
• Test with users with disabilities!
• You don't need to invest in expensive testing
tools. Just turn on VoiceOver on you Mac or High
Contrast Mode in Windows - these come with the
operating system.
• Other tools we recommend are: WebAIM WAVE,
aChecker, Deque FireEyes, Color Contrast
Analyzer, etc.
Wednesday, 29 May, 13
• Test
with
users
with
disabiliTes!
• You
don't
need
to
invest
in
expensive
tesTng
tools.
Just
turn
on
VoiceOver
on
you
Mac
or
High
Contrast
Mode
in
Windows
-‐
these
come
with
the
operaTng
system.
• Other
tools
we
recommend
are:
WebAIM
WAVE,
aChecker,
Deque
FireEyes,
Color
Contrast
Analyzer,
etc.
39. 4. Use them testing tools AND test with users
Client
• Test with users with disabilities or at least simulate
with assistive technologies. Gamify it!
• Use automated testing tools. Especially for
regularly-posted content.
• Be smart about prioritizing:
1 big issue on 1 page vs 1 small issue on 80 pages
Wednesday, 29 May, 13
• Test
with
users
with
disabili2es!
• Use
an
automated
tesTng
tools
especially
if
content
will
be
regularly
posted
on
the
newly
launched
website.
This
will
provide
you
snapshots
in
Tme.
• Be
smart
about
priori2zing.
Honestly,
you
have
to
look
at
the
team’s
morale
as
well.
40. 5. Always be closing
Is the web product launched accessible or not?
What is the remediation strategy?
Who is doing it and when?
Wednesday, 29 May, 13
42. 5. Always be closing
Agency
• Always be closing: you don't want accessibility
lingering after launch.
• Write a report that clearly depicts the accessibility
results. High level details: it's keyboard accessible,
colour contrast passes with flying colours (pun
intended), it works with JAWS 13 and ZoomText 10, etc.
• Do good work and don't be afraid to show the client
you can do it again, this is chance to articulate that in
the report.
Wednesday, 29 May, 13
• Always
be
closing:
you
don't
want
accessibility
lingering
ager
launch.
• Write
a
report
that
clearly
depicts
the
accessibility
results.
High
level
details:
it's
keyboard
accessible,
colour
contrast
passes
with
flying
colours
(pun
intended),
it
works
with
JAWS
13
and
ZoomText
10,
etc.
• Do
good
work
and
don't
be
afraid
to
show
the
client
you
can
do
it
again,
this
is
chance
to
arTculate
that
in
the
report.
43. 5. Always be closing
Client
• Be ready to at least spot-check. And then sign-off on it.
• It's better to launch with some accessibility issues then not
launch at all. Planning for remediation is OK.
• Ask the agency to report on the results of their accessibility
strategy / work completed. Hint: you don't actually care
how they report.
• The Major Benefit? You flip the accessibility process upside
down. You're basically asking for 2 things:
★ do the accessibility work
★ tell me about what you did
Wednesday, 29 May, 13
• Ask
the
agency
to
report
on
the
results
of
their
accessibility
strategy
/
work
completed.
Is
it
accessible
or
not?
Why
not?
• Hint:
you
don't
actually
care
how
they
report,
it
can
be
anything
-‐
WCAG
checklist,
compliance
sign-‐off,
developers
tesTmonials,
etc.
The
Major
Benefit?
You
flip
the
accessibility
process
upside
down.
It's
not
JUST
your
responsibility
to
ensure
accessibility,
you're
transferring
some
of
that
responsibility
to
the
agency.
When
you
ask
the
agency
to
report
on
accessibility
you're
basically
asking
for
2
things:
1. do
the
accessibility
work
2. tell
me
about
what
you
did