Would you like to embed YouTube® videos on your website? Would you like to ensure that your website viewers with disabilities have equal access to your video?
The Section 508 Video Player, originally housed on Business.gov, is available to web managers who would like to embed YouTube videos on their website. This video player follows the Section 508 Standards for web-based applications.
You can embed player that plays a single video or a playlist, which is a group of videos within a single player. Jump to one of the following sections on this page to find instructions:
Embed a Single Video
Prerequisites
-
The video must be uploaded to YouTube* prior to using the Section 508 compliant video player.
-
The video must contain closed captioning (see YouTube's instructions for adding captions).
Note: Government agencies may upload videos to YouTube by complying with the TOS agreement signed by GSA.
Features
-
Keyboard Controls: The user can control the video player transport buttons such as play, pause and volume with a keyboard.
-
Text Controls (when styles are disabled): The user can control the video player transport buttons using a screen reader.
-
Alternate Description: If Javascript or Flash are disabled or not installed, the video player displays a description of the video and links to instructions for installing Javascript or Flash.
How to Use the Player on Your Site
To embed the 508 Compliant Video Player on a page with your video follow the following steps:
Step 1:
Download this ZIP file that contains 508player.js and 508player.html, the files necessary to use the video player on your website.
Step 2:
Load the JavaScript file, 508player.js, onto your web server. The 508player.js file must be called by any page on which you use the video player. The recommended method is to put the JavaScript call in the head of your page. If you have questions on this step, please consult your website’s administrator.
Step 3:
Locate the video you wish to embed on YouTube and copy the Video ID. The Video ID appears in the URL of the page after watch?v=
Note: the URL for your video might end with extra parameters: &feature=... If that is the case, do not include those parameters with the Video ID. The Video ID will only consist of the code following watch?v= but before &feature=...
Step 4:
Open the 508player.html file and replace VIDEO_ID on lines 6 & 10 with your YouTube Video ID. On line 11, enter a brief description of your video's content.
Step 5:
If desired, change the size of the player (in pixels) on line 7 of 508player.html. The video player embedded at the top of this page is a 320 x 258 (4:3 ratio small player). The suggested size for a small widescreen player is 320 x 194.
Step 6:
Now this code is ready to be pasted on any HTML web page!
Embed a Playlist (Group of Videos)
The following instructions are for embedding a playlist or group of videos.
Prerequisites
-
Videos must be uploaded to YouTube* prior to using the Section 508 compliant video player
-
Videos must contain closed captioning (see YouTube's instructions for adding captions).
Note: Government agencies may upload videos to YouTube by complying with the TOS agreement signed by GSA.
Features
-
Keyboard Controls: The user can control the video player transport buttons such as play, pause and volume with a keyboard.
-
Text Controls (when styles are disabled): The user can control the video player transport buttons using a screen reader.
-
Alternate Description: If Javascript or Flash are disabled or not installed, the video player displays a description of the video and links to instructions for installing Javascript or Flash.
How to Use the Player on Your Site
To embed the 508 Compliant Video Player on a page with your video playlist follow the following steps:
Step 1:
Download this ZIP file that contains 508player.js and 508player.html, the files necessary to use the video player on your website.
Step 2:
Load the JavaScript file, 508player.js, onto your web server. The 508player.js file must be called by any page on which you use the video player. The recommended method is to put the JavaScript call in the head of your page. If you have questions on this step, please consult your website’s administrator.
Step 3:
Create a new Playlist on YouTube consisting of the group of videos you would like to play in succession
-
Sign in to the YouTube account.
-
View the first video you would like to add to your Playlist.
-
Click the “+ Playlist” link beneath the video, choose “[New Playlist]” from the drop down menu, enter the new Playlist’s name, and click “Add.”
-
View the next video you would like to add. Click the “+ Playlist” link again, choose your Playlist from the drop down menu and click “Add.”
-
Follow these same steps to continue adding videos to your Playlist.
Step 4:
Capture the YouTube URL for your new playlist
-
Go to the My Account -> Overview page.
-
Click “Custom Video Players” from the right-hand column.
-
Click the “Create Custom Player” button.
-
Enter the “Player Name” and “Description” next to “Player Information.”
-
Click the name of your new Playlist next to “Content” and click the “Select” button.
-
Click the “Generate Code” button.
-
Next to “Embed Code” you will see YouTube’s code.
-
All you need is the YouTube URL which is on the 3rd line following "embed src=" up to and including the "=" at the end of the line.
Step 5:
Open the 508player.html file and replace the entire YouTube URL on lines 6 & 10 with your YouTube URL from step 4. On line 11, enter a brief description of your video's content.
Step 6:
If desired, change the size of the player (in pixels) on line 7 of 508player.html. The video player embedded at the top of this page is a 320 x 258 (4:3 ratio small player). The suggested size for a small widescreen player is 320 x 194.
Step 7:
Now this code is ready to be pasted on any HTML web page! If desired, you can add links to individual videos within the playlist using the HTML below. Be sure to swap in the appropriate YouTube video ID and set an anchor (#player) above the video player code.
