Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML5 tag benefits

Tags:

html

I've this simple layout in HTML:

<body>

<div id="header">
    <div id="nav"></div>
</div>

<div id="wrapper">
    <div id="main"></div>
    <div id="sidebar"></div>
</div>

<div id="footer"></div>

</body>

I've translated it in HTML5:

<body>

<header>
    <nav></nav>
</header>

<div id="wrapper">
    <section></section>
    <aside></aside>
</div>

<footer></footer>

</body>

Is it correct?

And what are the benefits of using the HTML5 tags (header, section, aside, footer) instead of old divs?

like image 325
Fred Collins Avatar asked Jul 10 '11 14:07

Fred Collins


People also ask

What is the purpose of using HTML5?

HTML5 allows you to build offline applications. Browsers that support HTML5 offline applications (which is most) will download the HTML, CSS, JavaScript, images, and other resources that make up the application and cache them locally.

What are advantages and disadvantages of HTML5?

HTML5 has short and crisp syntax and comes with smart and improved security features hence it became very easy to write and manage HTML5 code. HTML5 also included temporary client-side data storage with the help of SQL which made it possible for the users to browse already loaded content even when they are offline.


2 Answers

It's all about semantics.

a <div> has no semantic meaning. <footer> does.

You can read more about it here: http://diveintohtml5.ep.io/semantics.html#new-elements

like image 131
Variant Avatar answered Nov 01 '22 18:11

Variant


The benefits is that it becomes more readable for machines and for other programmers.

The downside is that you need to use the HTML5shiv to make it work on IE8 and below.

like image 25
Brian Hoover Avatar answered Nov 01 '22 20:11

Brian Hoover