Presentation on HTML5's accessibility support, what developers can do to enhance experience for people with disabilities, which problems ARIA solves and what kind of goodies are brought by WebGL.

1. Accessibility & WebGL
Urban Škudnik
urban.skudnik@gmail.com, @urbanskudnik

2. Before you get all
hyped...

3. http://tvtropes.org/pmwiki/pmwiki.php/Main/ThinkOfTheChildren

4. Everything is only your
good will.

5. Accessibility

6. The State of H5

7. The good

8. The bad
• FF4 (b6) - 6 elements, partial support for 4
• Opera 10.62 - 7 elements partially
supported
• IE 9 - 3 partially supported
• Chrome - null.
www.html5accessibility.com

9. WAI - ARIA

10. How does that look?
<span
tabindex="0"
role="checkbox"
aria-checked="true"
onkeydown="return
checkBoxEvent
(event);"
onclick="return
checkBoxEvent(event);">
Label
</span>

11. The best thing?
• Dojo - mature
• YUI
• GWT - partial
• jQuery UI - fully compliant by 2.0

12. Landmarks
• role =
• navigation
• complementary
• main
• form

13. The bad sadly-must-
accept
• FF 4 & IE9 - 31 fully, 2 partially, one
unsupported
• Chrome - 2 partially
http://www.html5accessibility.com/index-aria.html

14. Live updates

15. Benefits
http://www.flickr.com/photos/prairiefireimaging/4212859050/

16. WebGL

17. There’s always Flash...

18. ...but surely we can do
better!

19. What we have...
• Bitmap (Canvas)
• Vector (SVG)
• OpenGL (Canvas)

20. Right tool for the right
job
• DOM
• Shapes
• Event handling - easy
• Single HTML element,
rendering
• Pixels
• Event handling - hard
• Have to rely on internal
buffer
SVG Canvas

21. WebGL
• Not very weby - OpenGL ES
• Low level API
• Hard without libraries
• No installation
• Rapid prototyping

22. Just how hard?

23. We are dealing with
OpenGL, after all!

24. But we adopted
libraries for JS too!

25. Warchest
• X3DOM
• GLGE

26. GLGE
• Blender-to-WebGL

27. X3DOM
<x3d width="500px" height="400px">
<scene>
<shape>
<appearance>
<material diffuseColor='red'></material>
</appearance>
<box></box>
</shape>
</scene>
</x3d>