There’s a lot of hype about HTML5, but what is it? Is it time to switch?
First and foremost, HTML5 is the newest specification for HTML. Although it’s not a complete specification yet, it’s widely supported. My advice is, if you’re starting a new project, you should take advantage of the features available in HTML5. I’m going to try to cover some of the new elements you’re most likely to use.
The good news with HTML5 starts right at the top of the document. Remember the long DocType strings no one could remember? No more. Your new DocType is
Next there are new, semantic tags available in HTML5.
article is a chunk of content. Examples include a blog post, a news article or a user comment.
aside is a section of a page that is somehow tangentially related to the content around it. Examples include sidebar navigation or pull quotes.
audio element is just what you would think it is. Modern browsers support audio streaming natively. That means you can stream audio without using Flash. The bad news is that browser vendors have not decided on an audio codec. That means Chrome, Firefox & Opera support
.ogg files. Safari supports
.mp3 files and Internet Explorer (9+) supports
.mp3 and AAC in an mp4 container.
HTML5 audio and video are topics sufficient for future blog posts.
That’s right, the
b is back but it doesn’t mean bold anymore. It’s meant as a generic, inline container to stylistically offset content without conveying extra importance. If you want to hang bold styles on a
b tag, you can, but for conveying semantic importance, you should still use
canvas element is also deserving of its own blog post.
You don’t need to create footer
div‘s anymore. Footers are their own element. Which leads us to…
Same as the footer.
hgroup element to group headings when there is no content in between. For example:
<hgroup> <h1>Section Title</h1> <h2>This is the tag line</h2> </hgroup>
i is back too! Guess what? Like
b, it no longer means italic. It’s meant to denote an alternate voice or mood.
nav as a wrapper for site navigation. Like
nav is a more semantic container for elements that are commonly enclosed in
video supports native video streaming in the browser. Again, no need for Flash to play your video file. Also like
audio, there is some disagreement about which video codec to support. My sources say
h.264 has mostly won that battle. That means
.mp4 video files will generally work.
video deserves greater attention in a future blog post.
Support is now broad enough for HTML5 that you should begin using it in your projects. There are other new tags in the specification that are not covered here, but these are the most common ones. I’ve found that HTML5′s semantic tags make writing styles easier and my document structure is less convoluted. Go on. Give it a try.
- HTML5 Boilerplate
- HTML5 Doctor’s Element Index
- Dive Into HTML5
- WHATWG’s HTML5 Documentation
- W3C’s HTML5 Specification Draft