The Future of Web Video, Part 1 | www.creativeplanetnetwork.com
RSS
Home
Loading

The Future of Web Video, Part 1

I admit that the nexus is a bit tenuous, but if you're an Apple Final Cut Pro producer, you're undoubtedly producing for the Web. Over the past few months, you've been hearing that Flash is going away, H.264 is going away, and soon you'll have to produce all your video in an open-source video codec called Ogg Theora (of all things). Well I'm here to tell you why that won't happen, so you can push away all those scary, vicious rumors and go back to what you do all day.

This is a two-part article. Part 1 will take a look at HTML5 and what it can and can't do, and part 2 will focus on the future of Ogg Theora.

Starting from the beginning


Let me start from the beginning. Until about a year ago, most video playback in a browser occurred via a plug-in—usually Adobe Flash, but also Windows Media, Apple QuickTime, and Microsoft Silverlight. What's new about HTML5 is that it implements a video tag directly in the HTML code on the web page, so no external plug-in is required to play the video. However, instead of relying upon a plug-in to decode the video, the browser would have to ship with the codec necessary to decode the video.

In a perfect world, there would be one video codec, it would be free, and all the browser vendors could simply include the decode component with their browsers. We could all encode to that one format and the video would play in every browser, no plug-ins required.

As we all know, the world isn't perfect. As HTML5 stands today, there is support for multiple codecs, including Ogg Theora, H.264, MPEG-4, and Dirac. H.264 and MPEG-4 are encumbered by patents, and a browser vendor would have to pay up to $5 million to include H.264 playback in its browser. In contrast, Ogg and Dirac are generally considered to be free of patents, though many acknowledge that "submarine" patents may exist (patiently waiting below the surface) to pop up and claim royalties once its use becomes more mainstream (more on this below). So there is no single codec that will play on every browser without a plug-in.

Which browser supports HTML5 and which codec? Figure 1 shows the browser market share. Currently, though Microsoft has publicly come out in favor of the video tag, it doesn't ship any codec with Internet Explorer and continues to rely solely upon the Flash and Silverlight plug-ins. Mozilla Firefox supports HTML5 and includes Ogg Theora, but not H.264. Apple Safari includes H.264, but not Ogg. Google Chrome is the only browser that includes both codecs.

On its face, Microsoft's intransigence, combined with its market share, would seem the death knell for the HTML5 video tag. One potential workaround is Google Chrome Frame, a plug-in that delivers HTML5-type capabilities to IE, but I tried it on two computers and succeeded only in crashing YouTube's HTML5 trial page every time I tried to load it. Two computers do not an exhaustive trial make, but if you Google "Chrome Frame crashing," you'll get more than 780,000 hits, so at least one or two other folks met the same fate. Besides, I'm not sure how many actual users will grok the zeitgeist of loading one plug-in (Chrome Frame) to avoid having to load another (Flash, Silverlight, or QuickTime).

Fear not, however; there's a better solution. Specifically, you can create code with alternate tags that will serve the video to all relevant browsers. For example, Camen Design has a Video for Everybody site with code that will first try Ogg Theora playback via the video tag on browsers that support it, then QuickTime playback if HTML5 fails, and then Flash. Other sites have implemented the video tag for both H.264 (for Chrome/Safari) and Ogg video (Firefox or Chrome, which will play the file listed first if both are available), with fallback to Flash if the browser doesn't support HTML5.

Figure 2. The basic Google Chrome player playing an Ogg Theora file.

Figure 2. The basic Google Chrome player playing an Ogg Theora file.

What does the player look like?


Let's spend a few moments on player appearance and/or features. If you go the bare-bones video tag route, you get a simple player that looks subtly different on each browser, like that shown in Figure 2.

Figure 3. Jilion's SublimeVideo HTML5 Video Player in Chrome. Still pretty simple, but it looks the same on all browsers.

Figure 3. Jilion's SublimeVideo HTML5 Video Player in Chrome. Still pretty simple, but it looks the same on all browsers.

Of course, you can customize the player using either CSS or JavaScript, which leads to a category of products like Jilion's SublimeVideo HTML5 Video Player, shown in Figure 3. Design in the SublimeVideo Player and your pages will look consistent on all HTML5 browsers, and the player will fall back to Flash for browsers that don't support HTML5, though Flash support is not yet incorporated in the company's web demo.

