1

W3C says in their HTML5 section recommendation, that

<body>
    <h1>Let's call it a draw(ing surface)</h1>
    <h2>Diving in</h2>
    <h2>Simple shapes</h2>
    <h2>Canvas coordinates</h2>
    <h3>Canvas coordinates diagram</h3>
    <h2>Paths</h2>
</body>

and

<body>
    <h1>Let's call it a draw(ing surface)</h1>
    <section>
        <h1>Diving in</h1>
    </section>
    <section>
        <h1>Simple shapes</h1>
    </section>
    <section>
        <h1>Canvas coordinates</h1>
        <section>
            <h1>Canvas coordinates diagram</h1>
        </section>
    </section>
    <section>
        <h1>Paths</h1>
    </section>
</body>

are "semantically equivalent".

If so, why is the W3C HTML validator warning about the latter example?

It says about the second example:

Warning: Consider using the h1 element as a top-level heading only (all h1 elements are treated as top-level headings by many screen readers and other tools).

Is the validator wrong?

Teemoh
  • 332
  • 2
  • 11
  • 1
    I think this is a duplicate: [W3C validation says h1 in article is invalid](https://stackoverflow.com/q/25996074/1591669) – unor Oct 06 '17 at 20:53

2 Answers2

2

No.

The Validator is warning about real world behaviour by software that is in the wild. Many software packages still haven't implemented the HTML 5 outline logic for section elements.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • That means that the official W3C validator is not crucial when it comes to HTML5? – Teemoh Oct 06 '17 at 18:46
  • Does `
    ` change the way `

    ` is rendered? Because otherwise these two examples don't seem to be equivalents.

    – orhtej2 Oct 06 '17 at 18:46
  • @Teemoh — No, it means it may warn you not to depend on new features in HTML 5 when those features are poorly supported. – Quentin Oct 06 '17 at 18:46
  • 2
    @orhtej2 — It changes the way that `h1` is treated when generating an outline. – Quentin Oct 06 '17 at 18:47
  • So first we are recommended and then are warned to do so. I think this should better be a info than a warning. – Teemoh Oct 06 '17 at 18:56
  • @Teemoh Each sectioning element can have a heading. Since that heading was the first in the section, it was specified that it needed to be a `

    ` and most of the current document outliners will react that way. However, browsers do not follow the document outline, unfortunately, so the spec has changed (fairly recently) to reflect that by saying only one `

    ` should be on a page and following sections should be the other heading elements, `

    ,

    `, etc. to maintain an outline order.

    – Rob Oct 06 '17 at 19:01
  • 2
    @Teemoh — No. (1) The HTML specification has an example showing how each section *can* start with an `

    ` representing the most important heading in that section. (2) The HTML specification also says [Sections may contain headings of any rank, and **authors are strongly encouraged to use headings of the appropriate rank** for the section's nesting level.](https://www.w3.org/TR/html5/sections.html#headings-and-sections) with an example that doesn't do what *1* allows. (3) The validator warns about client software which can't cope with what *1* allows and repeats the advice of *2*.

    – Quentin Oct 06 '17 at 19:06
  • 1
    This is exactly what warnings are for: Code which is legal but has the potential to cause problems. – Quentin Oct 06 '17 at 19:07
-1

According to Wikipedia, semantic equivalence means that two data elements have a similar meaning.

The two examples are in the end similar, and when rendered looks pretty much the same. However, this does mean that they are the exact same.
Due to SEO reasons, HTML5 validator will throw a warning when there is an H1 used outside of a section tag and then used elsewhere.

Jay
  • 73
  • 3
  • 14