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?
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.
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.
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
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With