Video file formats for the web compared

In the main article we saw that the best video format for the web is Flash, giving an excellent combination of compatibility, video quality, and small file size. But perhaps you want to know more about the different file formats anyway, and that's what we'll cover here.

Media Players vs. File Formats

Before we talk about file formats, you'll need to know the difference between a media player and a file format.

A file format is the flavor of the video itself. The media player is the software that plays it. This can be confusing because some media players and file formats have the same or similar names (e.g., QuickTime), and because one media player can often play media in lots of different formats. Here are the most common media players and formats.

Media Players • Flash (e.g., Wimpy Wasp) • Windows Media Player • QuickTime Player • RealPlayer Technically Flash is a plugin, not a player, but you can use it to play video, so it's a player in my book. There are other media players, but the above four are the most popular.

File Formats • .fla/.flv/.swf (Flash video) • .wmv (Windows Media Video) • .mpg/.mpeg (MPEG version 1) • .mp4 (MPEG version 4) • .mov (QuickTime) • .asf (Advanced Streaming Format) • .avi (Audio Video Interleaved) • .rm (Real Media) Formats in brown are container formats and can contain video compressed with a variety of different codecs. More on that below.

 

And here's who has what preinstalled:

What's Preinstalled	PC	Mac
Flash	✓	✓
Windows Media Player	✓
QuickTime		✓
RealPlayer

Not as many Windows users have WMP as you would expect for some reason. I'm guessing it just wasn't preinstalled in every version of Windows. In an April 2006 survey, only 85% of users had WMP installed, vs. 98% for Flash.

If you don't have a media player, you can download it. Every media player listed above will run on both Macs and PC's. But if you're putting video on your website, you probably want to go with what users already have installed. If you depend on visitors to download and install a media player to view your video, they might just abandon your website instead.

Note that although you can download WMP 9 for Mac OS X, Windows has discontinued development for the Mac so there won't be any future Mac versions.

 

Here's what the media players can and can't play.

What player plays what	Flash	WMP 11	WMP 9 (Mac)	QuickTime Player	RealPlayer
.fla	✓
.swf	✓			✓	✓
.asf		✓	✓		??? - Couldn't find the list on their website. Very annoying.
.wmv		✓	✓	Can play .wmv on Macs if you buy Flip4Mac
.avi		✓		(depends on codec used to compress the video)
.mov	*			✓
.mpg		✓		✓	✓
.mp4	*			✓	✓
.rm					✓
		Here's Microsoft's list of what formats they support and what they don't.		See below to how to make your server MP4-compatible.

* In 2007 Flash started to support MOV & MP4 in Flash 9 if they've been encoded with H.264, but using these formats means that people with older versions of Flash can't play your videos. As of September 2007, 93.3% of users had Flash 9, meaning 6.7% had something older. Also, in my admittedly limited test, using mp4 with a Flash player meant that the player insisted on downloading the whole video before it would start to play, rather than starting the play as soon as possible.

Media players can play audio content too (e.g., .mp3, .aac, m4a), but this article deals with video only.

But wait, it's even more confusing. Video is compressed with something called a codec. Sometimes the codec and the file format are the same, like with .mpg. But some file formats can contain video compressed with a variety of codecs. For example, .avi can contain video compressed with MPEG-2 or DivX codecs. That's why QuickTime's ability to play .avi files depends on what codec was used to compress the video. The most popular codec these days is H.264, because it produces high quality video with the smallest amount of disk space.

Here are some links that talk about the marketshare each media player has.

• Adobe. This is most recent survey I could find, April 2006. Shows 98% penetration for Flash, 85% for Windows Media, 68% for QuickTime. They're a little biased since they own Macromedia (which makes Flash), but I have no reason to doubt their numbers.
• Macromedia. These guys are a little biased since they make Flash, but I have no reason to doubt their claim in April 2004 that WMP had only 61% penetration at that time, compared to 93% for Flash.
• WebOptimization.com. Graph from March 2006. Unfortunately it's just raw numbers, not % of users with each player installed, and it doesn't include Flash, because they consider Flash a plugin, not a player.
• StreamingMedia.com. Aug. 2004 article puts the media player market share numbers into perspective.

 

Notes about the different video formats

.fla, .flv, .swf (Flash)

Maximum compatibility for web visitors

Must install a player onto your website like Wimpy Wasp. Must convert your video to Flash.

This is the modern format of choice because it's the most compatible. More users have Flash installed than any other media player, so more of them will be able to view your video than a video in any other format. You'll just need to install a Flash Player on your website like the Wimpy Wasp, and convert your video to Flash. Software to do that is listed near the top of this page. Here are the differences between the files:

• .flv - This is the raw video file itself. This is what you get after converting from .mp4 or some other format. This is what your Flash player will play. It stands for Flash Video.
  
  
• .swf - This is the format of the Flash video player software (e.g., wasp.swf for Wimpy Wasp). With most Flash players, you need only copy one of these .swf player files to the server, even if the software comes with a bunch of files (and it usually does). The extension stands for ShockWave Flash, an older name for Flash.
  
  
• .fla - You'll probably never see this format. It's only relevant if you're building Flash projects with Adobe's Flash Development kit. Most of you won't do that, you'll just download a Flash player that somebody else wrote, like Wimpy Wasp. If you do create your own Flash projects with the development kit, then the .fla format is just a Flash document (a software or animation project you created). But this format doesn't run on the web. You use the Export command to convert your project into a .swf file, and that is what you actually upload to your server.

