Crash course: HTML 5 video

So you want to add HTML 5 video to your site? Here's how.

If you want to watch Internet-delivered video on your PC, the vast majority of Web sites have settled on a single, consistent way to do that. That's the good news. The bad news is that this single, consistent delivery system is Adobe Flash, with all its security and stability issues.

But now a new way to deliver video through a browser is coming to the fore, one intended to be native to the browser itself: HTML 5's <VIDEO> tag. In this article I'll look at how the <VIDEO> tag can be used with the new generation of browsers. I'll also examine how parts of this equation -- the browsers and, to some degree, the video formats themselves -- are also still very much in flux.

Online video before HTML 5

One could fill a decent-size book talking about all the formats that have been used to deliver Web video at one time or another: Microsoft's .avi and .wmv container formats and the gang of codecs delivered with them, Apple's QuickTime, RealNetworks' RealVideo and RealAudio formats, and so on. Microsoft's Silverlight also deserves mention, since it allows providers such as Netflix to distribute content with embedded copy protection -- a feature not likely to fall out of demand as long as money changes hands for video content.

However, the video delivery system that's most widely deployed right now is Adobe's Flash.

The Flash Player was, and still is, one of the few browser add-ons that almost everyone is likely to have. Browsers on Macs and PCs alike typically support Flash by default, since a growing amount of Web content in general depends on it. It could be argued that Flash has become a video-delivery system as a byproduct of its original intention, which was to bring vector-based animation to the Web.

But Flash has problems as a video delivery system. It's proprietary. It requires the use of third-party code rather than something native to the browser. It has been lambasted for its lack of security and instability. The list goes on. It's a solution, when people have been hungering for the solution.

Hello to the <VIDEO> tag

The history of the <VIDEO> tag starts with the Web Hypertext Application Technology Working Group (WHATWG), a consortium made up of folks from Apple, the Mozilla Foundation and Opera Software. The WHATWG was created in 2004 to focus on the development of HTML 5 as a response to what it felt was the disregard of the World Wide Web Consortium (W3C) for real-world developers vis-à-vis XHTML and the then-extant HTML standards.

The first proposals for a <VIDEO> tag were submitted to the WHATWG in 2007 by Opera Software. The idea was simple: Create a framework in which Web browsers can natively play back video without being forced to fall back on third-party plug-ins. The user gets the experience of video that just works, those hosting the video have less maintenance to perform, and everyone walks away happy.

That's the theory, anyway. The practice has been another story entirely.

The codec conundrum

When the <VIDEO> tag was first proposed in the HTML 5 draft specification, one key omission from the spec was which video (and audio) codecs would be natively supported by the browser. As a result, while there are several video codecs that can be used in conjunction with the <VIDEO> tag, browser makers are not obliged to support any one of them: It's entirely their choice which codecs to include support for.

The original plan involved specifying the Theora video and Vorbis audio codecs as a baseline that all browsers should be able to play, but this was dropped in favor of an approach where no specific codec was recommended. Instead, the WHATWG expressed a desire for a codec that could be used in an unencumbered fashion and had a better guarantee of patent indemnity than Theora/Vorbis offered at the time.

The change sparked criticism among developers and might well have been one of the motivating factors in Google's offer of the VP8 codec as another baseline codec candidate.

1 2 3 4 Page 1
Page 1 of 4
7 inconvenient truths about the hybrid work trend
Shop Tech Products at Amazon