To call HTML5 Video a hype would be an understatement. Every week, major tech companies announce improved support or new breakthroughs. Literally hundreds of new blogposts a day pop up on Google's blog search. In this debate, no company is as vocal as Apple.

The company's latest move is the release of an HTML5 showcase that includes a video demo featuring the capabilities of web standards such as HTML5, CSS3, and JavaScript. This effort, while exciting, is misleading and potentially detrimental to the landscape of web development and browser compatibilities. The demo is definitely inspiring and helps to move HTML5 Video along at a fast clip. At the same time though, none of the cool gizmos on this page are actually web standards. Instead, they are specific functionalities found in Apple's Safari/Quicktime product stack (which is why access is restricted to Safari). A breakdown:

The Video

Although the video codec debate has heated up with Google's release of WebM, Apple firmly stands by H.264. The demo offers no OGG or WebM version of the video, just an image fallback:

<video id="videoShowcase" width="848" height="352"
  poster="... /images/tron_legacy.jpg"
  loop="loop" autoplay="autoplay" autobuffer="autobuffer">
  <img src="... /images/tron_legacy.jpg">

The loaded video is actually not an MP4 but a MOV. MOV, 99% similar to MP4, is the container format of Apple's Quicktime technology. This video only works on Safari, and in order to play this video in Safari on Windows, a user must have the Quicktime plugin installed. No other browser is able to play the video.

A more standards-based approach would be to use an MP4 video instead of a MOV one, while simultaneously also offering an OGG video. That will work on all HTML5 browsers.

The Controls

The scale, mask and perspective video controls are very slick, but unfortunately still browser-specific features. Here's how the CSS of the video looks with these options enabled:

-webkit-mask-image: url(... /images/tron_mask.png);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 100% 100%;
-webkit-transform: matrix3d(0.64,0,0.64,0,0,0.83,0,0,-0.53,0,0.76,0,0,0,0,1);
-webkit-transform-style: preserve-3d;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: cubic-bezier(0, 0, 0.58, 1);

This chunk of CSS3 will only render on Webkit-based browsers: Safari and Chrome. Firefox and Opera will not recognize these proprietary style rules.

A more standards-based approach would be to use mask, transform and transition CSS rules using both -webkit-, -moz- and -o- prefixes. Apple could be frank about the draft status of these functionalities and the current differences in browser implementations.

The Description

The description below the video mostly talks about Safari's proprietary HTTP streaming technology:

The HTML5 video tag allows you to integrate video within your website's code. And Safari offers HTTP streaming, so playback quality dynamically adjusts to the available speed of wired or wireless networks — perfect for viewing on mobile devices such as iPad, iPhone, and iPod Touch.

Unfortunately, HTTP Live Streaming only works on the iPad, iPhone, iPod Touch and Mac OSX 10.6 (with Quicktime X). Additionally, the technology requires one to encode videos into an obscure format: hundreds of small MPEG-TS fragments, glued together using M3U8 playlists. These video files are completely useless for any other browser or media player.

A more standards-based approach would be to explain that seeking to non-downloaded parts of the video (like YouTube) is possible. This functionality, using HTTP Range-Requests, is supported by all HTML5 browsers. HTML5 video at large has no capabilities in the area of bandwidth detection and on-the-fly bitrate switching.

HTML5 is About Standards

Undoubtedly, no one has done as much for HTML5 Video as Apple has to date.  However, we must be sure to not overlook the progress Flash made when they started supporting video a couple of years ago. Suddenly it was possible to easily display videos on a page, regardless of browser or operating system. Only one chunk of code and only one video file were needed; plugin daisychains and forced installations were a thing of the past. Due to its ubiquity, Flash effectively enabled the online video surge of the last few years.

Similarly, the big promise of HTML5 Video is of it being a widely adopted and highly standardized technology. While Apple may see it as a means to reach feature parity with Flash, most web developers see it as a simple solution for including video in a webpage without worrying about plugin support. Web standards are about removing incompatibility barriers altogether. They are not about replacing plugins with proprietary browser addons, which is exactly what Apple has done here.

It would be awesome for Apple to start advocating the use of cross-browser HTML5 Video, being honest about what the technology can and cannot do today. Alternatively, it would be great for Apple to tell developers what its demo actually is: an excellent showcase of the video capabilities of its Safari / Quicktime product stack. Regardless, Apple should stop labelling vendor-specific implementations as web standards. It confuses web developers and it will lead to a new era of browser incompatibility that will slow down the overall adoption of HTML5 - and the conveniences it brings to web developers around the world.

About our Guest Expert - Jeroen "JW" Wijering and Zachary Ozer

Jeroen is a pioneer when it comes to online video, Period. He is the Chief Digital Architect at LongTailVideo and is the creator of the incredibly successful JW Player, which has generated several million downloads since their launch in 2005. In addition, Jeroen has developed several other projects including, an online magazine for entrepreneurs and professionals as well as an online video hosting platform/service called Bits on the Run.

Zachary Ozer is a Developer at LongTail Video and co-authored this post with Jeroen.