HTML5Shiv for HTML5 support for IE < 9

I've long been a fan of the new "semantic elements" such as article, aside and figure that HTML5 provides and although the more exciting multimedia features get all the attention, I feel those alone make upgrading to HTML5 worthwhile.

With Internet Explorer 10 released this week it can be easy to assume that HTML5—if you are using it for your site—will be supported by a visitors browser as all the major ones have supported HTML5 for quite some time.

However, it is prudent to bare in mind that Internet Explorer has only supported HTML5 since version 9.

Versions prior to that will not support HTML5 elements and, as there are still a sizable number of users still using Internet Explorer 8 or, God forbid, even less, HTML5 adoption has suffered from the rightly cautious desire to stay backwards compatible so a site does not have the markup equivalent of a wardrobe malfunction when a visitor with an old version of IE drops by.

There has been a solution for this for quite some in the form of "HTML5Shiv" (Shiv or Shim), a JavaScript workaround enabling the styling of HTML5 elements in versions of Internet Explorer less than 9, and it's simple to implement.

To enable the HTML5Shiv, place the following section of Javascript code into the head element of your sites pages.

The shiv works by using Internet Explorer's Conditional Comments feature and loads the .js file only if the version of IE being used is less than 9 which then allows the browser to recognize HTML5 tags and style them using CSS.

If you do not wish to link the file from the Google Code site, you can download, then upload the script file and adjust the src to point to it.

So, that's one less excuse not to upgrade to HTML5.

Further reading

• HTML5 Shiv (wikipedia.org)
• HTML5Shiv Code Repository (github.com)
• Chart overview of browser HTML5 and CSS3 compatibility (findmebyip.com)

Tags: HTML5, Javascript, scripting.