This specification is an extension to the HTML5 specification [HTML5]. It defines an element to be used for the identification of the main content area of a document. All normative content in the HTML5 specification, unless specifically overridden by this specification, is intended to be the basis for this specification.
The main element formalises the common practice of identification of the main content section of a document using the id values such as 'content' and 'main'. It also defines an HTML element that embodies the semantics and function of the WAI-ARIA landmark role=main.
This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at http://www.w3.org/TR/.
This document is subject to change without notice.
This is a First Public Working Draft.
This document was published by the HTML Working Group as a Working Draft. If you are not a HTML working group member and wish to make comments regarding this document please send them to public-html-comments@w3.org (subscribe, archives). If you are a HTML working group member and wish to make comments regarding this document, please send them to public-html@w3.org (subscribe, archives). All feedback is welcome.
Publication as a Working Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
This document was produced by a group operating under the 5 February 2004 W3C Patent Policy. W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.
Table of ContentsThis specification describes the conformance criteria for user agents (relevant to implementers) and documents (relevant to authors and authoring tool implementers).
As well as sections marked as non-normative, all authoring guidelines, diagrams, examples, and notes in this specification are non-normative. Everything else in this specification is normative. The key words must, must not, required, should, should not, recommended, may, and optional in this specification are to be interpreted as described in [RFC2119].
Themain element
article, aside, footer, header or nav element ancestors.
HTMLElement.
The main element represents the main content section of the body of a document or application. The main content section consists of content that is directly related to or expands upon the central topic of a document or central functionality of an application.
Note: the main element is not sectioning content and has no effect on the document outline
The main content section of a document includes content that is unique to that document and excludes content that is repeated across a set of documents such as site navigation links, copyright information, site logos and banners and search forms (unless the document or applications main function is that of a search form).
Authors MUST NOT include more than one main element in a document.
Authors MUST NOT include the main element as a child of an article, aside, footer, header or nav element.
Note: Authors are advised to use ARIA role="main" attribute on the main element until user agents implement the required role mapping.
<main role="main"> ... </main>Code examples
In the following example, we see 2 articles about apples (the main topic of a Web page) the main topic content is identified by the use of the main element.
<!-- other content --> <main> <h1>Apples</h1> <p>The apple is the pomaceous fruit of the apple tree.</p> <article> <h2>Red Delicious</h2> <p>These bright red apples are the most common found in many supermarkets.</p> <p>... </p> <p>... </p> </article> <article> <h2>Granny Smith</h2> <p>These juicy, green apples make a great filling for apple pies.</p> <p>... </p> <p>... </p> </article> </main> <!-- other content -->
Here is a graduation programme the main content section is defined by the use of the main element. Note in this example the main element contains a nav element consisting of links to sub sections of the main content.
<!DOCTYPE html> <html> <head>Guidance for User Agents and HTML specification editors
<title>Graduation Ceremony Summer 2022</title> </head> <body> <header>The Lawson Academy: <nav> <ul> <li><a href="courses.html">Courses</a></li> <li><a href="fees.html">Fees</a></li> <li><a>Graduation</a></li> </nav> </header> <main> <h1>Graduation</h1> <nav> <ul> <li><a href="#ceremony">Ceremony</a></li> <li><a href="#graduates">Graduates</a></li> <li><a href="#awards">Awards</a></li> </nav> <H2 id="ceremony">Ceremony</H2> <p>Opening Procession</p> <p>Speech by Valedictorian</p> <p>Speech by Class President</p> <p>Presentation of Diplomas</p> <p>Closing Speech by Headmaster</p> <h2 id="graduates">Graduates</h2>
<ul><li>Clara Faulkner</li> <li>Anastasia Luccio</li> <li>Ebenezar McCoy</li> <li>Karrin Murphy</li> <li>Eloisa Faulkner</li> <li>Susan Rodriguez</li> </ul> <h2 id="awards">Awards</h2>
<ul><li>Clara Faulkner</li> <li>Eloisa Faulkner</li> <li>Karrin Murphy</li> <li>Susan Rodriguez</li> </ul>
</main> <footer> Copyright 2012 B.lawson</footer> </body> </html>
User agents MUST map the main element to the ARIA landmark role of main.
User agents that support keyboard navigation of content are strongly encouraged to provide a method to navigate to the main element and once navigated to, ensure the next element in the focus order is the first focusable element within the main element. This will provide a simple method for keyboard users to bypass blocks of content such as navigation links.
Remove the section of the HTML5 specification titled 4.13.1 The main part of the content, as this specification makes the content of the cited section no longer applicable.
RenderingThis section is to be treated as a subsection of HTML's Rendering section for the purpose of terminology, conformance classes and requirements.
CSS:
The User Agent style sheet SHOULD include the following style rule for the main element:
@namespace url(http://www.w3.org/1999/xhtml);
main { unicode-bidi: isolate; display: block; }
":not(main)" SHOULD be added to 10.3.5 Bidirectional style rule in the HTML5 spec:
Parsing
:matches([dir=ltr i], [dir=rtl i], [dir=auto i])
:not(address):not(blockquote ):not(center):not(div):not(figure):not(figcaption):not(footer):not(form ):not(header):not(hr):not(legend):not(listing):not(p):not(plaintext):not(pre ):not(summary):not(xmp):not(article):not(aside):not(main) :not(h1):not(h2):not(h3):not(h4 ):not(h5):not(h6):not(hgroup):not(nav):not(section):not(table):not(caption ):not(colgroup):not(col):not(thead):not(tbody):not(tfoot):not(tr):not(td ):not(th):not(dir):not(dd):not(dl):not(dt):not(menu):not(ol):not(ul):not(li)
{ unicode-bidi: embed; }
This section is to be treated as a subsection of HTML's The rules for parsing tokens in HTML content section for the purpose of terminology, conformance classes and requirements.
The tag name "main" must be added to 8.2.5.4.7 The "in body" insertion mode at the following steps:
A start tag whose tag name is one of: "address", "article", "aside", "blockquote", "center", "details", "dialog", "dir", "div", "dl", "fieldset", "figcaption", "figure", "footer", "header", "hgroup", "main", "menu", "nav", "ol", "p", "section", "summary", "ul"
and
References Normative references
An end tag whose tag name is one of: "address", "article", "aside", "blockquote", "button", "center", "details", "dialog", "dir", "div", "dl", "fieldset", "figcaption", "figure", "footer", "header", "hgroup", "listing","main", "menu", "nav", "ol", "pre", "section", "summary", "ul"
A Rationale / Use Case document for the addition of the main feature to HTML is available.
From publicly reported studies [1] of id values used in HTML content, the use of the strings "content" and "main" are common practice. A recent study has provided data which shows a strong correlation between the use of the aforementioned id values as targets for 'skip links' and also a strong correlation with the use of ARIA role=main on elements having the aforementioned id values.
[1] http://triin.net/2006/06/12/CSS#figure-34, http://westciv.typepad.com/dog_or_higher/2005/11/real_world_sema.html, http://dev.opera.com/articles/view/mama-common-attributes/#id, http://lists.w3.org/Archives/Public/public-html/2012Oct/0109.html
AcknowledgementsThanks to Mike [tm] Smith, Dave Bolter, Leonie Watson, Gez Lemon, Sarah Bourne, Henri Sivonen, James Craig, Simon Pieters, Mat Marquis, Ian Devlin, Marcos Caceres and many others.
Enabling FunderThe development of this publication is being funded by The Paciello Group. The content of this publication does not necessarily reflect the views or policies of The Paciello Group, nor does mention of trade names, commercial products, or organizations imply endorsement by The Paciello Group.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.3