Accessibility rocks! (UXcamp Europe 2016)

Accessibility (sometimes abbreviated as a11y) means that content should be available to everyone and that functionality could be operated by everyone. This session aims to raise awareness of this topic, as Ian Devlin says, “The 11 in a11y stands for the number of times you have to tell developers that accessibility is important.” Add “and designers and product managers.”
To bear accessibility in mind does not mean to design for just a small minority (eg. blind users). Everyone can have visual, motor, hearing, or cognitive impairments—be it temporary, permanent, or situational. Everyone benefits from accessible web pages/applications.
In this session, we’ve discussed the Web Content Accessibility Guidelines (WCAG), tools like color contrast checkers, and how to build an accessible form with HTML by just following some basic rules.
Because it’s your job! Even if your stakeholders are not yet convinced that accessibility is important, follow Léonie Watson’s advice: “Just go ahead and do it anyway!” Because as Tim Berners-Lee said, “This is for everyone!”

Transcript

1. View Slide

2. “The 11 in a11y stands 

   for the number of times 

   you have to tell developers 

   that accessibility is important.” 

   —Ian Devlin
   

   View Slide

3. a _ _ _ _ _ _ _ _ _ _ _ y
   1 2 3 4 5 6 7 8 9 10 11
   c c e s s i b i l i t
   a11y
   

   View Slide

4. i _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ n
   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
   n t e r n a t i o n a l i z a t i o
   i18n
   

   View Slide

5. l _ _ _ _ _ _ _ _ _ _ n
   1 2 3 4 5 6 7 8 9 10
   o c a l i z a t i o
   l10n
   

   View Slide

6. g _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ n
   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
   u n n a r b i t t e r s m a n
   g16n
   @ .
   

   View Slide

7. t o m a s c a s p e r s
   @tcaspers
   

   View Slide

8. c h r i s t i a n m ü l l e r
   @grafikkasper
   

   View Slide

9. View Slide

10. View Slide

11. View Slide

12. Accessibility:
    ☛ content should be available to everyone
    ☛ functionality could be operated by everyone
    

    View Slide

13. visual
    motor
    hearing
    cognitive
    temporary
    permanent
    situational
    Impairments
    

    View Slide

14. “Everybody is a keyboard user 

    when eating lunch 

    with their mouse hand.” 

    —Adrian Roselli
    

    View Slide

15. “The disability is not the problem.

    The accessibility is the problem.” 

    —@PathstoLiteracy
    

    View Slide

16. “Accessibility is fundamentally 

    a design problem, 

    not a disability problem.” 

    —David Storey
    

    View Slide

17. “Developers…don’t really understand anything
    beyond the superficial appearance on screen
    and whether you can interact with it 

    the way they would interact with it.” 

    —Karl Groves
    

    View Slide

18. Web Content Accessibility Guidelines (WCAG)
    ☛ percievable
    ☛ operable
    ☛ understandable
    ☛ robust
    

    View Slide

19. View Slide

20. View Slide

21. View Slide

22. View Slide

23. View Slide

24. View Slide

25. View Slide

26. View Slide

27. “When I see inaccessible code, 

    my first thought isn’t ‘stupid developer’; 

    it’s ‘dysfunctional company design culture’.” 

    —Heydon Pickering
    

    View Slide

28. “How do I convince stakeholders?”
    “Don’t! Just go ahead and do it anyway!” 

    —Léonie Watson
    

    View Slide

29. “The best time 

    to consider accessibility 

    is at the beginning, 

    the second best time 

    is now.” 

    —David Bolter
    

    View Slide

30. “Accessibility is like a blueberry muffin—

    you can’t push the berries in there afterward.” 

    —Cordelia McGee-Tubb
    

    View Slide

31. “Arguing with teammates over
    ‘bothering with accessibility’
    makes me so angry.
    Every. Time.
    So. Angry.
    Yes. ‘Bother’. It’s your job.”
    —Jen Simmons
    

    View Slide

32. View Slide

33. View Slide

34. View Slide

35. “A11y Rocks”
    artwork by Heydon Pickering
    

    View Slide

36. “This is for everyone”
    photo by Nick Webb, CC-BY-2.0
    

    View Slide

37. Fira Sans and Fira Mono
    fonts by Erik Spiekermann
    

    View Slide

38. View Slide