Terry Hancock’s Lib-Ray initiative is a great alternative to Blu-ray, using high-quality HTML5 video and plain HTML/CSS and JavaScript that can play back online or from an SD card. To support all the major browsers (Firefox, Chrome, and Safari), you need to include WebM versions of your video as well as H.264—but at present the site only offers tutorials for command-line encoding tools, which are challenging for less experienced users. So I’ve created this guide to encoding WebM video using GUI utilities on OS X.

Step 1: Download your tools. You’ll need:

• WebM QuickTime component (free): adds WebM support to your Mac system.
• Xiph Vorbis Quicktime component (free): adds Vorbis audio support.
• Quicktime 7 Pro (USD $30): creates the video track. This might seem like a strange choice—but in my tests it seems to be the only GUI-based Mac tool right now that can reliably encode high-quality HD WebM video for under $100. For now, other common utilities that claim WebM support are either glitchy or have fixed low-quality settings.

Optional extras:

• Audacity (free): A great all-purpose audio editor that can export Vorbis audio files if you’re using separate audio tracks.
• MKVToolnix (free): Losslessly add and delete audio and video tracks from a WebM file.

Step 1: Install the audio and video codecs. Drop them into the /Library/Quicktime/ folder, and they should immediately become available.

Step 2: Prepare your materials. Like H.264, WebM is a highly compressed codec, so you’ll need to start with a high-quality original to get good results. I recommend using a Quicktime movie with the PNG, ProRes, DNxHD, or PhotoJPEG codecs. Be aware that WebM doesn’t appear to support nonsquare pixels; for example, you’ll need to convert 720×480 DV video to true 4:3 or 16:9.

Step 3: Open your video in Quicktime Pro and choose Export, then Options.

Step 5: Video settings.
Frame rate: You’ll have to manually match your original frame rate.
Keyframe every: Your frame rate rounded to the nearest whole number. (If your original video is 23.976 fps, put 24).
Data rate: Your choice—be aware this is measured in kilobytes, not bits. I use 3500KB/s for an HD original (approximately Blu-ray bitrate) and 1000KB/s (approximately DVD bitrate) for SD.
Quality: I don’t think this affects anything, but I always set it to Best for good luck.
One Pass/Two Pass: Two-pass encoding takes more time but gives better results. However, WebM already encodes very slowly, so if it’s not an overnight render you might want to leave this off.

Step 6: Audio settings.
Channels: Usually you want Stereo.
Rate: 48Khz is standard.
Quality: Confusingly, this is sample rate conversion quality, not compression quality. Always choose Best.
Encoding quality: 10 is best, on a scale of 1 to 10. (Decrease if file size is important.)

Step 7: HTML5 video lets you specify multiple sources for your video. Here’s some sample code.

<video>
   <source src=”test.mp4″ type=”video/mp4″/>
   <source src=”test.webm” type=”video/webm”/>
</video>

You might be asking at this point—why is this odd-duck video format worth all the hassle? Well, it’s about more than just supporting Firefox—WebM was created more from legal necessity than anything else. The very popular H.264 video codec and its main physical-media distribution format, Blu-ray, are caught in a series of conflicts of interest between various giant media and technology companies. (The issues are too complex to summarize easily, but you can read more about them here.)

These fights affect you in numerous subtle ways—licensing squabbles are why, for example, it’s so difficult to play back Blu-ray discs on a computer. H.264’s license terms allow you to give your work away for free, but they don’t let you sell it without paying royalties to the MPEG-LA, the consortium that owns the codec. To be clear, this rule isn’t currently being enforced—it’s very unlikely that anybody plans to stop you selling home-burned Blu-ray copies of your own work—but it leaves the MPEG-LA with far too much control over the livelihood of video producers. And the they could change their license terms at any time. So Google created the WebM video format to have an open-source, (theoretically) patent-unencumbered video codec to fall back on if H.264 became legally impractical to use. (Since YouTube is the world’s largest user of H.264 video, they would be extremely vulnerable to unfavorable licensing changes.) TL;DR—Including WebM as an alternative format protects your right to distribute your own work however you want. It’s an important format to be aware of, especially if you’re an individual artist selling physical copies of your work to collectors or exhibitors,