Extras & Tools

Video Encoding Tools

On this page we will look at some tools that are helpful when you are getting ready to host video on your own site (rather than on sites like YouTube or Vimeo). These tools help you convert your video from the format in which it was created, into other formats that browsers will use to play on your website.

As a minimum you are likely to want to supply the video in h.264 and WebM formats. The first tool we will look at is Miro Video Encoder which simply encodes files from one format to another. The second tool we will look at is Handbrake, which allows you to change features such as the dimensions, file size, and bit rate of the video.

I commonly use Handbrake to create the h.264 versions of videos at the size I want them to be, then pop them into Miro Video Converter to create the WebM versions.

Miro Video Encoder

Miro Video Converter is a free tool that can be downloaded for Mac or Windows. It produces all of the main video and audio formats discussed in the book, and produces quite good results.

The interface is very simple:

• Drag a video file onto the dark box in the middle
• Select the device or format that you want the video to be encoded in
• Press the convert button

Miro Video Converter will then export the file into the format that you requested.

On the left you can see the supported formats that the Miro Video Converter generates.

As discussed in the book, if you are creating videos for HTML5 then you will need to generate two versions using Miro, the first is MP4 (which will be encoded in h.264), and also WebM.

Although the Miro Video Converter interface is very simple, it will convert the video at the same dimensions as your original video, and you do not have control over things like frame rates or maximum bit rates. If your video was shot on a video camera, and then edited, you will probably have quite a large file. Therefore, you will want to resize your video before you encode it for use on the web. That is where a tool like Handbrake comes in.

Handbrake

Handbrake is a free tool that allows you to encode h.264 video on PC and Mac.

It has lots of settings so that you have more control over the video that it produces (size, codec, bit rate and so on).

Of course, this does mean that the interface is a little more complicated than the Miro interface, but we will look at the basics of using this software below.

Once you have created your h.264 encoded video in Handbrake, you can then go back to Miro Video Converter to create a different version of the video (with these settings) for other browsers.

Destination:
To specify the name of the new file and where the newly encoded video should be saved, you use the destination option. You can either browse to the folder where you want the video saved or you can just type in the path.

Output Settings:
When creating videos for the web, you want to ensure that the checkbox that says Web Optimised has been ticked.

This option will ensure that you can start watching the video before it has finished downloading. It does not affect the video quality or file size, it just moves where the metadata (the information about the video) is stored within the file.

Video size:
To adjust the height and width of the video you can use the Picture tab on a PC, or on a Mac click the Picture settings button at the top. Ensure that you have selected the "keep aspect ratio" option (to ensure that your video is not stretched). You do not want the video to be larger than the dimensions of the player on your web page.

Cropping:
If your video file has black bars across the top and bottom (or left and right) you can crop the video using the cropping options that are next to the video size options.

2-Pass Encoding:
When this option is selected, Handbrake goes through your file twice.

The first time it analyzes the file to try and determine the optimum encoding, The second time it actually does the encoding.

This can take twice as long, but the quality of the video is improved.

Audio options:
On the audio tab you will see the options for how the audio is encoded. Generally a 48khz sample rate and 160kbps bitrate would provide good audio.

You can reduce the sample rate to 48khz and a bitrate of 96kbps to achieve a smaller file size. This should be fine where there is only a voice, but if the audio is important to the track the higher settings will result in better quality.

How file size affects speed of video:
The larger the size of the video file, the longer it will take for users to download (and the more it can cost you in terms of hosting).

When a video repeatedly stops while it downloads the next bit of the clip this is commonly known as bufering, it should then starts playing again once it has downloaded some more of the file but this can be a frustrating experience for users, so you do not want your video to be too large.

How dimensions affect the video file size:
The larger you want to show your video the more data it needs to encode (smaller videos require less detail and result in smaller file sizes).

If you want a large video player, the file size will be larger than for a small video and can therefore take longer to download (and increase the change of buffering during playback).