1. Code
  2. General

The State of Video on the Web

Scroll to top
Read Time: 10 mins

A few days ago, Google announced that they were dropping support for the H.264 video codec in its popular browser, Chrome. In light of that, today, we're going to take a look at the ramifications and current state of video on the web.

A Little History

Thanks to fast internet connections and the cost of bandwidth plummeting rapidly, serving video over the internet has become quite popular. That said, playing videos on the web remained an extremely messy affair. There was a mess of codecs and containers to deal with and no direct way to stream content. This void was filled by three solutions: Windows Media, QuickTime and Real Media; they quickly took over the entire market.

Windows MediaWindows MediaWindows Media

I definitely remember this!

Few expected the trio to be dethroned, never mind this early. And yet, that's what happened when Flash video completely took over the entire web streaming market -- practically making the others vanish, sometime around 2005. The others are still alive and kicking, of course, but up until a recently, Flash video was pretty much the only fool-proof, compatible and easy way to get your streaming content on a web page.

Introducing the HTML5 Video Element

Developers all over the world recognized the gaping hole that Flash exposed in the HTML specification and devised the HTML5 spec to fill in the void. The web needed a first class citizen for video, much like images, that browsers could play natively --without having to rely on a plugin, be it Flash, Silverlight, Quicktime, or something else.

And thus, the video element was born.

HTML5 defines a standard way to embed video content in your web sites: through the video tag.

Support for this standard, both among browsers and content distributors, like Youtube and Vimeo, has been increasing at a rapid pace. Needless to say, this element, along with canvas, has almost been the face of HTML5.

The Competing Codecs

This is where things have gotten a bit dicey. The HTML5 specification doesn't specify which video formats, containers or codecs the browser should support through the video tag. Each browser maker is free to choose, and support, any format which they deem appropriate.

Ogg Theora was initially the forerunner for the standard video format but was later removed from the specification, replaced with a more vague specifications. Currently, there are three main codecs that are vying for you attention today:

  • H.264
  • VP8
  • Theora

I'll talk more about the most relevant codecs: H.264 and VP8. Theora, while a contender, isn't really in the running for the lead so we'll skip over it. I don't think we'll need to go over the concept of a video container today as well.

H.264's Background


H.264, also popularly knows as AVC, was developed as a collaborative effort of a number of groups, including the famous MPEG.

It is currently one of the more technically advanced codecs available and provides better frame quality at a much lower bitrate. For the non-techies, you get superior quality at much smaller file sizes.

This is the primary reason why H.264 is used in a large number of places, chief among them being your television stations that broadcast in high definition and high definition optical media, like BluRay.

In addition to quality, H.264 has a number of other things going for it. Content compressed with this codec can be played back by a number of non-PC devices. Reading this on an iPhone? Yep, you can watch H.264 content. Your gaming consoles? Absolutely!

Another point to note is that a lot of said devices have dedicated hardware to decode this type of content. This is why your portable devices have such impressive battery lives. Without hardware support, their CPUs would simply wilt.

VP8's Background


VP8, a relatively new codec, is the brainchild of On2 -- the same guys behind Theora. Google acquired On2 in 2010, and opened up all the underlying patents for the codec into the public domain.

WebM, the container of choice for most current browsers, utilizes VP8 for compressing its video content and Vorbis for its audio. It produces content similar in quality to H.264.

It is completely royalty free, now and for the future. On the downside, though, it has limited hardware decoding support as well as third party device/mobile support.

Google's Decision to Drop H.264

As mentioned in the excerpt, Google recently removed support for H.264 from the Chrome browser. This throws a monkey wrench into H.264's growth among web videos and leaves Internet Explorer and Safari as the only remaining browsers backing the codec. Google's statement below:

We expect even more rapid innovation in the web media platform in the coming year and are focusing our investments in those technologies that are developed and licensed based on open web principles. To that end, we are changing Chrome's HTML5 <video> support to make it consistent with the codecs already supported by the open Chromium project. Specifically, we are supporting the WebM (VP8) and Theora video codecs, and will consider adding support for other high-quality open codecs in the future. Though H.264 plays an important role in video, as our goal is to enable open innovation, support for the codec will be removed and our resources directed towards completely open codec technologies.

Google's Decision: A Brief FAQ

We'll take a quick look at some questions you might potentially have.

Why the sudden change of heart?

Issues of licensing, royalties and openness. H.264 requires royalties for specific scenarios while VP8 and Theora are completely open.

I've heard that H.264 is free for a lot of uses. Is there more to it?

While currently free, if the content is distributed free of charge, it isn't set in stone. Remember that MP3 had quite liberal licenses early on as well. H.264's licenses change periodically, 5 years or so, so something that's free today may not necessarily be so tomorrow. There are no such issues with VP8.

