Archive
Monthly Archives: January 2016

Lies Companies tell Deaf and Hard of Hearing Canadians about online Closed Captions.

“We’re working on it.”

“It’s on our roadmap.”

“Thanks for making us aware of the issue.”

“We’re working towards providing closed captions.”

This is just some of the BS told to deaf and hard of hearing Canadians when it comes to the lack of closed captions in online content on Canada. It’s been going on for years. In June of 2012, I received an email from CTV’s Executive Producer Mark Sikstrom:

CTVEmail

It took 3 years and 9 months for CTV to add closed captions to their online news videos.

 

Spacechannel

Space.ca wants to thank me for letting them know about the “closed captioning issues” on their site. Almost 6 months later, they still haven’t ‘solved the issues’. It took me one day to figure out how to make online Closed Captions work on OS X, Windows 8 & 10, Windows 8 Mobile, Android, and iOS.

For weeks, they advertised a new show, “The Expanse”, and that you could preview the first two episodes online at their website. Except there’s no closed captions, so deaf and hard of hearing Canadians are screwed. The sad part? Syfy, the producers of this series also has this show on syfy.com, and it’s closed captioned (but only available to to watch if you’re in the US). Almost 6 weeks later (as of this posting date), and there’s still no closed captions on the episodes on Canada’s Space.ca.

 

Telus has been telling me about how they’re ‘working on it’ as well, when it comes to close captioning live streaming television in their Optik TV Go app. I’ve asked about this several times over the years:

Telus

Still no closed captions for their live streaming tv on their app.

Every time a broadcaster or telecom tells me, “They are working on it!”, I always think of this scene from the movie Shooter:

“Working on it” is the new version of, “The check is in the mail.”

Time to end the BS, and #GetCaptioning.

How to Add Closed Captions to purchased iTunes movies.

In Canada, we have poor disability laws –  nothing like the ‘Americans with Disabilities Act’ where all online movies are tv shows are required to be closed captioned by law. In Canada, all we have is the CRTC’s ‘working document proposal‘, sections 51-52. (Broadcasting Regulatory Policy CRTC 2015-104). No laws. No acts. Nothing for Canadian broadcasters to comply with.

So deaf people get screwed over in Canada by Telus, Bell Media, CTV television, Space.ca, and a whole host of other Canadian broadcasters that can’t be bothered to close caption online content.

Apple’s iTunes Canada is somewhat better. Almost all new movies are closed captioned. However, once in a while, you’ll find a movie on iTunes Canada that isn’t closed captioned. Tonight, it was Cairo Time, a 2009 movie. To add insult to injury, it’s closed captioned in the US store. <head-desk>

However, if you can find English Subrip subtitles online (.srt file), and you have a Mac, you can add closed captions yourself.

You’ll need to download a program called Subler. The movie below shows the steps involved.

Note – this does not remove or modify the FairPlay DRM. You’ll still need iTunes or an Apple device to play the movie.

Adding WebVTT Closed Captioned videos in html.

Image of video player displaying WebVTT Closed Captions

Still image from Night of the Living Dead showing WebVTT Closed Captions on screen.

Below is the html for adding WebVTT Closed Captions to this video.

<!DOCTYPE html>
<html>
<video width="796" height="597" controls>
<source src="VIDEO_URL/VideoCaptioned.mp4" type="video/mp4" />
<track src="VideoCaptioned.vtt" kind="captions" label="Closed Captions" srclang="en" type="text/vtt" />
</video>
</html>

Above is the html code for displaying an mp4 video with WebVTT Closed Captions. The user will be able to turn Closed Captions on or off as they see fit.

For an example of html5 video with Closed Captions, you can visit http://mark-sweeney.com/Video/ to see a scene from George Romero’s “Night of the Living Dead.”

Breaking down the important bits of the code:

You need

<!DOCTYPE html>

or it won’t work in Windows 8.

<video width="796" height="597" controls>

