HTML5 Overview
Nov 09, 2011
HTML5 is close to be the new web standard. One advantage of HTML5 is that it doesn't need third party plug-ins like flash to play a video, also it reduces development costs and easily recover from errors.
Some of the new features are audio, video, canvas, client-side data storage. It also introduces a wide range of form types, controls, validation, APIs, multimedia, structure, and semantics elements.
STRUCTURE
HTML5 introduces a list of new elements to build a page structure. Old structures will be replaced with new elements, such as headers, footers, sections, articles, etc. The idea is to get rid of unnecessary div elements.
As you can see old div layout will be replaced with new tags, the final result will be a more organized and cleaner code.
The new markup will look like the following:
<body>
<header>...</header>
<nav>...</nav>
<article>
<section>
...
</section>
</article>
<aside>...</aside>
<footer>...</footer>
</body>
HTML5 NEW ELEMENTS
The header tag represents the header of a section.
<header>
<h1>HTML5</h1>
<p class="byline">Author</p>
</header>
<header>
<h1>Blog1</h1>
<h2>Text.</h2>
</header>
The footer tag represents the footer section of the page.
<footer>© 20011 footer.</footer>
The nav tag represents a section for navigation links.
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/products">Products</a></li>
<li><a href="/services">Services</a></li>
<li><a href="/about">About</a></li>
</ul>
</nav>
The aside tag is mostly used for sidebars.
<aside>
<h1>Archives</h1>
<ul>
<li><a href="/2011/09/">September 2011</a></li>
<li><a href="/2011/08/">August 2011</a></li>
<li><a href="/2011/07/">July 2011</a></li>
</ul>
</aside>
The section tag is used to describe a section of a document or application.
<section>
<h1>Tittle 1</h1>
<p>paragraph content
...</p>
</section>
The article tag is used for content like news or blog articles.
<article id="comments">
<header>
<h4><a href="#comments" rel="bookmark">Comment</a>
by <a href="http://oshyn.com/">Author Name</a></h4>
<p><time datetime="20011-08-29T13:00Z">August 111th, 2011 at 13:00</time>
</header>
<p>Article content</p>
</article>
Some deprecated elements from HTML 4.01 have been dropped, including purely presentational elements such as <center>, whose effects are achieved using Cascading Style Sheets. There is also a renewed emphasis on the importance of DOM scripting (e.g., JavaScript) in Web behavior.
The HTML5 syntax is no longer based on SGML despite the similarity of its markup. It has, however, been designed to be backward compatible with common parsing of older versions of HTML. It comes with a new introductory line that looks like an SGML document type declaration, which enables standards-compliant rendering in all browsers that use “DOCTYPE sniffing”.
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.