-->
Save your FREE seat for Streaming Media Connect in February. Register Now!

How to Encode Video for HTML5

Anyone encoding video for the web has likely wondered if they should devote all their energy to creating HTML5 files and leave Flash behind. As StreamingMedia.com writer Jan Ozer pointed out during the recent Streaming Media West conference in Los Angeles, Flash and HTML5 both have their place.

"When I look at the HTML5 playback environment, it really is a tale of two markets," Ozer said. "There's the desktop market and there's the mobile market, and really if you're producing video today there's two markets you need to serve: there's the desktop market -- that's the one we've been serving for years and years and years -- and then there's mobile. Two very different characteristics; you really need to approach them separately, both for single file streaming and for adaptive streaming."

While HTML5 has gotten a lot of attention, it's not yet ubiquitous on the desktop. That's because not all browsers support HTML5 video.

"When you look at a market for HTML5 playback, you've got to consider two aspects of that market," Ozer explained. "You've got to consider the HTML5 browser penetration and the HTML5 codec support within those browsers. What do you need to play video on a desktop if it's presented in an HTML5 format? You need an HTML5-compatible browser. If you don't have an HTML5-compatible browser, you can't play video presented in HTML5 format. You can fall back to Flash, and we'll talk about what that means in a second, but if you're thinking you can drop Flash today, support only HTML5, you need to look at how many browsers currently support HTML5."

For a look at the current state of browser support, and for instructions on creating HTML5 video files, watch the full presentation below. Also, download Ozer's presentation.

HOW-TO: Encoding Video for HTML5

Learn the technological fundamentals behind encoding both H.264 and WebM formats for playback with the HTML5 tag. Learn the basics of H.264 and WebM encoding and how to produce it for HTML5 distribution. In addition, see how the various H.264 and WebM encoding tools compare in regard to performance, quality, and features.

Speaker: Jan Ozer, Principal, Doceo Publishing

Streaming Covers
Free
for qualified subscribers
Subscribe Now Current Issue Past Issues
Related Articles

How to Encode and Deliver to Multiple ABR Formats

Use a single adaptive group, packaged differently for different targets, to keep encoding and storage costs down.

How to Add Interactivity to HTML5 Video

Add overlays, control the video timeline, insert subtitles, and offer localized content. Create new experiences with interactive HTML5 video.

How to Build an HTML5 Video Player, from VideoJS's Creator

Steve Heffernan explains how to build a customized HTML5 player. Watch this for everything you need to know.

Flash and HTML5 Video: Develop for Multiple Screens

An online educator presents the strategy that gets online video seen by the most people on the most types of devices.

Seeing the Big Picture on HTML5

What else is there to HTML5? A lot, it turns out. Explore the full breadth of HTML5 and take a look at its future in this video presentation.