Figure 4. YouTube's HTML5 player.

Figure 4. YouTube's HTML5 player.

How far can you go design-wise with Javascript and CSS? Both Vimeo and YouTube recently released beta HTML5 players that support H.264 via the video tag. To try out the YouTube beta, go to www.youtube.com/html5 and opt in. For Vimeo, you can toggle from HTML5 to Flash on every page with video.

At least initially, YouTube's player doesn't work with videos that have advertising, annotations, or captions, and it doesn't offer Flash fallback, so if you're running Internet Explorer (without Chrome Frame) or Firefox, you'll get an error message when the video tries to play. Otherwise, the players are similar to the current shipping Flash Player, though obviously YouTube needs to get the advertising element working to keep the doors open.

What about Flash?


Interesting question. At this point, any website owner would have to be certifiable to jump exclusively to HTML5 without fallback to Flash, since if they continued to use H.264 video, they would lose 86 percent of their viewers. Ogg support via the video tag would return 24 percent of the potential eyeballs, but there are issues there that I discuss below.

So why consider an alternative to Flash? One issue is lack of Flash support in the Apple iPad. To me, the iPad seems like a glittery solution in search of a problem, but I thought the original iPod was a technological me-to with white earbuds and an unworkable flywheel. Go figure. If the iPad takes off, it will force many publishers to find a solution that works with both HTML5 and Flash.

 
Related Links

The Future of Web Video, Part 2

Welcome back. In our last edition, I detailed what HTML5 is and why it's important and set the stage for my analysis of Ogg Theora, which was supposed to be the focus of this second part...


A Coming War Over Web Video?

You could hear the jeers the instant Apple introduced its iPad last week. It was a common refrain: "No Flash support? What's the point?"...


Distribute Expertise: Flash vs. Silverlight

Since its introduction at NAB Show 2007, Microsoft Silverlight has achieved a number of high-profile design wins including mlb.com, nba.com, and NBC's...

Other issues to consider using a Flash workaround include the nominal reasons that Apple declined to support Flash in the iPad. As Trevor Boyer recently reported, in making this decision, "CEO Steve Jobs complained to his employees about Flash performance and blamed it for causing Apple products to crash."

Crashing is very hard to quantify, and in a response to the iPad announcement, Adobe's CTO, Kevin Lynch wrote:

"Regarding crashing, I can tell you that we don't ship Flash with any known crash bugs, and if there was such a widespread problem historically, Flash could not have achieved its wide use today. We work directly with the major browser teams—including Apple Safari, Mozilla Firefox, Microsoft IE, and Google Chrome—and review any emerging issues so we can resolve them together. Before we release a new version of Flash Player, we run more than 100,000 test cases and have built an automated system that has scanned over 1 million SWFs that we use for testing from across the Web. Our QA lab has a very large variety of machines to represent the machines in real use on the Web."

In my opinion, Flash is too widely used to have a laundry list of fatal bugs, but that's just an opinion. I don't think the sky is falling because Flash is unstable, but if you do, HTML5 lets you avoid the problem—but only on the browsers that support it and your selected codec, of course.

On the other hand, performance is objective, and it turns out that Mr. Jobs had plenty to complain about there. In the same post, Lynch addressed the performance issue, stating:

"Video rendering is an area we are focusing more attention on—for example, today a 480p video on a 1.8GHz Mac Mini in Safari uses about 34 percent of CPU on Mac versus 16 percent on Windows (running in BootCamp on same hardware). With Flash Player 10.1, we are optimizing video rendering further on the Mac and expect to reduce CPU usage by half, bringing Mac and Windows closer to parity for video."

I haven't run these tests, but I'm sure lots of folks will when Flash 10.1 is released. Once the YouTube and Vimeo HTML5 sites go final, it will also be interesting to see how playback efficiency varies between the Flash versions of each site and Chrome and Safari decoding with their native H.264 codecs.

OK, that's it for now. If you decide to support HTML5, you have to choose a codec, and we'll return to discuss that in two weeks.