AFB is rolling out a new embedded video player. That's the type where you don't need to use extra software, you just click it and it plays in your browser. Why did we create our own HTML5 embedded video player? And what is HTML5, anyway?
Technology just keeps getting better. But video-playing technology on the web is still pretty fraught with show-stopping problems. One category of technical issue is the accessibility of the player (we'll talk about the accessibility of the video itself another time).
Imagine this. You want to watch a video for a class, your job, or someplace where it really matters. You go to the page, and find bunches of buttons, none of them labeled. You try each one in turn, and the video doesn't play. Worse, the buttons multiply or disappear. You can guess that one button is causing the page to display other buttons. How long does it take you to get the thing to play? Maybe you never manage it.
Or, you come to the page and there are no buttons—no controls of any kind. Your boss wants you to speak intelligently about this video at the meeting in an hour, and there is no way to play this thing.
Or, you can get it to play with enough flailing around, but then how do you pause? Or fast-forward?
Often the players are designed for mouse only, and there is no way to interact with the controls via the keyboard. Lots of people use keyboard only—no mouse. So, those people are stuck when they come to such a player. Who are these crackpots who don't use a mouse? People who are blind fall into this camp (the no-mouse camp, not the crackpot camp, necessarily).
In other cases, there might be actual buttons, and they might work to some degree with the keyboard, but the labels on the buttons are unlabeled images. So, screen-reader users can't know which is which, and users with low vision often can't make them out (is that an arrow pointing right? Maybe it's a funny square.... and what does it mean, anyway?).
Solution: a versatile, full-featured player with HTML controls that let the users select the size and color scheme they prefer. The controls are labeled with text, so they work great with any kind of assistive technology, or no AT at all. They even work for mouse users.
And, you can expand the video to use the full screen, nice for users with low vision and everybody else.
Don't get scared, you don't have to know what HTML5 is to use the player. But if you're interested, HTML is the language browsers like Internet Explorer, Chrome, Firefox, and Safari understand and use. HTML5 is a great, newish standard supported by the World Wide Web Consortium (W3C) to make the Internet more user-friendly and more accessible. So, if browsers, assistive technology, web designers, and some other people all share the same sophisticated standard, everything works together much more smoothly. The user needs less software, less technical knowledge, and gets less vexation. Everybody gets more work done and has more fun.
Try the video on this page, and if you're interested, change the colors of the page with the Change Colors link at the top, then see how the player looks with your choices. And let us know what you think in the comments!
- The American Foundation for the Blind's Commitment to Web Accessibility
- Resources for Creating Accessible Websites
- Video Description
Update: Player Available for Download!
The player is available now, if you'd like to use it on your own site. Download AFB's Accessible HTML5 Video Player (Beta).
We'd love to have your feedback on the player in this quick form.