We wanted to provide a comprehensive references of elements that are new or have been redefined in HTML5, so we've created a glossary. We'll be adding to this in the coming weeks to make it more comprehensive.
Represents an abbreviation or acronym. The optional title attribute may be used to provide an expansion of the abbreviation. If specified, the title attribute must contain an expansion of the abbreviation and nothing else.
The <abbr title="Web Hypertext Application Technology Working Group">WHATWG</abbr> started working on HTML5 in 2004.
Represents a section of a page that consists of a composition that forms an independent part of a document, page, or site. This could be a forum post, a magazine or newspaper article, a Web log entry, a user-submitted comment, or any other independent item of content.
<article>
<header>
<h4><a href="#comment-2" rel="bookmark">Comment #2</a>
by <a href="http://example.com/">Jack Osborne</a></h4>
<time datetime="2007-08-29T13:58Z">August 29th, 2007 at 13:58</time>
</header>
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.
</article>
Represents a section of a page consisting of content that is tangentially related to the content around the aside element, and which could be considered separate from that content. Such sections are often represented as sidebars in printed typography.
<aside>
<h2>Blogroll</h2>
<ul>
<li><a href="/2007/09/">My Friend</a></li>
<li><a href="/2007/08/">My Other Friend</a></li>
<li><a href="/2007/07/">My Best Friend</a></li>
</ul>
</aside>
Content may be nested inside the audio element. User agents should not show this content to the user. Authors should use this content to force older browsers to use a legacy audio plugin or to inform the user of how to access the audio content.
Represents a span of text to be stylistically offset from the normal prose without conveying any extra importance. Examples are key words in a document abstract, product names in a review, or other spans of text whose typical typographic presentation is bold.
The b element should be used as a last resort when no other element is more appropriate. In particular, headings should use the h1 to h6 elements, stress emphasis should use the em element, importance should be denoted with the strong element, and text marked or highlighted should use the mark element.
Deckard: The report would be routine retirement of a replicant which didn’t make me feel any better about shooting a woman in the back. There it was again. Feeling, in myself. For her, for Rachael.
C
canvas
Represents a resolution-dependent bitmap canvas, which can be used for rendering graphs, game graphics, or other visual images on the fly.
Authors should not use the canvas element in a document when a more suitable element is available. For example, it is inappropriate to use a canvas element to render a page heading. If the desired presentation of the heading is graphically intense, it should be marked up using appropriate elements (typically h1) and then styled using CSS and supporting technologies such as XBL.
When authors use the canvas element, they must also provide content that, when presented to the user, conveys essentially the same function or purpose as the bitmap canvas. This content should be nested within the canvas element as a fallback.
<canvas id="myCanvas" width="300" height="150">
Fallback content, in case the browser does not support Canvas.
</canvas>
D
details
The details element represents a disclosure widget from which the user can obtain additional information or controls. However, the details element is not appropriate for footnotes.
Represents a description list consisting of zero or more name-value groups. Each group must consist of one or more names (dt elements) each followed by one or more values (dd elements).
Name-value groups may be terms and definitions, metadata topics and values, or any other groups of name-value data. The values within a group are alternatives; multiple paragraphs forming part of the same value must all be given within the same dd element.
<dl>
<dt>address</dt>
<dd>The address element represents the contact information for the section it applies to. If it applies to the body element, then it instead applies to the document as a whole.
</dd>
<dt>article</dt>
<dd>The article element represents a section of a page that consists of a composition that forms an independent part of a document, page, or site. This could be a forum post, a magazine or newspaper article, a Web log entry, a user-submitted comment, or any other independent item of content.</dd>
</dl>
Represents stress emphasis of its contents. The level of emphasis that a particular piece of content has is given by its number of ancestor em elements. The ‘stress’ being referred to is linguistic. If spoken, this stress would be emphasised pronunciation on a word that can change the nuance of a sentence.
Call a doctor now
embed
Represents an integration point for an external(typically non-HTML) application or interactive content.
The optional src attribute specifies the URL of the resource being embedded.
The optional type attribute specifies the MIME type of the plugin to instantiate. The value must be a valid MIME type, optionally with parameters. If both the type attribute and the src attribute are present, then the type attribute must specify the same MIME type as the explicit Content-Type metadata of the resource given by the src attribute.
The figure element represents some flow content, optionally with a caption, that is self-contained and is typically referenced as a single unit from the main flow of the document.
The figure element can be used to annotate illustrations, diagrams, photos, code listings, etc., that are referenced in the main content of the document, but that could, without affecting the flow of the document, be moved away from that primary content — e.g., to the side of the page, to dedicated pages, or to an appendix.
Represents the “footer” of a document or section of a document. The footer element typically contains metadata about its enclosing section, such as who wrote it, links to related documents, copyright data, etc. Contact information for the section given in a footer should be marked up using the address element.
Represents the “header” of a document or section of a document. The header element is typically used to group a set of h1–h6 elements to mark up a page’s title with its subtitle or tagline. header elements may, however, contain more than just the section’s headings and subheadings — e.g., version history information or publication date.
Represents the heading of a section. The hgroup element is used to group a set of h1–h6 elements when the heading has multiple levels, such as subheadings, alternative titles, or taglines.
<hgroup>
<h1>HTML5Doctor.com</h1>
<h2>helping you implement HTML5 today</h2>
</hgroup>
h1–h6
Represent headings and subheadings. These elements rank in importance according to the number in their name. The h1 element is said to have the highest rank, the h6 element has the lowest rank, and two elements with the same name have equal rank.
Represents a paragraph-level thematic break. The “paragraph-level” bit means between blocks of text, so it can’t be used to separate sections of a site. Instead, hr now separates different topics within a section of prose, or between scenes in a novel.
<p>Lorem Ipsum dolor set amet</p>
<hr>
<p>Lorem Ipsum dolor set amet</p>
Represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, a thought, a ship name, or some other prose whose typical typographic presentation is italicized.
Only use i when nothing more suitable is available — e.g., em for text with stress emphasis, strong for text with semantic importance, cite for titles in a citation or bibliography, dfn for defining a word, and var for mathematical variables.
The term prose content is defined above.
Nanotyrannus (“dwarf tyrant”) is a genus of tyrannosaurid dinosaur, and is possibly a juvenile specimen of Tyrannosaurus.
We ate unagi, aburi-zaketako sushi last night.
Represents a run of text in one document marked or highlighted because of its relevance in another context.
When used in a quotation or other block of text referenced in a document, it indicates a highlight that was not present in the original document — e.g., a portion of text in an academic publication that has recently come under additional scrutiny.
In this sentence we'll be using the mark element. <mark>HTML5</mark> Can you see where it has been used?
When the meter binding applies to a meter element, the element is expected to render as an ‘inline-block’ box with a ‘height’ of ‘1em’ and a ‘width’ of ‘5em’, a ‘vertical-align’ of ‘-0.2em’, and with its contents depicting a gauge. When the element is wider than it is tall(or square), the depiction is expected to be of a horizontal gauge, with the minimum value on the right if the ‘direction’ property on this element has a computed value of ‘rtl’, and on the left otherwise. When the element is taller than it is wide, it is expected to depict a vertical gauge, with the minimum value on the bottom.
Represents navigation for a document. The nav element is a section containing links to other documents or to parts within the current document.
Not all groups of links on a page need to be in a nav element — only groups of primary navigation links. In particular, it is common for footers to have a list of links to various key parts of a site, but the footer element is more appropriate in such cases.
The optional for attribute allows an explicit relationship to be made between the result of a calculation and the elements representing the values that influenced the calculation. If specified, the for attribute must contain a string consisting of an unordered set of unique, space-separated tokens, each of which must be the ID of an element in the same document.
<output> 123 Fake Street </output>
P
progress
Represents the completion progress of a task. Progress may be either indeterminate — meaning it is unclear how much work remains before the task is complete (e.g., the task is waiting for a response from a remote host) — or a numeric value between 0 and a given maximum, explicitly specifying the fraction of work that has so far been completed.
Represents a container for parentheses used to wrap ruby text (<rt>) inside a <ruby> element. These are displayed by browsers which don’t support <ruby>, allowing for graceful degradation of ruby content. Browsers which support <ruby> hide <rp> via display:none.
Represents a container for ruby text inside a <ruby> element. <rt> content becomes the small annotations rendered by default above horizontal base text or to the right of vertical base text.
Represents a container for base text and ruby text — small annotations used for phonetic readings in languages such as Japanese and Chinese. Examples include furigana and zhùyīn fúhào (bopomofo).
Represents a generic document or application section. In this context, a section is a thematic grouping of content, typically with a header, possibly with a footer. Examples include chapters in a book, the various tabbed pages in a tabbed dialog box, or the numbered sections of a thesis. A web site’s home page could be split into sections for an introduction, news items, contact information.
Represents side comments such as small print. It is not intended to be presentational. The small element should not be used for extended spans of text such as multiple paragraphs, lists, or sections of text. It is only intended for short runs of text.
Represents strong importance for its contents. Indicate relative importance by nesting strong elements; each strong element increases the importance of its contents. Changing the importance of a piece of text with the strong element does not change the meaning of the sentence.
Warning. This dungeon is dangerous. Avoid the ducks. Take any gold you find.
Represents a precise date and/or time in the proleptic Gregorian calendar. The time element encodes modern dates and times in a machine-readable way, so that, for example, user agents could offer to add an event to the user’s calendar.
<time datetime="2007-08-29T13:58Z">
August 29th, 2007 at 13:58
</time>
Content may be nested inside the video element. User agents should not show this content to the user. Authors should use this content to force older browsers to use a legacy video plugin or to inform the user of how to access the video content.