Web Video Compression

Purpose

This guide features some recommendations for compressing and delivering video to the web.

Introduction

As far as image quality goes, uncompressed video is the ideal. The downside, of course, is that the sheer

quantity of data in an uncompressed video file can hinder the speed and performance of your web video

and cause your online storage costs to soar. To reduce video size, you will need to perform a

compression, of which there are several methods.

Contents

• Video Formats

• Compression Software

• Source Material

• Compression Settings

• Presets and Settings

• Delivering Video Files

• FLV Metadata

• Next Steps

• Video Formats

The format defines how the video and audio streams are compressed, and how the two streams are

packed in a single file. A format's quality-to-filesize performance is important. Its support across devices

too, especially given the recent rise of mobile devices (iPhone, Android) with video capabilities.

Here is a helpful chart to compare and contrast four different high-quality online video formats:

Player Market Share Player Size Supported Codecs

Flash Player 10 94.7% 2MB VP-6, H.264

Flash Player 9 98.9% 2MB VP-6

Quicktime Player 7 62.16% 53MB H.264

Microsoft Silverlight 1 43.76% 2 MB VC-1

http://www.longtailvideo.com/support/jw-player/26/web-video-compression

As you can see, Flash has the highest market share, installed on 95-99% of all computers. Windows

Media Player is also widely installed, but not available for Macs. Microsoft’s Silverlight player was

designed to fill that void.

The file sizes of all the players are very similar, except for QuickTime, which is quite large, as it includes

iTunes and requires a manual download.

Video quality of each format varies widely, but the players listed here all have a top-notch option. Both

QuickTime and Flash 9r115, include the industry-standard H.264 video codec (usually in .mp4 or .mov

files). Windows Media Player and Silverlight use the equally impressive VC-1 video codec (.wmv files).

Even the slightly older VP6 codec (.flv files) used in Flash Player 9 offers excellent video quality. For an

in-depth comparison of these codecs, check this article.

Nowadays, the H.264 video and AAC audio format are (by far) the best codecs for compressing your

video. H.264 video is supported by just about any player, browser, plugin and device out there. When

choosing between the MP4 and MOV container, MP4 is the better option since the complexity of the

MOV container sometimes makes devices choke on a video.

The FLV format is still widely used, but unfortunately only the Flash plugin can display it. Give the rise of

both the new HTML5 browser standard (that can play H264, not FLV) and mobile devices like the iPhone

