One W3C specification which seems to have slipped below most people’s radar is Media Fragments 1.0, which moved to Candidate Recommendation status in December last year. Media Fragments is a syntax which extends the URLs of media files so that only selected portions are made available to the user; let me explain that further with a couple of examples.
As you’re no doubt aware, HTML5 video is this year’s big thing — but there’s a dispute going on about which should become the default standard video codec. The current nascent de facto standard is H.264, but recently the new WebM format is gaining traction.
I’ve no idea how the web video format war will end. My preference is that a free, non-patent encumbered, high-quality video codec will become the standard, and WebM is the best fit for that description. Despite the recent announcement by the MPEG LA, the patent pool which controls licensing of H.264, that it will always be free for ‘video delivered to the internet without charge’, that still doesn’t make it free-as-in-speech, and still not free-as-in-beer for anyone wanting to build a business around video encoding/decoding (which includes, if I’m not mistaken, bundling it with a browser). All that said, my preference is meaningless in the face of so many vested business interests.
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).
I recently became the owner of an Android phone* and found that, despite it being listed as a feature of the browser, the HTML5 video element didn’t work for almost all of the examples I tried. I’ve just done some experimentation with this and think I’ve found a solution, so this post is offered in the hope that it helps anyone who may be tearing their hair out over the same problem.
Last year I wrote a post (Building HTML5 video controls with JavaScript) introducing the HTML5 Media Elements API and demonstrating a simple set of controls for playing video.
In this (somewhat belated) follow-up I’m going to explore building a more interactive set of controls using a JavaScript UI library; I’m going to use Glow, but it could easily be adapted to jQuery UI or similar.
The HTML5 video element is now included in Firefox, Safari & Chrome, and on its way in Opera. By using JavaScript to access the media elements API it’s easy to build your own custom controls for it; in this article I’m going to show how I built a (very) basic control interface.