Darren Lewis bio photo

Darren Lewis

Professional Nerd

Twitter GitHub StackOverflow
Published: November 11, 2011

Are you about to embark on a new website (re)design? Do yourself a favour and embrace HTML5.

"But I need to support older browsers and this HTML5 stuff won't be getting a ratified spec until 2022. That's no use for me! Damn you IE6!"

This is a common misconception of HTML5 and whilst there are many features that are still experimental, a lot are now fully supported in all of the modern and older browsers.

When it comes to your markup, if you’re still using the div tag for anything other than a styling placeholder you’re doing it wro…in a less than ideal way. HTML5 introduces a significant number of more semantic tags such as <header>, <section>, <article> and <footer> to name a few, but where you’ll run into problems is in styling these tags or even getting them to display within old IE.

Older versions of IE will at best fail to style these elements or worse still simply not display them at all. However, this problem is easily overcome with what’s known as a shiv. Essentially you can add all of the new HTML5 elements to the DOM within older versions of IE simply by calling document.createElement(“insert html5 tag name here”). Older versions of IE will now happily applying your CSS to these tags for which it previously knew nothing. Sure, you need javascript enabled for this to work but we have to draw the line somewhere.

Of course every web developer faces the same challenges with IE and so common libraries for achieving the revenge of the shiv are prolific to say the least. However, if you’re a Microsoft web developer and using ASP.NET MVC 3 with the latest tools update, you already have ALL of this functionality built right into your new projects compliments of the team including the modernizr javascript library. If you haven’t done so already I highly recommend having a read of the modernizr docs. It does far more than help you achieve rounded corners without CSS3 (of course you’ll quickly learn it doesn’t actually do that at all!). If you’re not using ASP.NET MVC no problem, as with all the awesome sauce nowadays you can also get it through NuGet.

BTW apologies for the insanely cheesy title, despite not being an SW fan at all I strangely couldn’t resist.