Detecting HTML5 Goodness

Sometimes you stumble upon things on the web that are quite breathtaking in their simple cleverness and sheer elegance. I discovered one such resource today while reading the current draft of what may well become a seminal text on the emerging HTML5 standard. Chapter 2 of Mark Pilgrim’s Dive into HTML5 is all about supporting the transition as browsers start to support the new HTML5 elements canvas, video, local storage, web workers, offline web pages, geolocation, input types, placeholder text, form auto focus and microdata. This can be done by using JavaScript to interrogate new properties and functions that these new features will add to the DOM if they are supported by the browser, and this is the subject of this chapter. The beauty of it though is that, because this is a web page, written in HTML5, these very same tests can be and are be performed on any user’s browser that visits this page as shown in the illustration.

I spotted this feature while browsing the site with my iPhone, and then I thought I’d check it out with my other browsers. It works, and it is so elegant! I’ve summarized my findings in a table here, and the real beauty of this is that as each new generation of browser is released, I can simply go back to Chapter 2 and see at a glance what’s changed!

This and other HTML5 goodness recently discovered on the web can be found in my delicious bookmarks collection.