.mpg, mpeg (MPEG-1)

Runs in both Windows Media Player and QuickTime.

Requires Toast ($80) or Cleaner ($599) to create with a Mac.

MPEG is well-supported -- it runs under both Windows Media Player and Apple's QuickTime, so if your visitors have either player installed than they can play it without downloading additional software (though some users won't have one of these installed, which is why Flash is usually a better option). Downsides include the a bigger filesize for a given amount of quality vs. more modern formats, the fact that you can't create this format on a Mac with iMovie unless you buy additional software, and that you don't get all the nice features that you would with a Flash player, like live watermarking, a "Video is loading" message, etc. Also, .mpg can't be streamed, though that seems to be less important than it used to be now that all video players incorporate fake streaming.

.asf (Advanced Streaming Format) .wmv (Windows Media Video)

Requires Windows Media Player to view

Requires Cleaner (Mac, $599) or Windows Media SDK (Windows, free) to create.

These are Microsoft formats. They're a poor choice for websites because Mac users can't play them without installing additional software.

If you're using a Mac and want to create .wmv files, your best solution is to create them in any standard format, and then convert them to .wmv with the $23 VisualHub software.

As to the difference between .wmv and .asf, this is from Microsoft's website: "Files that contain digital media content encoded with non-Microsoft codecs may not use the .wmv and .wma file name extensions, even if they also include streams encoded with Microsoft codecs. Such files must use the .asf file name extension. For more information, see the End-User License Agreement (EULA) for the Windows Media Format SDK."

.mov (QuickTime)

Windows users must download QuickTime to view

iMovie easily exports to .mov

QuickTime is a container format, which means you can use any of several different codecs for compressing the software (e.g., H.264, Sorenson, etc.).

QuickTime is Apple's format, and Apple's iMovie easily creates movies in this format. Windows users have to download QuickTime (~9Mb) in order to view .mov videos, though.

If you do use QuickTime, make sure to save your files as self-contained (instead of "normal"), and note that the H.264 and Sorensen 3 encoders generally produces the smallest files with the best quality. In my tests my video used about 5Mb/minute, when exported at 320x240, 12fps, medium quality with Sorenson3.

To embed the movie in your webpage you'd use HTML like this:

<embed src="filename.mov"AUTOPLAY=true CONTROLLER=true LOOP=false
PLUGINSPAGE="http://www.apple.com/quicktime" width="240" height="196">
<noembed>Get QuickTime</noembed>

Apple's Developer site describes the embed tag in more detail.

 

.mp4 (MPEG-4)

Windows users must download QuickTime to view

iMovie easily exports to .mp4

MP4 makes very small file sizes. In my test exporting with iMovie, the size was about 2Mb/min., with the video @ 320x240, 24fps, 64kbit/sec. Unfortunately Windows users can't see the video unless they download and install QuickTime. But you could still export to .mp4, convert to Flash, and then use a Flash Player like Wimpy AV Player. That way you get the file compression advantage of .mp4 married to the compatibility of a Flash player.

If you decide to use .mp4 on your website straight (without converting it to Flash first), you may have to add the following line to the .htaccess file on your web server to get the .mp4 files to play properly in web browsers. Otherwise the browser might just show all the data in the file instead.

AddType video/mp4 .mp4
               

.avi (Audio/Visual Interleaved)

A container format, containing video compressed with who-knows-what codec

iMovie can export to this format

.avi is a container format, meaning that it's not really its own format, it contains video compressed with some other codec. That means that your computer might play some .avi files (where you have the proper codec installed) while failing to play others. Nice.

When I tried to export to .avi with iMovie, iMovie wouldn't complete the export, it would stall when the progress bar finished filling up completely. And the file on my hard disk that it almost finished creating was huge.

.avi DivX

Requires extra software to run in Mac browsers; not sure about Windows

iMovie can export to this format

iMovie gives me the option to export to .avi DivX but it exports at 720x480, and I can't find any way to change the export size. I'm also not sure whether the ability to export to DivX came with iMovie or whether it appeared after I installed some software to let me view DivX movies.

 

.rm (Real Media)

Requires extra software to run in either Windows or Mac browsers

Requires software from Real Networks to create

This is the worst format of all:

• Won't run in Windows or Mac browsers without downloading extra software
• When users go to download the free Real player, Real tries to trick and cajole them until buying the pay version or signing up for subscription-based content. (And if you accidentally do, like I did, then they chastise you when you try to cancel or complain.)
• No free creation tools
• Why bother?

Other Handy Mac utilities

MPEG Streamclip. For both Mac & Windows, lets you easily edit .mpg files in a QuickTime Player-like interface. Also joins movies together. Nice. Best part, it's FREE!

Visual Hub. This is the Swiss Army Knife of video conversion. It's fast and simple, and only $23.

Contacting me

Please don't send me your questions, I can't answer them. If I knew the answer it would be on this web page already. On the other hand, I welcome corrections or other useful information you want to share that I can add to this page.

More resources (on other sites)

• What video format to use for your podcast
• Apple's iMovie Forum
• To convert from Flash to another format, use the free Super software.