There are several new features that accompany the new HTML5 standards, and with those, a host of new tags that you’ll be using to add new functionality to your websites, as well as in place of older, now deprecated methods.

This list comprises the new tags that appear in HTML5. As of this writing, not all of these have been implemented across browsers equally, and some may require different browser-by-browser implementation methods.  While the vast majority are at present support, each should be further researched before inclusion in your project.

New Markup Elements


For external content, like text from a news-article, blog, forum, or any other content from an external source


For content aside from the content it is placed in. The aside content should be related to the surrounding content


A button, or a radiobutton, or a checkbox


For describing details about a document, or parts of a document


A caption, or summary, inside the details element


For grouping a section of stand-alone content, could be a video


The caption of the figure section


For a footer of a document or section, could include the name of the author, the date of the document, contact information, or copyright information


For an introduction of a document or section, could include navigation


For a section of headings, using <h1> to <h6>, where the largest is the main heading of the section, and the others are sub-headings


For text that should be highlighted


For a measurement, used only if the maximum and minimum values are known


For a section of navigation


The state of a work in progress


For ruby annotation (Chinese notes or characters)


For explanation of the ruby annotation


What to show browsers that do not support the ruby element


For a section in a document. Such as chapters, headers, footers, or any other sections of the document


For defining a time or a date, or both

New Media Elements

HTML 5 provides a new standard for media content:




For multimedia content, sounds, music or other audio streams


For video content, such as a movie clip or other video streams


For media resources for media elements, defined inside video or audio elements


For embedded content, such as a plug-in

The Canvas Element

The canvas element uses JavaScript to make drawings on a web page.




For making graphics with a script

New Form Elements

HTML5 offers more form elements, with more functionality:




A list of options for input values


Generate keys to authenticate users


For different types of output, such as output written by a script

New Input Type Attribute Values

Also, the input element’s type attribute has many new values, for better input control before sending it to the server:




The input value is of type telephone number


The input field is a search field


The input value is a URL


The input value is one or more email addresses


The input value is a date and/or time


The input value is a date


The input value is a month


The input value is a week


The input value is of type time


The input value is a local date/time


The input value is a number


The input value is a number in a given range


The input value is a hexadecimal color, like #FF8800

HTML5 also has a new DocType, and a blank template for an HTML5-compliant document has been attached at the bottom of this tutorial. Without this inclusion, the markup will likely not be recognized, and may render some elements inactive. 

Download Source Files