The document outlines the updates provided by WCAG 2.1 for designers, detailing the addition of 17 new success criteria to improve web accessibility. Key recommendations include defining data types for form fields, ensuring responsive layouts, and providing alternatives for motion functions. It emphasizes the importance of visual design elements, such as color contrast and the size of interactive elements, to enhance user experience.

1. Even more accessible!
What WCAG 2.1 means for designers
Allison Ravenhall
@RavenAlly
Digital Accessibility
Sensei@Intopia

2. W3C
Web Content
Accessibility Guidelines
1999 2008
2018
v1.0 v2.0 v2.1

3. WCAG 2.1
=
WCAG 2.0
+
17 new success criteria

4. Define data types
of personal info
form fields

5. Design
responsive
layouts

6. Make keyboard
shortcuts
configurable

7. Define
simple
gestures

8. Pinch =
complex
Tap =
simple

9. Start element labels
with (unbroken)
on-screen content

10.  



 


11.  




12.  



 

13. Provide
alternatives to
motion functions

14.  Tilt maze – No alternative

15.  Steering – Tilt optional

16. Unless it’s essential

17. Don’tmake
usersread
likethis

18. 


19. 


20. Colour

21. 
Name
 Enter your name
All about you
I agree
Headings = 3.0 : 1
Text = 4.5 : 1
Element outlines = 3.0 : 1
Icons/graphics = 3.0 : 1
State styles = 3.0 : 1

22. Make interactive
things big
(44 x 44 CSS pixels)

23. Exceptions!
There’s an equivalent big thing
Inline link text
Browser-controlled element
Size is essential

24. Tell users
in advance
about timeouts

26. Allison Ravenhall
@RavenAlly
Digital Accessibility
Sensei@Intopia
Get accessible!