July 12, 2011: How to Create Accessible Video

Slide 1: 
Welcome to the Accessible Technology Webinar Series: 
The Accessible Technology Webinar Series is sponsored by the Great Lakes ADA Center and the Pacific ADA Center, both members of the ADA National Network.  The Session is Scheduled to begin at 1:00 pm Central Time. We will be testing sound quality periodically.  The content and materials of this training cannot be used or distributed without permission. This training is funded under award #H133A060097 from the U.S. Department of Education through the auspices of the National Institute on Disability and Rehabilitation Research (NIDRR. For permission to use training content or obtain copies of materials used as part of this program please contact us by email at adata@adagreatlakes.org or toll free (800) 949-4232 (V/TTY) in IL, IN, MI, MN, OH, and WI.  For other all other states call (312) 413-1407

Slide 2: 
How to Create Accessible Video
Terrill Thompson, DO-IT, University of Washington tft@uw.edu @terrillthompson http://terrillithompson.com 

Slide 3: 
My Projects 
“Disabilities, Opportunities, Internetworking, & Technology” http://uw.edu/doit  
Working to increase the participation of people with disabilities in computing fields. http://uw.edu/accesscomputing 

Slide 4: 
Making Video “Accessible” to whom?
People who can’t hear audio content; People who can't see visual content; People who can't see or hear the content; People who can’t use a mouse; People who need to find specific content within a video or collection of videos; People who don’t understand the language spoken in a video

Slide 5: 
Accessibility Solution #1: Captions 
Spoken audio appears as text; Benefits people who are unable to hear the audio; Benefits anyone who benefits from multimodal sensory input; Can be searched (if CC); Can be automatically translated into other languages (if CC) 

Slide 6: 
YouTube supports all of this
Screen Shot of YouTube Video with CC 

Slide 7: 
Closed vs. Open 
Closed = Contained in a separate track/file
Advantages; The user can toggle on/off; The user can control how captions are displayed (if player supports this); Captions can be searched, translated, & easily edited

Slide 8: 
Open vs. Closed 
Open = Mixed/burned into the video
Advantages; Care can be taken to produce good quality, perfect positioning and contrast; Always on; the user can not turn off; May help users who wouldn’t otherwise look to turn on captions, or know how to do so; Will never be separated from the video if video is moved or distributed

