Introduction to HTML5

Introduction to HTML5

"HTML5". It's currently a buzzword when it comes to web development; but what is it really? A radical transformation from HTML as we know it? Not exactly. The syntax and core concepts of HTML remain the same, but the advent of HTML5 has added some interesting and useful tweaks, while eliminating some outdated practices. Let's take a look at some of the major changes.


Starting from the top of your document, one of the first changes you'll encounter is the HTML5 doctype declaration; it's been simplified. Gone are the days of worrying about whether your code needed to follow STRICT or TRANSITIONAL standards; now, if you want to tell the browser that your document is HTML you just need to start it with a  declaration.

New Elements

One of the goals of HTML5 was a move toward more of a "semantic HTML", which means having your code be almost self-explanatory. This is accomplished by the addition of some new elements.

A basic, pre-HTML5, site layout might look something like this:

<div class="header"><br />    <div class="nav"><br />       ...<br />    </div><br /> </div>

<div class="main"><br />    ...<br /> </div>

<div class="footer"><br />    ...<br /> </div>

HTML5 makes things a little bit easier by offering some brand new "semantic" elements. A comprehensive list can be found here, but a few select elements are

- a header area, not to be confused with the tag