HTML5 Video

A Quick Guide

You'll have probably heard someone mention HTML5 and maybe even nodded sagely in agreement, but the chances are they understood about as much about it as you do. Or did at least - because here in one entertaining, decisive, informative and - most-importantly of all - short piece, I'm going to tell you everything you need to know to sound informed, possibly even be informed and, hopefully, make the right decision about it. Which, as you'll discover, is to do absolutely nothing.

Background

HTML is the primary language used to produce most web sites. HTML5 is the latest iteration of HTML to be introduced by the World Wide Web Consortium (WC3).

HTML5 contains a video tag that enables browsers (Firefox, Chrome et al and sometime soon Explorer) to natively play back video within the page. This means no more plug-ins like Flash, QuickTime and Silverlight.

It wasn't until Apple dropped the Flash free iPad onto the marketplace that anyone noticed HTML5. Cue the inevitable Flash vs. HTML5 arguments with ranks of geeks taking sides with either Apple or Adobe. It's the biggest argument in geekdom since Captain Kirk v Jean-Luc Picard.

HTML5 sounds great - it's easier to embed, offers universal support and is open source. However... only around 50 percent of available browsers support HTML5. That's available browsers. Not those in actual use.

Consider this...

You're building a nice new website. You commission us to make some video for you.
Normally we'd provide you a) a Flash embed code streaming an encoded mp4 h.264 file and b) a direct path to that file for iPhone/iPad etc.

However, you've been listening to Steve Jobs and someone in the office who claimed HTML5 was the future. You've dropped your current plug-in-based technology, and produced your website in an HTML5-compatible format that played on the iPad.

The Problem Being...

Then you browse to your website on your computer- chances are you won't see the video.

Only Apple Safari and Google Chrome – both with around 5 percent market penetration – can play HTML5 video in H.264 format. If you're using Firefox it can’t play H.264-encoded video in HTML5 (it will via the Flash plugin though!).

Firefox – at 23 percent market share – is by far the most popular HTML5-compatible browser so this is a bit of a problem.

To play in Firefox we'd need to encode your video into the beautifully named 'Ogg Theora' format, which is much lower quality than H.264 and isn’t supported in any of the more popular encoding programs like Adobe Media Encoder, Apple Compressor or Sorenson Squeeze so you'll need to come back to us for any other encoding of the file.

So that's fixed it?

No. Armed with your H.264 and Ogg format you'll be reaching 40 percent or so of potential viewers.
To satisfy the rest, you still have to make your video available using your plug-in based technology (Flash) that we provide you with regardless.

It also results in some quite complex code on the web page. Is it this broswer? Is it this version of this browser? Can it do this? What's your mother's maiden name?

So riding to the rescue is Google and their eagerly anticipated WebM technology! Or not as it happens...

It'll work with Opera though Apple won’t support it, and Internet Explorer 9 will only support it if already installed on the system.

So you’ll still have to encode in H.264 for Safari, Chrome, and Internet Explorer 9; Ogg for older versions of Firefox and Opera; WebM for newer versions of Firefox, Opera and Chrome; and possibly VP6 or VP8 for Flash (or Windows Media for Silverlight).

Coming Soon...

At some point, HTML5 (or later) will become so established that major video distribution sites and user-generated video sites will drop Flash playback.

Flash will become less important to viewers so fewer will install the plug-ins. At that point, sites that don’t support HTML5 will have to start doing so.

Right now the headache of supporting HTML5 far outweighs any benefits. General support for HTML5 on your primary website doesn’t need to be a priority.

And what about video production?

For the time being NextShoot give you everything you need to ensure your file is available across all platforms and devices.

So the question really is as we all gear up towards an increasingly mobile world does the nature of video communication change? The answer is yes. Video formats are becoming punchier and shorter. We've made 8000 videos of under 30 seconds so far this year.

It's also useful to be able to navigate a video. We've built a system to allow you to 'chapterise' video and for users to seek to a specific point within a video in both HTML5 (on the iPad) and in Flash (on a desktop or laptop).

If you’re keen for your video to be seen on iPad I'll show you a bit of code that'll do it in two minutes - or you can visit www.nextshoot.com/iphone and lift it off the page.

If you have any questions please email mike@nextshoot.com