Safari 5 now available, shows captions in HTML5 video

11 comments

Late yesterday, Apple announced Safari 5, the latest version of their web browser. Many improvements were made to it, speeding it up, adding Instapaper-like Safari Reader capabilities, and so forth. Accessibility took a step forward, because Apple tweaked the HTML5 video tag support to enable captions of HTML5 video within Safari 5.

I threw together two lines of HTML code, and got video working in Safari 5, showing the captions:

11 comments

11 Comments

Comments
Jun 9, 2010
8:50 am
#1 Demo Demo :

Please add code / demo. Thanks!

Jun 9, 2010
10:57 pm
#2 genius :

Check out my quick and dirty sample here.
I threw this together, so it’s not a perfect example of HTML code, but it’ll work.

Go to about 38 seconds into the video, then press play and you will see captions. (I couldn’t edit the clip down without losing the caption track.) This only works in Safari 5. Try in any other browser at your risk.

To view the source code, go to the View menu, then choose “View Source.”

Have fun, and if you have any better samples/demos, post ‘em here.

Jun 10, 2010
1:16 am
#3 Rene Visco :

Hi, it did not work on my end. Strange. Safari 5.0

Jun 10, 2010
3:06 am
#4 Demo Demo :

It doesn’t have any closed captions, should have been as a element.

You have just

Jun 10, 2010
8:43 am
#5 genius :

Rene: Weird. I tested it on Safari 4, definitely does not work, then on Safari 5 on my other Mac, works. Here’s a screenshot:
CC testing - Safari 5 and HTML 5 video

I’ve gotten confirmation from a friend who says it works under Safari 5 for him as well.

Demo Demo: Your response is incomplete – but as far as I know, you do not need to add a separate HTML CC element. I’ve tested the captioning on several other videos I have (too big to post, obviously) and they work in Safari 5, but not Safari 4. However, I could be mistaken by how I’m going about this. :)

Jun 10, 2010
4:50 pm
#6 someoneontheinternet :

genius; that’s different from the HTML5 element being talked about here. Looks like you simply added the captions to the encoding with Handbrake. This is not the same thing. With the new HTML5 element, you can turn on and off captions, as the captions are separate tracks from the video themselves.

In other words, the simple fact that this works in Safari 4 shows that it’s not the same thing.

Jun 10, 2010
5:16 pm
#7 Ken Brown :

Interesting. It works on my Safari 5.0 fine. However, it does not show subtitle/caption on my iPad. I did selected “ENGLISH” in Audio & Subtitles menu while the video is playing. No subtitle. Hmmm…

Jun 10, 2010
10:08 pm
#8 genius :

Someoneontheinternet:
Please point me to somewhere that explains the new HTML5 caption element. I would be very interested in learning more about it, rather than reading vague allusions to such a thing via the cryptic whisperings of anonymous commenters.

Are you also saying that you’re seeing the captions work on Safari 4? I have two Macs with Safari 4 that do not show the captions from this example video.

Jun 10, 2010
10:10 pm
#9 genius :

Hello Ken! Yeah same result here re iPad. You know whats weird? The same video worked fine on my iPad over wifi at home. LOL.

Jun 14, 2010
9:12 am
#10 Craig :

Hello there,

I did some testing before the caption tag came up in Safari 5 with the ability to show different skin + subtitles.

http://craigbutcher.net/2010/05/accessibility-within-multimedia/

Now I will have to go and update this!

Craig

Trackbacks to this post.

Sorry, comments are closed.

Previous Post
«
Next Post
»
D-scale designed by Deaf Geeks StudiosIn conjunction with Deaf Geeks Studios Web Hosting | ... | ...