This article was written in 2009. It might or it might not be outdated. And it could be that the layout breaks. If that’s the case please let me know.
I switched to HTML 5. A nerd blog should have a nerdy doctype. There’s not much to say about it. I replaced the first div in the old HTML with a new element called header, I replaced the following divs which are direct children of the body with the new element section, I replaced the div that was a child of the section with the element article and replaced the last div of the page with the element nav. I could have chosen the element footer, but I think nav describes its purpose better. I don’t have an aside so I don’t need that element.
There are some very nice new attributes and attribute values I use on form elements that actually work in Opera. I used the required attibute, the type=”email” and the type=”url”. These form a efficient (but very ugly and unstyleable) client side form validation. Nice to have!
The best part of HTML 5 is that you will be able to remember every part of the HTML, even nerdy stuff like the doctype declaration. <!DOCTYPE html> is easy to remember. Just like <meta charset=”utf-8″>. So no more code searching and copypasting.
I left out the html, head and the body tags, browsers will put them where they are needed anyway, just like the tbody of a table.
You can’t use the W3C Validator for HTML like this, you’ll need the incredible validator.nu.
One thing to remember when starting to style your new HTML is to add display:block; to every new element like section. That’ll save you time. I’ll write about the CSS I wrote in a next post.