[whatwg] Is <main> now an official HTML5 element?

Steve Faulkner faulkner.steve at gmail.com
Fri Mar 1 06:20:39 PST 2013

Mikko Rantalainen wrote:

Ian Yang, 2013-02-14 03:21 (Europe/Helsinki):
> > <!DOCTYPE html>
> > <title>lorem ipsum</title>
> > <header>
> >   ...
> > </header>
> > <main id="main" role="main">
> >   ...
> > </main>
> > <footer>
> >   ...
> > </footer>
> I find the logic to be that if you use <header> and/or <footer> you
> should wrap the main content within <main>. Then use <section> and
> <article> for the structure.
> One thing worth noting is that unlike id="main" or role="main", the
> <main> is intended to be used (nested) multiple times on a page. So,
> following markup does make sense:
> <!DOCTYPE html>
> <html>
> ...
> <body>
> <header>...</header>
> <main>
>  <ul>
>   <li><article>
>    <header>...</header>
>    <main>...</main>
>    <footer>...</footer>
>   </article></li>
>   <li><article>
>    <header>...</header>
>    <main>...</main>
>    <footer>...</footer>
>   </article></li>
>  </ul>
> </main>
> <footer>...</footer>
> </body>
> </html>
> The first header (body > header) hopefully contains the page main header
> (perhaps blog title and slogan, maybe site navigation in <nav>) and
> within the first <main> (body > main) is a list of articles (perhaps
> blog entries?) where each article has its own header (article > header),
> main part (article > main) and the footer (article > footer). (Note that
> the selectors that I used within the parentheses are generic and should
> work equally well on any page that uses <main> element.)
> In the real world, the main part pretty much always requires some
> container (usually for styling and scripting) anyway so better
> standardize <main> for that, IMHO. I know Ian does/did not agree because
> in theory that is not needed because the main part is everything minus
> header minus footer. However, it turns out that neither CSS or JS can
> handle that really well. In the end, the WHATWG was supposed to be about
> real world usage vs. theoretical correctness and this is one example of
> that.
> If the content is authored this way, UA could provide a navigation aid
> called "skip to the start of the next piece of content" instead of the
> current "global skip to the content" implementation allowed by id="main"
> or role="main" which would be usually the same as end of html>body>header.

note: main is intended for the specific purpose of identifying the main
content of the page based on use cases and data of real world usage of
id=main/role=main and hook for skip to content link (and specced (
and implemented in browsers in this way. UAs already provide methods to
naviagte to smaller chunks of content based on element type so main is not
needed for that purpose. Suggest watching leonie watson's presentation
from[1] last week at W3Conf to get a better understanding of UA navigation
of elements and where <main> fits in.

[1] http://www.youtube.com/watch?v=vK1tlLOavvM
with regards

Steve Faulkner

More information about the whatwg mailing list