(that don't support Flash), FLV is not a good option anymore. The same could be said for the WMV

format, which is generally only supported by Microsoft products (Windows Media Player, Silverlight,

Zune).

The OGG format is an interesting one. Though not as good and as widely used as H264/AAC, the format

is considered to be open source and patent-free. For this reason, browsers such as Firefox and Opera

only support OGG video (luckily they also support the Flash plugin, which supports H264 again).

The AVI format, finally, is not really suited for online distribution. Though widely used for distributing

ripped movies or TV shows, it can only be played back in desktop players like VLC or Quicktime with

Perian.

There are many video formats not listed here—their quality cannot be compared against the options

listed above. Notably, the older Sorenson Spark codec for .flv files is still used quite often (on YouTube,

for one). This codec is also found in most freeware/shareware software that encodes FLV. Its quality,

however, is greatly inferior to the newer-generation codecs like H.264, VC-1 and VP-6.

An advantage of the H.264 codec is that it is also used in a lot of portable devices, such as the iPod,

iPhone, PlayStation portable or Nokia N-series smart phones. If you encode in H.264, you can deliver

your content to those devices, too.

http://www.longtailvideo.com/support/jw-player/26/web-video-compression

Compression Software

There was a time when most compression software was desktop-based. Nowadays, online services offer

better solutions and lower prices. Some are hosted, meaning you can upload videos manually or through

an API, while others are software packages that you can install on your own web servers. (Note: most

freeware/shareware encoding tools offer outdated codecs with poor file-size-to-quality performance

metrics. Sorenson Spark .flv and WMV7 .wmv, for instance.) Below is a list of suggested compression

and encoding software used by members of the LongTail community.

Two such online services that offer excellent quality, input support and a free trial are:

• Hey!Watch ($0.20 per video)

• Encoding.com ($2.00 per GB)

Our own video management platform Bits on the Run also offers video encoding options (and a free 1GB

trial).

There's also still a bunch of excellent desktop tools out there, but the good ones are generally quite

expensive:

• Sorenson Squeeze ($499)

• Apple Compressor (part of Final Cut Studio - $999)

Freeware / shareware desktop encoders come and go, their quality (stability, quality, support, interface)

varying wildly. One good free tool that's been around for a few years is Handbrake. Originally built for

ripping DVD's, it currently is centered around converting just about any file to MP4 (H264/AAC).

Source Material

Bad source material—shaky camera; background noise—makes for bad compression. This applies, as

well, to prolific cutting with editing and fast-moving action within a shot. A compressor essentially saves

one frame—the key frame—and then saves only the changes that occur in the following frame. This

process repeats for the next key frame. And so on. If you have a lot of cuts, every pixel of these

intermediate frames must be saved. But for a talking head, only a few pixels will change, so the file will

compress well. Which is why using mounted cameras for live footage drastically improves video quality.

Avoid over-compression as well. Don't compress your source file any more than is necessary. For

example, mobile phone cameras deliver already-compressed video, so there’s no need to compress it

any further. Use the highest-quality recording mode on your device when possible, then compress the

file.

http://www.longtailvideo.com/support/jw-player/26/web-video-compression

Compression Settings

With the introduction of codecs like VC-1 and H.264, DVD-quality online video is readily achievable. Even

HD is available online, though I advise against using it since it is still too demanding for both the average

internet connection and the average CPU. When using DVD quality, be sure to offer a small version (no

wider than 360 pixels) of any video you deliver in DVD, since not everybody has a cable connection.

For compressing your video, choose a bitrates (bits per second) with both the size of the output and

quality of the input file in mind. Whenever possible, use two-pass encoding; it will take longer to

encode, but the file will look better. Here's a rough overview of what bitrates to use at various screen

sizes:

Output size Bitrate Filesize

320x240 pixels 400 kbps 3MB / minute

480x360 pixels 700 kbps 5MB / minute

720x540 pixels 1000 kbps 7.5MB / minute

If you are able to set key frame intervals in your compression software, Flash can only scrub to these key

frames. So if you compress a movie with very few key frames, a user can only scrub to a few points

inside your video. You can always compress with more key frames, you will end up with larger file

sizes—it’s a tradeoff.

For audio, bit rates from 96 kbps to 164 kbps are usually fine. Test a few different bit rates to see if the

sound looses any crispness.

Note that an FFMPEG encoder (and all software that builds upon it) has a huge range of settings for

tweaking conversions. This may be overwhelming at first but these guides should help get you started.

Presets and Settings

Most compression tools offer excellent presets for encoding video to MP4 with H264 video and AAC

audio. Look for a setting named like MP4 normal , H264 regular or MP4 good quality. This will probably

already encode your videos to excellent quality. If you can set the width of the resulting video, make it

480, 640 or 720 pixels wide.

If you want to publish an HD video (1280 by 720 pixels), make sure you always publish a second version

(320 or 480 wide) for people who don't have a fast computer and broadband connection. Our JW Player

has a nice interface for this in the form of the HD Plugin. You can even enhance this further by encoding

2, 3 or 4 videos in different dimensions and letting the videoplayer automatically pick the best fitting

video for each visitor. This mechanism is called bitrate switching. Both our JW Player and Bits on the Run

support this out of the box.

http://www.longtailvideo.com/support/jw-player/26/web-video-compression

In case you want to tweak your encoding, here's a breakdown of the important settings:

• bitrate: the bitrate defines how much bits (1/8 byte) one second of video will use. A video of 1

minute with a bitrate of 1000 kbps will be 7.5 MB large (1 / 8 * 60). Choose a bitrate ranging

from 400kbps (with a width of 320) to 2000 kbps (with a width of 1280). If the compression tool

offers a quality settings as well, this is preferred over setting a bitrate. Audio bitrates should be

in the range of 64 (poor) to 192 kbps (perfect).

• codec: with both MP4 and MOV, it is possible to choose multiple video codecs. Always use

H.264 though, since that offers the best quality. Always use AAC as the audio codec.

• deinterlacing: this should only be checked if your source video is interlaced. Tape-based DV

cameras (and the ones that have an "i" in their name) usually produce interlaced footage.

Without deinterlacing, movements in the video will get stripe artefacts.

• height: A height of 270, 360 or 400 pixels is common today. Youtube-quality videos generally are

240 pixels high, HD video is 720px high.

• quality: H.264 video can sometimes be encoded using a quality parameter instead of a bitrate.

This usually results in lower files at the same bitrates, since the encoder will use less data if the

frame is low on movement. A good quality is between 50% and 60% (or 25 to 20 RF).

• two-pass: Videos can be encoded in one sweep (single pass), but some tools can also encode

videos in two passes. In the first pass, the video is analyzed to see which sections require a

higher or a lower bitrate. In the second pass, the actual encoding is done. Two-pass encoding

takes longer but creates better videos: roughly 75% to 95% of the original filesize at the same

quality.

• width: A width of 480, 640 or 720 pixels is common today. Youtube-quality videos generally are

320 pixels wide, HD video is 1280px wide.

There are a lot of articles online that explain the more advanced encoding settings in detail. This

overview from Ken Stone is excellent. Though he uses Apple's Compressor, the settings he explains are

also found in other tools.

http://www.longtailvideo.com/support/jw-player/26/web-video-compression