As Accessibility becomes of increasing importance on the web - also a legal requirement in Ontario, Canada - so too is the rising need to be aware of how to look at sites with a critical eye. This presentation is about the process of How to Perform an Accessibility Audit. I developed this process in early 2014 while working at Metroland Digital.
This marks my very first deck on Slideshare!
6. Because you want to be in front of the
pack with this trending knowledge.
Accessibility is not a trend
7. Because the law made it a priority for
your organization and you were put in
the forefront of it due to limited budgets.
Organizations will always pursue the path of least cost.
26. Guidelines
Level A - Basics
Level AA - Extra Mile
Level AAA - Near Impossible
27. Other Prerequisites
● Intermediate technical skills to
install and use browser plugins
or computer tools, and to take
lots of screenshots
● Basic understanding of HTML
and CSS
44. # Element WCAG
Reference
Issue Details
1.0 Homepage
(URL)
Guideline 2.1
Keyboard
Accessible
(URL)
Can’t see the
tab focus.
(Screenshot)
1.1 Header -- --
1.1.1 Logo Guideline 1.1
Text
Alternatives
(URL)
Image tag does
not contain alt
text.
48. # Element WCAG Reference Issue Details Proposed Solution
1.0 Homepage
(URL)
Guideline 2.1
Keyboard Accessible
(URL)
Can’t see the tab
focus.
G90: Providing keyboard-triggered
event handlers
(URL)
1.1 Header -- PASS
1.1.1 Logo Guideline 1.1 Text
Alternatives
(URL)
Image tag does
not contain alt
text.
G94: Providing short text
alternative for non-text
content that serves the
same purpose and presents
the same information as the
non-text content (URL)
49. # Element WCAG
Reference
Issue
Details
Proposed Solution Responsible
Provide alternate colour
HEX#.
Designer
Change of scope.
Refactor required.
Project Manager
Write alternative text for
images.
Content Manager
Adding alt attribute to
<img>.
Developer
50. # Eleme
nt
WCAG
Referenc
e
Issue
Details
Proposed
Solution
Responsible Time
Provide alternate
colour HEX#.
Designer 15 Minutes
Change of scope.
Refactor
required.
Project Manager 3 Weeks
Write alternative
text for images.
Content Manager 1 Hour
Adding alt
attribute to
<img>.
Developer 15 Minutes
55. Designers plan for considerations in...
User
Context
Mobile
Context Feasibility
56. Designers plan for considerations in...
User
Context
Mobile
Context Feasibility
57. Tips for Designers
● Planning with an understanding of
accessibility early on will help diminish the
fear of lack of creativity.
● Understand that if users can’t access your
site, your beautiful handiwork is moot.
61. Talking to Developers
● Assistive technology isn’t perfect and there
are no standards
● Coding practices recommended by WCAG
are deprecated.
● Provide clear understanding of the problem
and they will usually have a better solution
for you
69. Last year,
1 in 12 men, and about 1 in 200 women
– or about 4.5% of the world’s population
– experience color blindness in some form.
Source: http://blog.eyequant.com/2013/07/02/108-million-web-users-are-color-blind-how-do-they-see-your-website/
73. Talking to Content Managers
● Responsible for writing copy for alternate
text
● Provide clear direction regarding accessible
content practices
● Training on how to update the site with
accessibility in mind for example:
○ How to add alternative text to images
○ Transcriptions for video content