The document discusses the importance of web accessibility and outlines the Web Content Accessibility Guidelines (WCAG) 2.0 and 2.1, emphasizing that accessibility is a continuous process that goes beyond compliance. It provides strategies for making web content perceivable, operable, understandable, and robust for users with various disabilities. The need for effective evaluation methods, including user testing and the use of checklists, is highlighted to ensure true accessibility.

1. Jared Smith
@jared_w_sm
ith
webaim.org
Implementing and
Evaluating Web
Accessibility

2. Accessibility
...
... is a continuum.
... is a process.
... can always be
improved.

7. Guidelines are
measures on the
continuum of
accessibility

8. Web Content
Accessibility
Guidelines 2.0
•Finalized in 2008•Principles-based and technology
agnostic = ethereal and often
confusing
•WebAIM’s WCAG 2.0 Checklist
•WCAG 2.1 draft available

9. Perceivable
Operable
Understandab
le Robust

10. Usefu
l
Usabl
e

12. Your site can be
compliant, yet
inaccessible

13. accessibility >
compliance

14. Your site can be
technically accessible,
yet functionally
inaccessible

15. Perceivab
le

16. Auditory
Disabilities
•Captions for video & live audio
•Text transcripts for all audio
content
•Audio description, too?

17. Visual
Disabilities
•Blindness
•Low vision
•Color
deficiency

18. [
Goo
Zoom
Size
Shape
ZoomFilter
• 2X
3X
4X
BX
sing Programs - Busines
Client
Client
ClientWorkshop

19. Visual
Disabilities
•Sufficient contrast
•http://webaim.org/resourc
es/
contrastcheck
er/•Ensure that meaning is not conveyed
with color alone

20. commo
n
sense
is
vital
whe
n
considerin

21. pas
s
pas
s
pas
s
pas
s

22. Structure and
Semantics
Is theapplication and content
structured to facilitate
understanding and
navigation?
Are thesemantics of

23. Logical Heading
Structure
• Headings
• Typically one <h1> per page.
• Headings should be descriptive of page
sections.
• Should define an ‘outline’ or table of
contents.

24. Semanti
cs
•Equivalent alternative text for non-text
elements
•Content and Function
<img alt=“Jared Smith”>
•Use meaningful link text. Avoid “click here”.

25. • Form control labels
<label for=“name”>Name:</label>
<input type=“text” id=“name”>
•Button values
<button>Search</button> or
<input type=“submit” value=“Search”>
Semanti
cs

26. •Associate data cells to row/column
headers
<th scope=“col”> or
<th scope=“row”>
•Descriptive page titles
<title>Introduction to Web
Accessibility</title>
•Define document language
Semanti
cs

27. Most people today can hardly conceive of life
without the internet. Some have argued that no
other single invention has been more
revolutionary since Gutenberg's printing press in
the 1400s. Now, at the click of a mouse, the world
can be "at your fingertips"— that is, if you can use
a mouse... and see the screen... and hear the
audio—in other words, if you don't have a
disability of any kind.

28. ARIA

29. ARIA Paves the Cow
Paths

30. ARIA Paves the Cow
Paths

31. ARIA Paves the Cow
Paths

32. ARIA Paves the Cow
Paths

33. ARIA Paves the Cow
Paths

34. Semanti
cs
•HTML elements have default
semantics,so use
them.•When the semantics of HTML are
not sufficient, then (and only then)
can you use ARIA.

35. Rule#1of
ARIA:
Don’t use
ARIA

37. ARIA
ARIA changes and enhances the
default semantics of HTML elements
to API values which screen readers
already understand.
<slider>???

38. Just use a
button!

39. Operabl
e

40. Motor
Disabilities

43. Operabl
e
• Ensure keyboard accessibility
•Don’t remove focus indicators
• Ensure interactive elements are clearly
distinguishable
•Allow user to skip over repetitive or lengthy
lists of links
Logical reading/navigation order

44. Understandab
le

45. Who does this
affect?
•Users with cognitive or
learningdisabilitie
s•Largest disability group. Larger
than all the others put together.
•Everyone!

46. Understandab
le
•Be careful with movement and
other
distracters
•Simplify and be consistent.
•Avoid small text

47. Understandab
le
•Avoid long line lengths
•Focus the user’s attention
•“Chunk” and simplify content
•Balance cognitive load vs.
functionality

48. +

49. Robu
st

50. Does it work in the
technologies utilized by
our end users?
Robu
st

51. Perceivable
Operable
Understandab
le Robust

52. Evaluating Web
Accessibility•Only people can evaluate true
accessibility
•Use a checklist
•WebAIM’s WCAG 2.0 Checklist
•Perform keyboard testing
•Test in a screen reader
•Conduct user testing

53. wave.webaim.o
rg

54. “For people without disabilities,
technology makes things
convenient, whereas for people
with disabilities, it makes things
possible.”
- Judy Hueman

55. thank
you
Jared Smith
@jared_w_smi
th webaim.org