Beginner’s Guide To Watching HTML5 Video In Your Browser

There has been much news and debate regarding HTML5 video, which is not even considered an official standard yet. The urgency from some individuals and organizations (particularly Apple), reflects the bad taste that Adobe Flash Player has left in many mouths. HTML5 video is an effort to make streaming video on the web more accessible, better integrated, and with increased performance.

Although it is not yet an official standard, HTML5 video is available on many websites, including YouTube, and most major browsers have preliminary support for it. Unfortunately, the browser makers have not agreed upon a standard codec, so you will need to know what will work in which browsers. This brief guide should help you navigate through the jargon and get a glimpse of what might be the future of video on the Web.

The Formats

There are currently three distinct video formats that are used in HTML5 video streaming:

1. Theora – the free and open video codec that was originally intended to be the only HTML5 specification.

2. H.264 – a patented video codec that Apple, Google, and others believed to be superior in quality to Theora.

3. WebM – a new free and open format that uses the VP8 video codec, which Google recently purchased and then released into the open source community. It now has the support of Google, Mozilla, Opera, and many others.

The Browsers

Mozilla Firefox – Current versions of Firefox (3.6.3) will display Theora videos only. Mozilla has no plans to support H.264 because of the legal implications of its software patents. For those who want to try the new Google WebM format, you can download a WebM nightly build of Firefox. Firefox also has support for fullscreen HTML5 video.

Microsoft Internet Explorer – The current version of IE (8) does not support any HTML5 video out of the box. Users who wish to try it must download Google Chrome Frame (available for IE versions 6,7, and 8). This plugin adds HTML5 technology to IE. Version 9 of IE is expected to support H.264 video by default and will also support WebM, but the user will have to download the codec.

YouTube video in Internet Explorer with Chrome Frame

Apple Safari – The current version of Safari (4.05) supports H.264 video out of the box, but does not support Theora or WebM, and there are apparently no plans to support either.

Google Chrome – Current Chrome versions (5.0.375.55) support Ogg Theora and H.264 video, and development versions also support WebM, making it the only browser to support all three. Users can try the development versions through Google’s Early Release Channels.

Vimeo player in Chromium

Opera – The current Windows and Mac version of Opera (10.53) has support for Ogg Theora video. Linux users must download the beta version of 10.53 to get support. 10.54 will support WebM video. Users can download the latest version to try it.

Other Browsers – Unfortunately, many websites are using browser detection to determine if they should send HTML5 video to the user. The result is that browsers like Konqueror, which reportedly have HTML5 video support, do not work without user agent switching. The Apple iPad also has HTML5 video support, and many major websites (NY Times, CNN, etc.) are specifically targeting the iPad and, therefore, still display Flash videos even to browsers that support HTML5.

The Websites

There are several good websites where users can try out the various incarnations of HTML5 video. Feel free to add others in the comments section.

SublimeVideo – This one is probably my personal favorite. 720p video, supporting Safari, Chrome, Firefox, IE, iPad, and iPhone.

Sublime video in Firefox

YouTube – Currently it offers both H.264 and WebM. Users must join the beta to view it. Videos with ads are not included.

Vimeo – Vimeo will show any of its videos in H.264 format.

Kaltura –  A demo of the movie Big Buck Bunny in the Kaltura player.

Although it is still unclear how HTML5 video will ultimately turn out, it is an exciting time to watch the development of this new technology. The ultimate goal of HTML5 is to make the overall Web experience better, and HTML5 video is one step in the right direction.

Tavis J. Hampton

Tavis J. Hampton is a freelance writer from Indianapolis. He is an avid user of free and open source software and strongly believes that software and knowledge should be free and accessible to all people. He enjoys reading, writing, teaching, spending time with his family, and playing with gadgets.

Subscribe to our newsletter!

Our latest tutorials delivered straight to your inbox