html5 logoWe receive a lot of questions from customers about HTML5.  Most people who deal with video regularly in their business have heard that HTML5 supports a simple <video> tag.  Simply drop that tag into your page, and you’ve got a full-fledged video player, ready to go and able to be played on every modern web browser out there.

Well, that’s not quite the case.  The <video> tag, and HTML5 as a whole, was created by standards committee.  And, just like every standards committee, multiple political and organizational forces push development of those standards in many directions.  Video in the browser is particularly subject to this: many popular video and audio codecs are patentencumbered, and many of the major players who create browsers are patent holders.

The net effect is that HTML5’s <video> tag has a very confusing set of supported video and audio codecs.  The following table is adapted from excellent Dive Into HTML5 by Mark Pilgrim

Video codec support in today’s browsers
Codecs/container IE Firefox Safari Chrome Opera iPhone Android
Theora video, Vorbis audio,  Ogg container 3.5+ * 5.0+ 10.5+
H.264 video, AAC audio, MP4 container 3.0+ 5.0–? ** 3.0+ 2.0+
WebM video/audio/container 4.0+ * 6.0+ 10.6+
* Safari will play anything that QuickTime can play. QuickTime comes pre-installed with H.264/AAC/MP4 support. Extending QuickTime to support Theora and WebM requires users install plugins, which few are likely to do.
** Google Chrome will soon drop support for H.264.

Clearly, this is a complicated landscape that will require another 5-10 years to clear up and standardize.  Furthermore, HTML5 has limited to no support for what an even basic native or Flash-based player will get you:

  • Events that fire on active (play, pause, etc.) and passive (video complete) events
  • Ability to determine location in video file for bookmarking and experience tracking
  • Adaptive bitrate switching (outside of, perhaps, HTTP Live Streaming (HLS) on Safari and iPhone)

HTML5 is not a video panacea.  Always drop <video> tags on HTML5 pages with utmost caution.  It’s not that simple, yet.

Learn More About Mediafly ProReview


Subscribe to Mediafly's Blog