Using Compressor to Make H.264 MP4s

In April I pushed to GitHub my RewraptoMP4 Script I put together to help assist in creating proper MPEG-4 container files while being able to use the x264 QuickTime component in Compressor. Compressor only allows you to specify the codec being used when exporting to a QuickTime file, however it is possible to use QuickTime Player after the fact to convert a QuickTime Movie to an MPEG-4 without transcoding so long as the codecs are supported in the MPEG-4 container spec.

My primary reason for the extra work is that Google Chrome will not recognize a .mov file as a valid wrapper for video in HTML 5’s <video> tags.

Using Compressor

You need to make your Compressor preset using x264 as a normal QuickTime movie preset (use the table below to help with settings if necessary). You’ll then want to grab the script from GitHub and add it as a script to your preset.

Scripting Compressor isn’t very straight forward, while you can use AppleScript or launch a script using Compressor they fail to mention that the script must be saved as an application and the file is accessed by using on open.

Helpful Table of Limitations

DeviceMax ResMax Bit RateH.264 Settings
iPhone640x4802.5 MbpsCan only use Baseline profile Level 3.0 with CAVLC
iPod touch640x4802.5 MbpsCan only use Baseline profile Level 3.0 with CAVLC
iPhone 3G640x4802.5 MbpsCan only use Baseline profile Level 3.0 with CAVLC
iPod touch 2G640x4802.5 MbpsCan only use Baseline profile Level 3.0 with CAVLC
iPhone 3G S640x4802.5 MbpsCan only use Baseline profile Level 3.0 with CAVLC
iPod touch 3G640x4802.5 MbpsCan only use Baseline profile Level 3.0 with CAVLC
iPad1280x720"Unlimited"Can only use up to Main Profile Level 3.1
iPhone 41280x720"Unlimited"Can only use up to Main Profile Level 3.1
iPod touch 4G1280x720"Unlimited"Can only use up to Main Profile Level 3.1
G1480x320600Lack of documentation for anything Android
Droid X1280x720?Lack of documentation for anything Android - can't play more than 24FPS

Android information is rather limited. Official Android information is near non-existent.

Thanks to:

Using HTML 5's Video To Serve Baseline and Main Profile Content

At work I was trying out to see if I could use the new video tag in HTML 5 to show two different versions of the same video; one optimized for devices that accept only the Baseline profile (eg. iPhone 3G S and older, many other phones) and one optimized for larger devices (eg. iPad, iPhone 4 that support the Main profile). Turns out it works absolutely fabulous by using the codecs section in the type (Thanks to Dive into HTML 5 for the documentation).

<video OTHER_ATTRIBUTES_HERE>
    <source src="PATH_TO_MAIN_PROFILE.mp4" type='video/mp4; codecs="avc1.4D401F, mp4a.40.2"' />
    <source src="PATH_TO_BASELINE_PROFILE.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
</video>

The video codec for H.264 is: avc1.YYYYXX where YYYY represents the profile, while XX is the level (multiplied by 10 and turned into HEX):

Profile     Value   
Baseline    42E0
Main        4D40
High        6400
Extended    58A0

Level       Hex Value   
3.0         1E
3.1         1F
4.1         29
5.1         33

Now when I visit with an iPhone 3G it loads the baseline version, while my iPhone 4 and iPad both load the Main Profile version. For my current project I use video for whenever Flash isn’t available and it does leave a gap for Firefox and Opera users who don’t have Flash but according to our web stats they don’t actually exist.

It’s also important to note that Android users are also left in a lurch because any version lower than 2.0 doesn’t support <video>, and those that do can’t handle a <source> element having a type value like above. To top it all off it isn’t able to play or show controls on a video on it’s own. You have to add some JavaScript to your page in order to play to pass the click event and tell it to play.