In my previous post, Making HTML5 Video work on Android phones, I said that you have to encode your videos as .m4v
in order for them to work in Android. This isn’t actually correct. The suffix can be either .mp4
or .m4v
, what matters is the way the video is encoded.
Now, there are loads of blog and forum posts which give differing advice on presets and parameters, and I’m no expert — so what I’ll do is just show you two quick ways that worked for me (I have a Samsung Galaxy S).
A couple of things to note: this post refers specifically to video embedded in web pages with the video
element, so the other two requirements from my previous blog post still stand; also, the methods shown below should mean your videos play on iOS too, so you don’t have to encode for different platforms.
The first is cross-platform, using Handbrake. What I did with this was to use the iPhone & iPod Touch preset, check the Web Optimized option, and change the Average bitrate option (in the Quality section) to ~1000kbps (you should then save this as a new preset called Android).
You’ll also need to change the size of the output video in the Picture Settings options — I changed mine to 480 wide (keeping the aspect ratio) and they came out really crisp and sharp. You can see the result of that below (if your browser supports it).
The second method is also cross-platform, and uses VLC (I’m using version 1.1.1, not sure if older versions work the same). It involves more set-up the first time around, but will be easier with each subsequent conversion. Update: I was using VLC for Linux, but the OSX version seems to be quite different.
Go to Media > Convert/Save, add the file to be converted, and choose Convert from the selection at the bottom. Name your Destination File [filename].mp4, and from the Profile list choose Video — H.264 + AAC (TS).
Hit the Edit icon next to the list, and go through each tab in turn; in Encapsulation choose MP4/MOV; in Video Codec un-check the Keep original video track box, choose H-264 from the Codec list, empty the Scale field and enter a value in Width (I used 480); in Audio un-check the Keep original audio track box and select MPEG4 Audio (AAC) from the Codec list. Now click Save, and all of these settings will be remembered so you don’t have to enter them again.
With all that done, hit Start to encode your video. You can see the result of the VLC encoding below. Update: This video doesn’t seem to play on iOS.
The third method is the simplest, but works on Mac OSX 10.6 only. Open up your source video in Quicktime, then go to File > Save As. Choose iPhone from the Format selector. You get less control over your output with this — the width is always 480 and the bitrate is calculated automatically — but it works without fuss. The output of this method is shown below.
A slightly more convoluted method is to use DoubleTwist, which performs on-the-fly conversion. Connect your Android device, then transfer your video to it — the optimum parameters will be automatically selected. When complete, copy the file back from the device to your computer. (I haven’t actually tried this myself).
I’ve read that you can use WinFF, although I haven’t been able to make this work so far.
I’ll keep this post updated as I discover different methods, and do feel free to let me know in the comments what works for you.