Slide 9: 
How to Add Captions
Create a transcript; Divide the transcript into caption-sized segments (optional, depending on choice of tool in #3); Use a captioning tool to timestamp the caption-sized segments; Save to an output file that is appropriate for your media type

Slide 10: 
Captioning Tools
Free Software
MAGpie (Win & Mac), SubTitle Workshop (Win),
World Caption (Mac), CapScribe (Mac) 
Commercial Software
HiCaption (Win), MovCaptioner (Mac)
Free Online Tools
dotSub, Subtitle Horse, CaptionTube 
See my blog: 
Free Tools For Captioning YouTube Videos 

Slide 11: 
dotSub.com
Screen shot of the dotSub interface, featuring a video player, a list of recent captions, a form field for entering new captions, and a list of keyboard shortcuts. 

Slide 12: 
Semi-Automatic Captioning Tools
Upload a transcript; automatically convert that it into captions: YouTube Caption Sync 
http://automaticsync.com/captionsync/ 
3PlayMedia
http://www.3playmedia.com 
Docsoft 
http://www.docsoft.com 

Slide 13: 
Flavors of Closed Captions
QuickTime – SMIL, with captions in qt.txt 
Real – SMIL, with captions in rt.txt 
Windows – SAMI
YouTube - SubRip 
Apple i* - Scenarist Closed Caption (SCC)
W3C standard: Timed Text (XML format)
New HTML5 draft standard: WebVTT 
Slide 14: 
Example SubRip File (for YouTube)

Slide 15: 
Example W3C Timed Text file
Snapshot of a Timed Text caption file, an XML file with highly structured markup. Captions are marked up in paragraph tags 

Slide 16: 
WebVTT Format 
“Web Video Text Tracks” 
Originally based on SubRip format (*.srt), but has been extensively extended
The draft WHATWG spec: 
http://www.whatwg.org/specs/web-apps/current-work/webvtt.html 
Understanding WebVTT: 
http://www.delphiki.com/webvtt/ 	

Slide 17: 
WebVTT Example 
1
00:00:10,376 --> 00:00:14,115
Hi, I’m Sheryl Burgstahler, director of the DO-IT programs 
2
00:00:14,116 --> 00:00:17,002
at the University of Washington in Seattle. 

Slide 18: 
Uploading Captions to YouTube
Screen shot of the YouTube Video Details Screen, which includes a prominent "Caption and Subtitles" link 
Slide 19: 
Adding Closed Captions 
for Apple i*
iPhones and iPods support closed captions via .scc format
Requires many steps, either in: Apple Final Cut Pro ($999)
Apple QuickTime Pro ($30), Mac version only
“Creating Accessible iTunes U Content” (NCAM) http://ncam.wgbh.org/about/news/creating-accessible-itunes 

Slide 20: 
Scenarist Closed Caption (.scc)
Scenarist_SCC V1.0
00:00:00:12  94ae 94ae 9420 9420 94d0 94d0 942c 942c 942f 942f 
00:00:00:12  942c 942c 
00:00:00:12  94ae 94ae 9420 9420 94d0 94d0 5b20 6d75 73e9 e320 5d80 942c 942c 942f 942f 
00:00:09:04  942c 942c00:00:09:04 94ae 94ae 9420 9420 94d0 94d0 942c 942c 942f 942f 
00:00:09:04  942c 942c00:00:09:04 94ae 94ae 9420 9420 94d0 94d0 5b6e 61f2 f261 f4ef f25d 20d9 ef75 20f7 616e f4bf f468 e573 e520 70e5 ef70 ece5 ae80 942c 942c 942f 942f 
Slide 21: 
Sample Closed Captioned 
Video on iPhone

Slide 22: 
Sample Open Captioned 
Video on iPhone
Sample open captioned video on iPhone. Open captions are displayed in a large attractive font on a transparent background at the bottom of the screen. Video clip compliments of NCAM: http://ncam.wgbh.org/mm/samples.html 
Slide 23: 
Making Video “Accessible” to whom?
People who can’t hear audio content ✔ 
People who can't see visual content
People who can't see or hear the content
People who can’t use a mouse
People who need to find specific content within a video or collection of videos ✔ 
People who don’t understand the language spoken in a video ✔ 

Slide 24:
 Accessibility Solution #2: 
Audio Description, A narrative track, describes any visual content that isn’t communicated to users without sight Can be either open or closed, Closed audio description can be either Recorded audio, synchronized with video, Time-stamped text, to be read with synthesized speech 

Slide 25: 
“Audio Description” is also known as 
Video description; Descriptive Video™; Descriptive narration; Described video
Description 

Slide 26: 
How to avoid audio description
Assure that all important information is communicated visually and audibly
If video is a lecture, work with lecturers to help them be mindful that not everyone in the audience can see. Applies broadly: Live lectures, people in the back can’t see; Audio-recorded lectures, nobody can see; Video-recorded lectures, many people can’t see

Slide 27: 
How to add Audio Description
Step 1: Carefully script audio description, Choose words carefully so as not to distort the message
Find suitable moments for inserting audio (avoid conflicts with existing dialog or important sounds) 

Slide 28: 
How to add Audio Description (cont.) 
For recorded description: 
Step 2: Record audio description
Step 3a (for closed description): Save as audio file. Let the media player sync it with the video.
Step 3b (for open description): Save as audio file, then mix into program audio & re-encode video 

Slide 29: 
How to add Audio Description (cont.) 
For text-based audio description: 
Step 2: Type and time-stamp audio description using the same tools and techniques as with closed captions
Step 3: Export to format supported by your player 

Slide 30: 
Support for audio description 
JW Player 
http://www.longtailvideo.com/players 
Supports mp3 file
HTML5
<track kind=“description”>
Currently supports text as WebVTT 
NCSU proof-of-concept: 
http://bit.ly/kxpz3b 

Slide 31: 
Speaking of HTML5,  
video doesn’t get much easier… 
<video src=“myvideo.mp4”>
</video>

Slide 32: HTML5 Accessible Video
<video controls tabindex="0" id="video">
  <source src="myvideo.mp4"> 
  <source src="myvideo.webm">
  <track kind=”captions" ”srcmycap.vtt">
 <track kind=”descriptions" ”srcmydesc.vtt">
  <!-- fallback content goes here -->
</video>

Slide 33: 
Closed Audio Description 
Not Quite There Yet
Volume control (program audio vs. narration)
JW Player uses “ducking” (program audio gets softer whenever audio description is present)
With text-based narration, speed of screen reader affects synchronization
Some videos need “extended audio description” (pausing the video until narration finishes)

Slide 34: 
How DO-IT Does Video
Start with a script (minimizes cost of transcription)
Describe visual content in program audio (minimize need for audio description)
Outsource both captions & description
Deliver two versions of video (with and without audio description)
Use audio described version on YouTube

Slide 35: 
Making Video “Accessible” 
to whom?
People who can’t hear audio content ✔ 
People who can't see visual content ✔ 
People who can't see or hear the content
People who can’t use a mouse
People who need to find specific content within a video or collection of videos ✔ 
People who don’t understand the language spoken in a video ✔ 

Slide 36: 
Accessibility Solution #3: 
Choose an Accessible Media Player
Does it support closed captions?
Does it support audio description? 
Can captions be customized by the user? 
Is it accessible by keyboard? If not, does it have an API that allows control via HTML? 
Are the buttons and controls accessible to screen reader users? 
Does it support scrubbing to a new start time (e.g., for caption search)?

Slide 37: 
Some pretty accessible players 
JW Player (the only player that supports audio description) 
Ohio State University JW Player Controls
http://wac.osu.edu/examples/jwpc/ 
YouTube player (the latest version)
NCAM ccPlayer
http://ncam.wgbh.org/invent_build/web_multimedia/tools-guidelines/ccplayer 

Slide 38: 
HTML5 video has potential too
Screen shot of the DO-IT custom HTML5 video player, which includes buttons for closed captions, sign language, and audio description (although the latter two buttons are grayed out) 

Slide 39: 
Making Video “Accessible” 
to whom?
People who can’t hear audio content ✔ 
People who can't see visual content ✔ 
People who can't see or hear the content
People who can’t use a mouse ✔ 
People who need to find specific content within a video or collection of videos ✔ 
People who don’t understand the language spoken in a video ✔ 

Slide 40: 
Accessibility Solution #4: 
Provide a transcript
Not a substitute for captions, but a supplement to captions 
Benefits people who can neither hear the video nor see the captions 
People who are deaf-blind
People with slow Internet connections
People with other technology limitations
Benefits busy people who want info quickly

Slide 41: 
Making Video “Accessible” 
to whom?
People who can’t hear audio content ✔ 
People who can't see visual content ✔ 
People who can't see or hear the content ✔ 
People who can’t use a mouse ✔ 
People who need to find specific content within a video or collection of videos ✔ 
People who don’t understand the language spoken in a video ✔ 

Slide 42: 
What about people who don’t understand written language? 
Some users only understand sign language
There are several examples of videos that have embedded sign language interpreters 
WCAG 2.0 SC 1.2.6 Sign Language (Prerecorded): Sign language interpretation is provided for all prerecorded audio content in synchronized media. (Level AAA) 

Slide 43: 
Example using a custom 
JW Player
Image of a media player featuring a sign language interpreter overlaid over the bottom right corner of a video 

Slide 44: 
creaturediscomforts.com
Image of the video player from the CreatureDiscomforts.com web site, which includes closed sign language interpreting with each video. 
Slide 45: 
youtube.com/user/MuchoMath
Image of a video for a college math class, featuring the instructor, a student, math-related visuals, and a sign language interpreter.  

Slide 46: 
Implementing Accessible Video in 
Your Organization
Empower the infrastructure
Who creates multimedia? 
Who provides streaming services? 
Who offers relevant training and support?
Document a procedure. 
Identify responsible parties. 
Include accessibility in all media discussions.
Collaborate. Negotiate bulk pricing for transcribing and/or captioning services. 

Slide 47: 
Remember all those beneficiaries
Individuals with a wide range of abilities 
People who need to search your video content 
People who don’t understand the language spoken in your videos
People who don’t have sufficient Internet bandwidth
People who are busy 

Slide 48: 
Where to Learn More 
DO-IT Video 
http://uw.edu/doit/video 
My blog
http://terrillthompson.blogspot.com 
My 5-minute video on creating an accessible HTML5 media player:
http://terrillthompson.com/video/html5 

Slide 49: 
Questions 
You May Type and Submit questions in the Chat Area Text Box or press 
Control-M and enter your question in the Chat Area 
  
Slide 50: 
Thank You 
Thank you for participating in today’s session.
Please Evaluate the session at: 
http://ada-conferences.July122011.sgizmo.com 
Please Join Us for the Next Session, September 13, 2011 
Titled “Introduction to Mobile Computing”