Prepare media files for the web

Derek Herman
Derek Herman
Joe Medley
Joe Medley

Now that we've introduced you to the applications we use when manipulating media files, over the next few pages, we're going to take a raw video file from a camera and transform it into a resource that you can embed in a web page. We're going to show you how to format your video for mobile web playback, and how to create multiple files to cover a range of browsers. Specifically, we'll create a WebM file for use on Chrome and an MP4 file for use on other browsers.

Plus we will dive deeper into common commands used for Media conversion and Media encryption that will serve as a good reference for later.

By "appropriate technologies" we mean Dynamic Adaptive Streaming over HTTP (DASH) or HTTP Live Streaming (HLS), which are the two primary means of providing video in HTML on the major browsers. By the end of this section, you'll be able to create media files that are ready for use in DASH and HLS.

If you want to play along at home, you'll need a raw video file off a camera, preferably one that contains both audio and video. If you don't have one handy, then here's ten seconds of an .mov file named glocken.mov that was taken of the Rathaus-Glockenspiel in Munich's MarienPlatz.

Next, let's get started with Containers and codecs.