Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Accessibility rocks! (UXcamp Europe 2016)

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!”

Gunnar Bittersmann

June 25, 2016
Tweet

More Decks by Gunnar Bittersmann

Other Decks in Design

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