Jan 3 2011

Getting Started with HTML5

HTML5 has some interesting new additions. But let’s recognize the elephant in the room: HTML5 isn’t a final spec, nor will it be for quite some time. That said, there are many pieces that are stable, and can be used right now.

The Doctype

For a little background, HTML5 comes in two serializations: XML and HTML. The XML serialization of HTML5 is served as application/xhtml+xml, while the HTML serialization is served as text/html. Due to the added complications of serving application/xhtml+xml, we’re going to use the HTML serialization for all our demos here.

So here’s one of my favorite parts about starting a new HTML5 document: I can do it from memory.

<!DOCTYPE html>
<html>
  <head>
    <title>New Document</title>
  </head>
  <body>

  </body>
</html>

Now that’s simple, isn’t it? Finally, a memorable doctype!

Will that Work?

But browsers don’t recognize the HTML5 doctype yet, right? While that’s mostly true, we need to remember one great fact: If a browser comes across a new or unrecognized doctype, it simply moves into standards mode (or strict mode in IE). So you can begin building pages with this HTML5 doctype right now, and they will just work! And when browsers do implement HTML5, you’ll be ahead of the game.

So what Now?

Now you have a few options. You could just go about the way you normally code pages, with no real changes. But that’s not really worth changing a doctype, is it? More appropriately we should learn and use some of the new tags HTML5 gives us to improve our coding semantics and efficiency.