The <header> tag specifies a header for a document or section.
The <header> element should be used as a container for introductory content or set of navigational links.
You can have several <header> elements in one document. 
Note: A <header> tag cannot be placed within a <footer>, <address> or another <header> element.

Header 1

Header 2

The <hgroup> tag is used to group heading elements.
The <hgroup> element is used to group a set of <h1> to <h6> elements, when a heading has multiple levels (subheadings).

heading 1

heading 2


The <article> tag specifies independent, self-contained content.
An article should make sense on its own and it should be possible to distribute it independently from the rest of the site.

The <time> tag defines either a time (24 hour clock), or a date in the Gregorian calendar, optionally with a time and a time-zone offset.
This element can be used as a way to encode dates and times in a machine-readable way so that, for example, user agents can offer to add birthday reminders or scheduled events to the user's calendar, and search engines can produce smarter search results.

We open at every morning.
I have a date on .

The Word Break Opportunity (<wbr>) specifies where in a text it would be ok to add a line-break.
Tip: When a word is too long, or you are afraid that the browser will break your lines at the wrong place, you can use the <wbr> element to add word break opportunities.

To learn AJAX, you must be familiar with the XML Http Request Object.


bdi stands for Bi-directional Isolation.
The <bdi> tag isolates a part of text that might be formatted in a different direction from other text outside it.
This element is useful when embedding user-generated content with an unknown directionality.

The <summary> tag defines a visible heading for the <details> element. The heading can be clicked to view/hide the details.

The <details> tag specifies additional details that the user can view or hide on demand.

The <details> tag can used to create an interactive widget that the user can open and close. Any sort of content can be put inside the <details> tag.

The content of a <details> element should not be visible unless the open attribute is set.

Tip: The <summary> tag is used to specify a visible heading for the details. The heading can be clicked to view/hide the details.

HTML5 Logo

The <figure> tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
While the content of the <figure> element is related to the main flow, its position is independent of the main flow, and if removed it should not affect the flow of the document.
Tip: The <figcaption> element is used to add a caption for the <figure> element.

The <figcaption> tag defines a caption for a <figure> element.
The <figcaption> element can be placed as the first or last child of the <figure> element.

The <mark> tag defines marked text.
Use the <mark> tag if you want to highlight parts of your text.

Some marked up text witin a sentence.

The <meter> tag defines a scalar measurement within a known range, or a fractional value. This is also known as a gauge.
Examples: Disk usage, the relevance of a query result, etc.
Note: The <meter> tag should not be used to indicate progress (as in a progress bar). For progress bars, use the <progress> tag.

2 out of 10

Tip: Use the <progress> tag in conjunction with JavaScript to display the progress of a task.
Note: The <progress> tag is not suitable for representing a gauge (e.g. disk space usage or relevance of a query result). To represent a gauge, use the <meter> tag instead.

The <ruby> tag specifies a ruby annotation.
Ruby annotations are used for East Asian typography, to show the pronunciation of East Asian characters.
Use the <ruby> tag together with the <rt> and/or the <rp> tags: The <ruby> element consists of one or more characters that needs an explanation/pronunciation, and an <rt> element that gives that information, and an optional <rp> element that defines what to show for browsers that not support ruby annotations.
The <rp> tag defines what to show if a browser does NOT support ruby annotations.


The <nav> tag defines a section of navigation links.
Not all links of a document must be in a <nav> element. The <nav> element is intended only for major block of navigation links.
Browsers, such as screen readers for disabled users, can use this element to determine whether to omit the initial rendering of this content.

The <command> tag defines a command (a radiobutton, a checkbox, or a command button) that the user can invoke.
A command can be part of a context menu or toolbar, using the <menu> element, or can be put anywhere else in the page, to define a keyboard shortcut.


The <footer> tag defines a footer for a document or section.
A <footer> element should contain information about its containing element.
A footer typically contains the author of the document, copyright information, links to terms of use, contact information, etc.
You can have several <footer> elements in one document.
Tip: Contact information inside a <footer> element should go inside an <address> tag.

The <section> tag defines sections in a document. Such as chapters, headers, footers, or any other sections of the document.