Is this a way of Google trying to control which format the web uses?

Not really, no. WebM is already supported by Opera and Firefox [upcoming versions]. It is also backed by a good portion of the web community. It is much more a question of openness than control.

Editor's Note: That said, is it not fun to watch the silent slaps in the face that Apple, Google, and Microsoft throw? Tensions between Google and Apple have increased quite a bit in recent months.

What if Google suddenly becomes evil and starts charging royalties?

VP8 is under a BSD license. It is also under an irrevocable free patent license. This is about as close as you can get to free. You won't have to fess up royalties, now or in the future. Period.

Firefox users can already view H.264 content with a plugin. So what's new here?

Plugin is the keyword here. Instead of becoming a first class element, video is, again, delegated to plugins. If you're going to install a plugin to watch H.264, why not just use Flash? It's not as bad as people make it to be!

So I can use plugins to watch H.264 content?

Absolutely, Pipe it through Flash or Silverflight or whatever floats your boat. There's just no native support.

Google already bundles Flash, a closed platform. Logic failure?

Nope, not even close. Flash, the player, doesn't require royalties. In fact, you can take the specification and create your own player. Chrome just comes bundled with Flash for easier logistics.

H.264 is everywhere, goshdarnit!

It sure is. But I believe a contender must be chosen, based on merits and licensing, not just the former. This applies even more for the web, a messiah of openness.

But, but, I shoot all my videos in H.264. Encoding it with another codec is annoying.

You're probably already compressing it before uploading it to the video service of your choice. Why not simply compress it with VP8? Also, if you are the provider, you're already re-converting user uploaded videos. Just convert to VP8 now!

But WebM converters suck!

Touche, my friend. Compared to H.264, the tools at hand are sparse. We need to wait it out while someone fills the market's demand.

Why remove support for it now?

Because the spec, and the war, isn't over, not by a long shot. Google can afford to make a change here and prevent a H.264 monopoly in the future.

What this Means for a Regular User

To a regular Joe web surfer, nothing changes for you. As long as you use a modern-ish browser, you can continue consuming web video content, be it YouTube or Vimeo - as long as the provider transcodes the content and server them efficiently and effectively. In fact, you don't even have to use a modern browser if the provider provides decent fallbacks

In your world, nothing changes. It's just a bunch of geeks talking about things that you can't even vaguely comprehend.

If you're a mobile user, though, you're in for a world of trouble. With most mobile platforms locked down so hard [Apple, I'm looking at you], changing browsers on your every whim is hard. Additionally, most mobiles only have hardware to decode H.264, not VP8. This means two things:

  • Possible choppy performance: Without dedicated hardware decoding, performance may possibly suffer for higher quality videos.
  • Worse battery life: As your CPU continues to thrash trying to decode your content, your battery life is going to take a big hit.

Yes, I know it sucks.

What it Means for a Web Content Producer/Distributor

For desktop users, it really doesn't change much for you either. If you've been already serving content appropriately encoded for every browser, you should be alright for now. Remember, you've already had to serve WebM or Theora content for Firefox and Opera; so nothing changes for desktop users.

For mobile users, it, again, is a mess. No mobile browser supports WebM or Theora as of now, while almost every mobile has dedicated hardware for H.264. In order to accomodate everyone, you'll need to have two version: one encoded with H.264 for mobile users, and another with WebM/Theora for everyone else.

You'll have to face doubled computational costs and storage. Or you can choose to skip HTML5 video altogether and go with Flash for serving content but, uh-oh, iOS devices can't play Flash content.

If you have to serve video content for mobile users and are facepalming right now, we can understand your plight and you have our sympathies. Fight on, soldier!

What it Means for Flash and HTML5 Video

In the short term, further adoption of the video element can suffer as developers wait for the dust to settle before making a decision regarding implementation. You'd probably not want to go with a technology that may be doomed to fail. This also means that usage of Flash for video content will possibly spike over the next few months, ironically.

In the long term, it will lead to a stronger and more open web. No one wants a repeat of the GIF or MP3 fiasco and I feel it's right that Google has finally dropped support for the codec. Props to Mozilla as well for not giving in amidst uproar over not supporting the codec.

Codec Support in Modern Browsers


Universal pricing table from GraphicRiver.

This is how the compatibility chart will read a month from now, when Chrome drops H.264 and Firefox and Internet Explorer adopt WebM.

With mobile browsers, the situation is simple enough to not warrant a chart. Every mobile browser support H.264 and nothing else.

That's a Wrap

I hope that you've found this write-up interesting. We've tried to go with a slightly different topic today, diverging from our usual web development content. I'm sure there are lots of perspectives I've missed in this article, so remember to chime in with your comments. Thank you so much for reading!

Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.