HTML5 video tag

In the HTML5 video code here …

<video width="320" height="180" controls>
	<source src="iStock_video.mp4" type="video/mp4">
	<source src="iStock_video.webm" type="video/webm">
	<source src="iStock_video.ogv" type="video/ogg">
</video>

Is the third “source” line really necessary? Any browser that support ogg would support MP4 and/or WEBM, right?

Why do you have the most commonly supported format listed third instead of first?

Stephen:
the mp4 needs to be listed first to support some older iSomethings which wouldn’t bother looking further down the list for what it needs if it wasn’t #1. This was fixed in a later version, so now it’s just to get so many devices as possible working.
*edit it was iPads with OSx3… there’s a free upgrade to OSx4 which fixed this bug, but you never know who’s upgraded.

Any browser that support ogg would support MP4 and/or WEBM, right?

Hm, no… FF3.5+ supports ogg but not WebM… FF4+ supports WebM. I’m still on 3.6x because Mozilla did a bonehead thing: they decided on a release-track of every 6 weeks (this alone’s not so bad), but with immediate drop of support for the previous, meaning there’ll never be another stable version of FF out there that supports my necessary-for-debugging-stuff plugins.

Some developers at Mozilla realise this and there’s talk of having some stable long-term version while the 6-week-release thing continues on its own, like Ubuntu does, but there are also apparently die-hards who don’t care if a browser actually works the way users want who are arguing against this. Prolly the same people who removed the Properties option from the context menu “because only nerds need it”… so someone made a plugin to bring it back. Sigh.

I wonder though if it’s still recommended to list the codecs as well in the video code?


<source src="iStock_video.mp4" [i]type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"[/i]>

(notice the quotes around codecs, those are nested)

Are you also planning a Flash fallback?

Yes, I have Flash fallback. But for simplicity, I did not include it here in the sample code. I assume that if I omit ogg, users of FF3.5 would get the Flashfall. The problem is that it takes so long to convert from MP4 to OGG (for say hour long video, etc).

I’m not sure about including the codecs either. I figure that the browsers can figure them out.

The problem is that it takes so long to convert from MP4 to OGG (for say hour long video, etc).

Hm, my understanding of WebM is that it’s basically ogg in a different wrapper.

But anyway yeah if you’re ok with the non-webM, non-mp4 users getting Flash, you could leave ogg out. Though as Stephen said, ogg is very widely supported. Apple’s the major holdout here, sticking to H.264 with a passion.

I figure that the browsers can figure them out.

It might be just for when you have a few of the same type, but different codecs (like lo-quality for mobiles or crappy-bandwidth users, and then high-quality for hi-speed users…).

Also Opera 10.50. 10.60 onward support WebM.

Yeah.

You need double quotes for the codecs parameter. Single quotes are invalid and won’t be parsed correctly. Which means that you either need single quotes for the whole attribute value or you need to escape the nested quotes as "

No. “Ogg” is video codec Theora and audio codec Vorbis in wrapper Ogg. “WebM” is video codec VP8 and audio codec Vorbis in wrapper WebM (which is almost identical to Matroska). So the audio codec is the same, but the video codec and wrapper are different.

Personally I wouldn’t bother with including the Ogg version. MP4+WebM+Flash will reach everyone anyway. Firefox 3.5 and Opera 10.50 users should upgrade.

You need double quotes for the codecs parameter. Single quotes are invalid and won’t be parsed correctly. Which means that you either need single quotes for the whole attribute value or you need to escape the nested quotes as "

Ah, thanks. I noticed Pilgrim did this but thought it was just his quote-nesting preference.

“Ogg” is video codec Theora and audio codec Vorbis in wrapper Ogg. “WebM” is video codec VP8 and audio codec Vorbis in wrapper WebM (which is almost identical to Matroska). So the audio codec is the same, but the video codec and wrapper are different.

So the difference between VP3 and VP8 are that great? And yeah I thought WebM wrapper was Matroska, so good to know it’s a bit different.

Firefox 3.5 and Opera 10.50 users should upgrade.

Would love to. Just wish FF5 wasn’t bigger, slower, and broken :frowning: but then I’m not watching videos with FF.