Able Player Examples

Able Player is a fully accessible cross-browser HTML5 media player designed from the ground up to meet the diverse needs and preferences of all users.

View on GitHub

Following are examples of Able Player in action. All demos use the "2020" skin unless otherwise indicated.

Audio Examples

1. Audio player with one track and preferences
2. Audio player with one track and preferences (Legacy Skin)
3. Audio player with non-zero start time (disallowed in some browsers)
4. Audio player with a playlist
5. Audio player with interactive transcript in "Lyrics Mode"
6. Audio player with Metadata track (type = text)
7. Multiple audio players (one track each)
8. Multiple audio players (each with its own playlist)
9. Audio Player on a page with form fields
10. Audio Player on a page with form fields in "Steno Mode"
11. Audio Player and "Steno Mode", with form fields in an iframe

Video Examples

• Video player with closed captions
• Video player with default closed captions
• Video player with audio description via VTT track
• Video player with audio description via video swap
• Video player with interactive transcript, subtitles, and chapters
• Video player with interactive transcript, subtitles, and chapters (Legacy Skin)
• Video player with interactive transcript in an external container
• Video player with manually coded external transcript
• Video player with Metadata track (type = selector)
• Responsive Video player with Metadata track (type = selector)
• Video player with sign language
• Media player hidden by default, exposed dynamically
• Video player with chapters in an external container
• Able Player API (controlling Able Player with external controls)
• Able Player with Video Transcript Sorter (VTS)
• Video Player with a playlist
• Multiple video Players
• Video player with search (server-side)
• Video player with search (client-side)

Localized Examples

• French Player
• German Player
• Japanese Player
• Spanish Player

Other Examples

• Native HTML5 Player (not Able Player), for comparison
• Video with no captions or descriptions (don't do this)
• Able Player with Fallback
• YouTube player (Captions hosted on YouTube)
• YouTube player (All tracks hosted locally)
• YouTube player (Complex example)
• Vimeo player (Captions hosted on Vimeo)
• Vimeo player (Captions via Local VTT Files)
• The Deadline: Open video with accessibility enhancements

Credits

The audio examples feature songs by Terrill Thompson, Able Player's creator and lead developer. Check out Terrill's music site for more listening, and to support his work.

The video examples feature clips from videos produced by The DO-IT Center at the University of Washington. Additional videos are available on the DO-IT Video website, which uses Able Player.