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

Fronteers11 Jam Session: a11y goes to 11

2eb74cc5ebb96ea69807efa88c448aa2?s=47 Eric Eggert
October 06, 2011

Fronteers11 Jam Session: a11y goes to 11

With this presentation, I wanted to encourage web devs to use and embrace modern web technologies, showing that they might not be inaccessible per se. Accessibility is FUN!

2eb74cc5ebb96ea69807efa88c448aa2?s=128

Eric Eggert

October 06, 2011
Tweet

Transcript

  1. a11y goes to 11 …using HTML5+ and CSS3+ by Eric

    Eggert @yatil / @webcontravelers
  2. #a11yto11

  3. 2010 #fronteers10

  4. None
  5. None
  6. 2011 #fronteers11

  7. accessibility accessibility

  8. accessibility b 11

  9. New exciting web technologies enable us to do more accessible

    web sites by doing less.
  10. HTML4

  11. HTML4

  12. HTML5

  13. We need to get rid of the dogmas.

  14. Responsive Web Design + universally works on every screen size

    + simplifies layout for users who need extremely low screen resolutions (screen magnifying) - di cult to implement if your project is complex
  15. Robust

  16. Web fonts + readable by screen readers + resizable +

    easy to implement - di cult to read for mentally challenged people - slight performance penalty
  17. Perceivable

  18. Forms + validation before sending means less errors + required,

    invalid and disabled visible to SR + input according to the type attribute + easy to implement - own validation may interfere visually - mind that post codes are not numbers
  19. Understandable

  20. Audio & Video + HTML controls increase accessibility + adding

    subtitles is easy + users are in control of autoplay1 - multiple formats needed (ogg/webm + mp4) (1 Not yet implemented, but possible.)
  21. Operable

  22. It’s hard to reach Perfection and when you do, it

    is often destroyed by others. Image source: @marklad
  23. @ScreenOrigami & @yatil We’ll help!

  24. Screenshot a11yto11.com a11yto11.com

  25. 10 tips tailored to your web site Inexpensive

  26. avoid the pitfalls

  27. thank you! Follow us on twitter: @a11yto11 @ScreenOrigami & @yatil

    @webcontravelers