Sets the width and height of the dimensions of your video. Change these to match your video. “controls” is gives the user the little bar at the bottom of the video with all the video controls, including the Closed Caption [CC] button.

<source src="VIDEO_URL/VideoCaptioned.mp4" type="video/mp4" />

VIDEO_URL/VideoCaptioned.mp4 – This is the URL address where your video is stored. This tells the browser where the file is, and what kind it is. Your WebVTT text file should also be in the same folder as the video. This way, all you need is the name of the video file and its extension, rather than an entire URL.

track src="VideoCaptioned.vtt"

Your WebVTT text file should also have the same name as your video. “My-Video.mp4” and “My-captions.vtt” won’t work. The file names for the video and the WebVTT files need to be the same, just with different extensions (“.mp4”, and “.vtt”).” Don’t forget, file names can’t have spaces in html, or links to them won’t work.

kind="captions"

This tells your browser what kind of captions they are – captions, subtitles, descriptions, chapters and metadata are they are.

Subtitles are different that captions. Captions often include sounds heard, such as “Phone rings”, or “thunder” etc. Subtitles are usually just dialogue, and you can have several subtitles in different languages. In this case, we’re using captions.

label="Closed Captions"

Label is how the captions track name shows up when the user clicks the Closed Captioned [CC] button.

srclang="en"

This adds “(English)” after the “Closed Captions” label.

type=”text/vtt”

Type tells most browsers what kind of file to expect. Most of them can use this, but Windows 8 needs more attention.

 

For WebVTT to work in Windows 8,  you need to upload a special text file with the name “.htaccess” (without the quotation marks) to the root folder of your server.

In that text file, you need one line of text:

AddType text/vtt .vtt

This allows Windows 8 to read the .vtt text file properly. Otherwise, the video will show options for Closed Captions, but not the captions themselves.

More information on how to create the .htaccess file on PC or Mac can be found here: http://wiki.dreamhost.com/Htaccess

The .htaccess should be in the root folder of your domain. If it is in a subfolder, it will only affect the contents of that folder.

 

WebVTT Closed Caption Testing

I’ve been spending more time learning about WebVTT, a W3C standard for displaying timed text in connection with the HTML5 element – i.e. Closed Captioning for Internet Videos. It took about a day to get it working on Mac Safari, iOS Safari, Chrome for Android tablet, Windows Phone 8.1, Windows (PC) 8.1, and Windows 10.

You can see the video down below, and through this link.

Both the Desktop and Mobile versions of Windows 8.1 were the biggest pains. I finally figured out I needed a .htaccess file on my server with the following line of code:

AddType text/vtt .vtt

This is a plain text file in the main directory of the server with the name “.htaccess” that lets Windows 8 read the .vtt file. Windows 10 didn’t need this.

If you are on a Mac, iOS, Android, Windows 8 or Windows 10 you can watch a Scene from George Romero’s “Night of the Living Dead” with WebVTT Closed Captions (don’t forget to turn on the Closed Captions in settings for whichever platform & device you have).

 

To have the video show up in WordPress with captions took a little work as well. Straightforward html like in this link, didn’t work.

Upload your video and WebVTT files at the same time using WordPress’s Add Media button.

Select the video file and hit the Insert into post button. In Visual View, select the movie, and select “Edit” as shown below.

 

In the next window, select “Add Subtitles”

SafariScreenSnapz002

 

Select the WebVTT file in your media library, and your video should now have a Closed Caption [CC] button.

SafariScreenSnapz003

Currently, the html version of this (http://mark-sweeney.com/Video/) works with:

  • Mac Safari OS X El Capitan
  • Mac Firefox
  • iOS 9.2 Safar1
  • Windows 8.1 Explorer (desktop)
  • Windows 8.1 Explorer (mobile)
  • Windows 10 Edge (desktop)
  • Android 5.1

I’ll add more browsers/platforms to the list as I test them out.