HTML5 Doctype: Make the Switch!

There is a great deal of confusion surrounding the implementation of HTML5 amongst some developers.  Some believe that we shouldn’t be using HTML5 because it’s not ‘ready’, and that using the HTML5 doctype is dangerous because older browsers don’t support HTML5.

Lets be clear: you can switch to using the HTML5 doctype in your projects right now; the new features may not be supported in older browsers.  For example, IE doesn’t support the new structural elements (header, nav, article, section, aside, footer), and needs a little CSS & JavaScript support to get them to work.  The doctype however works perfectly well.  The main practical effect of switching

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

or

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

to

<!DOCTYPE html>

is that standards mode is triggered.  There’s no excuse for not using a strict doctype in either case.

So why make the switch?  There are two main reasons, the first is to simplify your markup.  You get to write less code, and shave a few bytes off the document size.  The second is to enable you to use some of the features of HTML5 in newer browsers now, whilst ensuring graceful degradation in older browsers.

It’s analogous to the situation with CSS2.1/CSS3 in some respects.  You might create a fancy button with a gradient background, rounded corners and text shadow with CSS3 for newer browsers; the same button in IE would be square, have a flat background colour and no text shadow.  You have the option to prop up IE with graphics in a conditional stylesheet, or just leave it like it is.  It’s the same case, for example, with the new date input type – this will gracefully degrade into a text input in browsers that don’t support it; it’s up to you whether you want to implement a JavaScript date picker or not.

Just because some features aren’t supported by older browsers, doesn’t mean we can’t use them!  If we thought like that then we’d all still be limited to CSS1, as IE8 is the only browser to support CSS 2.1 completely.

What I’m listening to right now: Radiohead – “Where I End and You Begin”