HTML5, it is the new and advance version of HTML . It introduces a bunch of new elements. Here we have some brand new elements in HTML5:
<article>
It defines external content
<aside>
It defines some content aside from the article it is placed in
<audio>
It defines sound, such as music or other audio streams
<canvas>
It defines graphic, such as graphs or other images
<command>
It defines a command button, like a radiobutton, a checkbox, or a button
<datagrid>
It defines a list of selectable data. The datagrid is displayed as a tree-list
<datalist>
It defines a list of selectable data. Use this element together with the input element, to make a dropdown list for the input’s value
<datatemplate>
It defines a container for data template. This element must have child elements to define a template: <rule> elements
<details>
It defines details of an element, which the user can see, and click to hide
<dialog>
It defines a dialog, such as a conversation
<embed>
It defines embedded content, such as a plug-in
<event-source>
It defines a source for events sent by a server
<figure>
Used to group some elements
<footer>
It defines the footer of a section or document. Typically contains the name of the author, the date the document was written and/or contact information
<header>
It defines the header of a section or document
<mark>
It defines marked text. Use the <mark> tag if you want to highlight parts of your text
<meter>
It defines a measurement. Used only for measurements with a known minimum and maximum value
<nav>
It defines a section of navigation links
<nest>
It defines a nestingpoint in a datatemplate for child elements. Used together with the elements <datatemplate> and <rule>
<output>
It defines different types of output, such as output written by a script
<progress>
It defines work-in-progress. Use the progress element to display the progress of a time consuming function in JavaScript
<rule>
It defines the rules for updating a datatemplate. Used together with the elements <datatemplate> and <nest>
<section>
It defines sections in a document. Such as chapters, headers, footers, or any other sections of the document
<source>
It defines media resources for media elements, such as <video> and <audio>
<time>
It defines a time or a date, or both
<video>
It defines video, such as a movie clip or other video streams.
Getting started with HTML5 doctype
To start using HTML5 you’ll need to use the new HTML5 doctype , So simply place this on the first line of your HTML document and you’re ready to start using HTML5.
<!DOCTYPE html>
HTML Basic Structure
HTML 5 introduces a whole set of new elements that make it much easier to structure pages.The markup for that document could look like the following:
<!doctype html>
<html>
<head>
<title>Page title</title>
</head>
<body>
<header>
<h1>Page title</h1>
</header>
<nav>
<!-- Navigation -->
</nav>
<section id="mypage">
<!—Introduction of mypage -->
</section>
<section>
<!-- Main content -->
</section>
<aside>
<!-- Sidebar -->
</aside>
<footer>
<!-- Footer -->
</footer>
</body>
</html>
Summary
HTML5 will be a lot easier to build websites, there are more HTML5 elements to get to grips with so I didn’t want to try and cover everything in one article. However, I hope that now you are more comfortable with HTML5.
