a11y goes to 11 …using HTML5+ and CSS3+ by Eric Eggert @yatil / @webcontravelers

#a11yto11

2010 #fronteers10

2011 #fronteers11

a ccessibilit y accessibility 11

a ccessibilit y 11 accessi b ility

New exciting web technologies enable us to do more accessible web sites by doing less .

HTML4

HTML4

HTML5

We need to get rid of the dogmas.

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

Robust

Web fonts + readable by screen readers + resizable + easy to implement

di ! cult to read for mentally challenged people

slight performance penalty

Perceivable

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

Understandable

Audio & Video + HTML controls increase accessibility + adding subtitles is easy + users are in control of autoplay 1

multiple formats needed (ogg/webm + mp4) (1 Not yet implemented, but possible.)

Operable

It’s hard to reach Perfection and when you do, it is often destroyed by others.

@ScreenOrigami & @yatil We’ll help!

Screenshot a11yto11.com a11yto11.com

10 tips tailored to your web site Inexpensive

avoid the pitfalls

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