1. Universal Media Player Terrill Thompson tft@uw.edu @terrillthompson http://terrillthompson.com/ump (UMP)

2. Media Players Then

3. Media Players Now

4. What if your browser doesn't support MP3?

5. Your browser doesn't support HTML5 ?

6. The Same Code Works for Video

7. The player works well in IE9 and higher Tab gives the player focus Space toggles play/pause Right/left arrows fast forward/rewind Up/down arrows control volume Controls have informative labels for screen reader users

8. It sort of works in Firefox Tab gives the player focus Space and arrow keys work as they do in IE, but not if screen reader is running Screen readers announce controls – Very high precision on the progress bar

9. It sort of works in Chrome and Safari Tab gives the player focus, but then what? Player doesn't respond to keyboard commands

10. Accessibility of the player controls are the same for audio and video But HTML5 video has other cool features too...

11. Can't hear the audio?

12. WebVTT Format Stands for "Web Video Text Tracks" Based on SubRip format (*.srt) The draft spec: http://dev.w3.org/html5/webvtt http://dev.w3.org/html5/webvtt

13. WebVTT Example WEBVTT 00:00:09.165 --> 00:00:10.792 You want these people. 00:00:10.792 --> 00:00:13.759 They order your products, sign up for your services, 00:00:13.759 --> 00:00:16.627 enroll in your classes, read your opinions, 00:00:16.627 --> 00:00:18.561 and watch your videos.

14. Internet Explorer 10+ has good support for captions + accessible controls

15. Captions in Other Browsers Firefox will support captions in 28.0 (current version is 27.0.1) Chrome, Safari, and Opera support captions but they all have issues: http://terrillthompson.com/blog/366 http://terrillthompson.com/blog/366

16. Can't see the visual content?

17. Another WebVTT Example WEBVTT 00:00:02.000 --> 00:00:06.000 A blue circle has pairs of arching pairs inside. Underneath, DO-IT. 00:00:06.000 --> 00:00:16.000 Words appear in a white box: World Wide Access. 00:00:37.000 --> 00:00:47.000 Terrill Thompson:

18. Browser Support for Description

19. Summary Browsers have some support for accessible HTML5 media, but it's still less than ideal HTML5 media has a robust API, so we can make our own player...

20. Resources UMP http://terrillthompson.com/ump http://terrillthompson.com/ump My Blog http://terrillthompson.com http://terrillthompson.com These Slides http://staff.washington.edu/tft http://staff.washington.edu/tft DO-IT Video http://uw.edu/doit/video http://uw.edu/doit/video