Right now video is a bit of a mess on the web.
The most widely supported platform for playing video on the desktop is Flash. But some devices notably the iPad and iPhone don't support Flash. If you want to be able to play your video on multiple platforms and devices what can you do?
What about HTML5 Video?
Most modern browsers support the HTML5 video tag.The main issue here is that HTML5 browsers support different codecs and don't yet have wide adoption.
Currently the formats that are supported in different browser are:
- Firefox, Opera and Crome support Theora.
- Safari, Internet Explorer 9 and Crome support H.264.
- Android devices and iOS devices support H.264.
- Current versions of Internet Explorer don't support HTML5 video tag.
Internet Explorer will support the HTML5 video tag when Internet Explorer 9 comes out, but it wont run on Windows XP, which is about is about 40% of desktop machines.
Currently (January 2011) only about 25% of desktop browsers in use support the video tag.This is likely to increase as time goes on but it will still be quite a few years until HTML5 video support in browsers reaches anything like the adoption of the Flash player.
On the mobile devices/smart phone support is better with Android, iOS and RIM supporting it. Currently (January 2011) about 67% of mobile browsers support HTML5 video. This is likly to increase at a quicker rate than desktop support.
Another issue to consider is that HTML5 video can play video fine but doesn't support a wide range of features that Flash video does support such as full screen playback (limited support), captioning and true streaming.
What about H.264?
All common desktop browsers and smart phones support H.264 either via the HTML video tag or the Flash player, so that should make things easier right? Well sadly no. H.264 consists of several profiles with different capabilities. The Flash player supports a wider range of profiles than iOS, so a video may not work in iOS even when it works fine in the Flash player. Even if a flash video is encoded in the basic profile iOS won't play H.264 videos in a F4V container but needs an MP4 container. You can create a MP4 file with a baseline profile 3.0 that will be viewable in all iOS devices and the Flash player.
Desktop video vs Mobile video
Another thing to consider is that mobile devices generally have smaller screen sizes, less available bandwidth and slower processors than desktop computers. They are also viewed in poor lighting conditions and listened to in noisy environments. You may want to display a lower resolution or lower quality video for mobile devices to improve the mobile viewing experience.
What does this all mean?
To display video in a wide range of browser on the desktop and devices you need to use both Flash and HTML.
There is no single video format that will work in all devices and you will need to encode your video in multiple formats in you want to target a wide audience and set of devices.
If high quality is not essential you can use a single low resolution H.264 mp4 video to display in both Flash and HTML.