HTML5 is a markup language for sturcturing and presenting content for web pages. It is the current HTML standard. HTML5 has introduce a number of new standard elements and their corresponding tags to be used in HTML documents. These new elements are things like semantic elements, graphic elements and multimedia elements.

All of these elements and tags help to separate content and functionality of the page.  They each can be targeted and styled with CSS.  When called out in the CSS, it does not require a '#' or a period for specifying the tag, you simply put the name of the tag, such as header, footer, etc.  You can, of course, add a class or id number to the tag for specific styling.

In previous versions of HTML, one would use the <div id=""> tag to separate the page for styling and functionality of the page. HTML5 sets out to standardize the naming and use of these divisions.


<body></body>

Same as before, one <body> tag per page. Holds the displayed content of the document.


<article></article>

This is new to HTML5. The <article> element represents a self-contained composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

You may also have an nested <article> within an <article> that is related to the content of the outer <article>.  An example of this could be the comment section to a blog. In addition, the <header> and <footer> tag may be used within each <article> on a page to state date, authorship, etc.


<section></section>

Described as a thematic grouping of content. It is not meant to replace the <div> tag which is used for styling purposes.  The <section> tag is meant to separate subjects - as one would do with the subjects of an outline. You may use an <h1> in each section of the document, no matter in which level that section falls.


<nav></nav>

This tag is to be used for a section with navigation links. This is intended mostly for major navigation blocks, such as a main menu, rather that for every set of navigation links.


<aside></aside>

This is for items that are not necessarily related to the main content often put in the sidebar area.This that might go in here are pull-quotes, advertisments, groups of navigation elements, archive links, etc.


<h1></h1><h2></h2><h3></h3><h4></h4><h5></h5><h6></h6>

The h tags have rank according to the number with h1 being the highest. They are best used as a subject of a section. It is alos important to use them wisely for SEO purposes.


<hgroup></hgroup>

The hgroup tag is used for grouping h tags when there is more than one level of tags placed together.


<header></header>

The header element is used to contain the section's heading (the h1 - h6 tags) and an other introductory graphics for the section. There can be more than one header on a page as there may be nore than one section on the page. It should not contain content for the section or used to be an introduction for the section.


<footer></footer>

 The footer element represents a footer for its nearest ancestor sectioning content.  You may have more than one <footer> element on the page - as long as they are held within their own <section>.  The <footer> element represent appendices, indexes, licence agreements, etc.   Per the w3c documentation, the contact information for the author, website, etc., should be put inside of an <address> element - which then could be within a <footer> element.


<address></address>

 The <address> element represents the contact information for it's nearest <article> or <body> element. It should not contain information other than contact information.


<video></video>

The <video> element is for playing videos, movies or audio files with captions. You may include fall back content within the video tags for older browsers that do not support the <video> tag.  Within the <video> tags you may have any of these attributes:

src:, preload:, autoplay, mediagroup: loop:, muted: and controls:.


<audio></audio>

 The <audio> element specifies a standard method of embedding an audio component in the web page. You may also specify <audio controls> to add controls for the audio component such as play, pause and volume. 

The text places between the <audio> tags will contain the <source src="/" type=""> audio file information. There may be multiple sources, as different browsers and different devices require different types of audion files. The browser will use the first type of file that it can recognize.

Newer browsers recognize the <audio> file, but older browsers may not.


<canvas></canvas>

 The <canvas> element is used to create graphics on a web page at that moment. It creates a container for the graphics. It used with JavaScript and jQuery and other scripting languages. The <canvas> can also be targeted with CSS for styling purposes.

Source:dev.w3.org/html5/spec