HTML stands for HyperText Markup Language
Begin documents with <!doctype html>
Include javascript files like so: <script src="script.js"></script>
Introduction of "sectioning elements": an article, a section, the entire document (header page). Typically the header of a Web site that appears on top of each page, or a header of a long article or section.
Contains the footer of a site, a long article or section.
Section that contains the main navigation links.
Independent content, which can be individually extracted from the document and syndicated (RSS or equivalent) without penalizing its understanding. Typically a blog post.
Generic section used to group different articles for different purposes or subjects, or to define the different sections of a single article. Generally used with a header.
Used for marking up times and dates.
Used to encapsulate a figure as a single item, and contains a caption for the figure, respectively.
Section whose content is not necessarily directly related to the main content that surrounds it, but can provide additional information.
The main element represents the main content of the body of a document or application. The main content area consists of content that is directly related to or expands upon the central topic of a document or central functionality of an application. There can be only one main element in a document and it cannot descend.
http://www.w3.org/html/wg/wiki/User:Sfaulkne/main-usecases#Introduction https://developer.mozilla.org/en-US/docs/Web/HTML/Element/mainFor other styling, such as CSS hooks, see the following flowchart for advice on when to use div:
Headers, replace n with a number, use h1 only once.
Section root
A section for each month and an article for each post.
Tag cloud code.There can be articles in sections and sections in articles.
Articles can contain the nav and footer elements.
Headers h1 to h6 define the document outline which can be visualized with the following extensions:
Using a h3 after a h2 initiates a subsection in the first h2 whereas using another h2 creates a new section.
Always add a heading to explicit sectioning content. Without a header screen readers will say "Entering section" instead of, when there is a header, "Entering section with heading ..."
The <header> element is just a container. It is not taken into account for defining new sections of a document nor does it affect the hierarchy levels.
Place the headers inside section and article elements.
Inspect the document outline through one of the extensions presented above.
In order to NOT display the heading content on screen the recommended technique is described in this article by Steve Faulkner. Do not use display:none or visibility:hidden in your CSS stylesheet, as in that case the heading content will never be vocalized by screen readers
All interactive content must have a visible focus indicator (and be on screen when focused).
These elements have been introduced for displaying a foldable zone.
http://jsbin.com/ifofib/3/edit?html,css,output Nesting is possible. Can be styled with CSS. Like this: http://jsbin.com/ifofib/46/edit Or that: http://jsbin.com/ifofib/8/editCurrently NOT supported in all browsers. See: http://caniuse.com/#feat=details
A polyfill is a piece of JavaScript code you include in your HTML page, that will emulate HTML5 features not yet implemented in browsers.
Can be found at http://caniuse.com/ and http://html5please.com/
Light polyfill for details. This light polyfill does not work 100%. Heavy polyfills can quickly grow to daunting sizes.Provides both a human readable part (the part between ) and a machine readable part contained within a datetime attribute. Dates are expressed as YYYY-MM-DD.
http://www.brucelawson.co.uk/2012/best-of-time/The datetime attribute can be used for indicating a date/time or a duration:
Duration values use the prefix “P” for “period” as in datetime="P4D" (period = four days). So you start the attribute string value with a "P", followed by a duration value that ends with another letter indicating the unit used, like "D" for "days", “H” for hours, “M” for minutes and “S” for seconds.
Highlight important parts of a text, like "quoting parts", etc.
Display search results with search strings highlighted in the results.
http://jsbin.com/otekov/3/editExample CSS: mark { background-color: green; color: yellow; }
Change the default name of downloaded objects: <a href="link" download="newname">
http://www.w3.org/TR/html5/links.html#downloading-resources http://www.htmlfivecan.com/#42For security reasons the image should be located on the same domain as the HTML page that contains the link.
http://jsbin.com/amoxah/2/editStop automatic translation of certain words or passages (such as code): <span translate="no">var love=Infinity</span>
Used for search engine optimization and search result presentation.