Monday, 23 January 2012

HTML5: is div dead? Not, really...

   


I must admit I am not a great fan of HTML5. First I've tried to understand the new tags and then I've started using them on new projects, sometimes ago. I even contacted the Doctors on HTML5 Doctor to submit some questions and prepare an interview to be published on the web thought. They were obviously too busy and, even if they initially agreed on the interview, they've never got back to me with the answers.
Anyway, in this short post I will try to explain where the new content formatting tags should be used and how they can replace the div tag... if ever.



A page structure
First of all let me show you how we can use the new tags in a page:

<header>
<nav>
<article>
<section>
<aside>
<footer>

As you can see, following the above schema, every tag has its specific purpose.
In any case, we should remember that even if a tag is named "article", that doesn't mean we have to use it only when strictly dealing with articles.
Let's see every single tag...

<header>
The header is a place where we show general information, possibly repeated on every page. It can contain the company logo, for example.

<nav>
The nav section should contain the web site navigation, such as a menu.

<article>
It's not just articles, in strict sense. This section is where we insert the web site content.

<section>
If articles or, generally speaking, content can be divided into sub parts, <section> is the place where to put those parts. It's clear that we can end up having more than one section.

<aside>
This tag can be used to insert other content not strictly related to the "main" content. For example, it can contain ads, images or other external links.

<footer>
The footer is normally staying at the bottom of a web page and contains - again like the header - information that we usually repeat on every page.
As a side note: footer and header are not to be considered only related to the page or the web site. They can be used as header or footer of an article as well. We then can have more than one footer or header.

What about the div?
As you can see, many of the above tags can replace the div. When we develop web sites, we are used to create containers with divs: for example, a navigation menu is usually contained in a div. Now, we should use <nav>.
So, is the div tag becoming obsolete? Will we use it again?
Well, it is my opinion that the div tag will still be used in new web pages. We can use the above HTM5 tags whenever needed, however we will not forget about our beloved div.
It is clear that when the W3C thought about the above new tags, the idea behind them was rationalise the HTML code, giving a proper name to containers. Generally speaking, it is a good idea and it can help us to maintain the HTML code. However, I humbly do not see anything else about it.
It is certain that you can start use the new tags from now on, but be aware of possible compatibility problems especially with the good old IE (version 8 and below). If you need a good fallback solution see this article.

Ok, that is all.
Please share your idea on the div and the new HTML5 tags: I really like to know what you think...

0 thoughts:

Post a Comment

Comments are moderated. I apologize if I don't publish comments immediately.

However, I do answer to all the comments.