Media Compression : Audio and Video Best Practices
The majority of video and audio content delivered on the web has transitioned to HTML5 over the past 2 years. The compression process has gotten simpler as long as you take into account, remembering to compress your content and following a couple of simple guidelines. In order to deliver optimal content across devices we have two simple ingredients:
1. The H264 Codec which is part of Mpeg4.
2. The native HTML5 player allows for a simpler delivery of audio and video assets across devices without having to license a player.
Understanding the Video/Audio Compression Process – Tips
Within our workflow, we divide video and audio product into four main steps.
1. Video & Audio Assets
It all starts with capturing the content. Whether you are working with an internal group, your own team or a 3rd party it is always important to get the final assets on a hard drive at the highest quality possible. This will allow you to full control over compression and add the bonus of allowing you to recompress in the future when new technologies or codecs are introduced or optimized. Hard drives continue to drop in price, you can now get 4 terabytes for less than $150. Based on the quality size and compression you are using you can store 2-10 hours of content on the drive.
2. Compression
Here’s where the fun starts, it’s gotten easier and easier to compress content with the latest tools whether free or full-featured tools allow you to easily drag and drop a setting, click compress and squeeze your content to the optimal size.
First, when you are shooting your video, there are several formats and sizes that you can shoot at today. Most video cameras are shooting at HD which offers a 1920 x 1080 pixel size. This is a high-res format and you can notice every little detail of your content. Typically we shoot and capture at this quality and then size down the assets to make it easier to work with in editing. What’s nice is that the majority of devices support HD or at a minimum SD quality so the content you are capturing looks amazing.
The next step is to select a size for displaying your video content within your content. The following graphic shows some typical guidelines and sizes that we start with. Today, you can basically deliver in any size and format. Your video can be delivered 16×9, 4×3 or any other aspect ratio you can think of which gives you a lot of creative license. As a guide, we use 960×540 as a default size.
When capturing your video, it is typically shot at 29.97 frames per second (FPS). When you compressing your content, we typically deliver at a lower frame rate of 10-15 fps. This allows for a much smaller file size and makes it easier to deliver to your audience.
Key frames are used when scrubbing your video forward or backward using the shuttle play bar. If you don’t have enough, you’ll notice inconsistent behavior and skipping while you move the shuttle bar. We use 4 times the frame rate to define the number of keyframes. So if our frame rate is 15, our keyframes would be 90 (4 x 15).
The other variable we want to focus on is the data rate of your video. Based on the length of your video, the dimensions within your content we will target 800 – 1200 kilobits per second for our data rate. If you have good quality video this will give you great compression without noticeable loss in your video content.
We also get a bonus by using newer codecs, such as H264. They allow for a technique called pixel doubling, so if you compress your video to a size of 320×240, you can stretch or size the video 2x, in this example 640×480. This allows for smaller sizes but offering a larger format for delivery.
If your video is coming from an analog format, don’t forget to deinterlace your content to remove the banding effect.
Compressing Audio
The other important ingredient most of us forget is to compress our audio. For audio, you want to make sure you :
- Downsample the audio from stereo to mono
- Switch from 44khz to 22khz
- Use the MP3 codec at 64 kbit/s for the bit rate
This will give you a much smaller size and still have great quality content.
3. Authoring
When authoring content, whether you are using a tool or building in html you want to create a workflow to insure you will be able to easily update, edit and swap out audio or video assets based on your needs. Selecting a workflow where assets are external and named for understanding a week, month or year after you have launched your project will help to insure you can quickly identify and update assets as needed.
4. Delivery
Tools to Check Out
There are dozens of tools that can be used for audio and video compression, here’s a short list of what I use daily:
Handbrake.fr – a free opensource video transcoder for
Adobe Media Encoder – if you have the Adobe Creative Cloud you can install and utilize this app for Mac and Windows and compress content.
Hope that helps, I’ll jump into some additional details, tools and post some samples.