Is it worth using the W3C validator?

8

I ask this, because it seems that he accuses things that, I think, was not meant to accuse.

For example:

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <title>Titulo do Site</title>
        <meta name="description" content="Teste Teste Teste" />
        <!--A meta abaixo, diz ao navegador, que terá que inicar na resolução 100%-->
        <meta name="viewport" content="width=width-device, initial-scale=1.0" />
    </head>
    <body>
        <!--CABEÇALHO DO NOSSO SITE, COMO MENUS< LOGO, ETC-->
        <header>
            <h1>Teste do Documento</h1>
            <ul>
                <li><a href="#home" title="Teste Teste Teste">Home</a></li>
                <li><a href="#servicos" title="Teste Teste Teste">Serviços</a></li>
                <li><a href="#portifolio" title="Teste Teste Teste">Portfólio</a></li>
                <li><a href="#sobre" title="Teste Teste Teste">Sobre mim</a></li>
                <li><a href="#contato" title="Teste Teste Teste">Contato</a></li>
            </ul>
        </header>

        <!--CONTEUDO DE NOSSO SITE-->
        <main>
            <article>
                <header>
                    <h1>Teste Teste Teste</h1>
                    <p>Teste Teste Teste Teste Teste Teste Teste Teste!</p>
                </header>
            </article>
        </main>

        <!--RODAPE DE NOSSO SITE-->
        <footer>
            <h1>Teste</h1>
            <nav>
                <h1>Teste</h1>
                <p>Teste Teste Teste</p>
            </nav>
        </footer>
    </body>
</html>

It is an optimized document, but, in the validator, it warns of H1:

Warning: Consider using the h1 element as a top-level heading only.

Now, since HTML5 creates nodes, there is no problem to use other H1s within the same page, remembering that it has to be inside a header, article, etc ...

    
asked by anonymous 31.08.2017 / 14:02

2 answers

8

Let's see what the HTML5 specification says about tags of type <h#> :

  

These elements have a rank given by 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.

Yet:

  

h1-h6 elements should not be used to markup subheadings, subtitles, alternative titles and taglines unless intended to be the heading for a new section or subsection.

That is: <h#> tags are made to mark a section (regardless of whether they are inside a session tag or not.) Note:

<section>
    <h1>Titulo</h1>
    <p>Texto</p>
    <h2>Título</h2>
    <p>Texto</p>
    <h2>Título</h2>
    <p>Texto</p>
</section>

It's correct, just like

<section>
    <h1>Titulo</h1>
    <p>Texto</p>
    <article>
        <h2>Título</h2>
        <p>Texto</p>
    </article>
    <article>
        <h2>Título</h2>
        <p>Texto</p>
    </article>
</section>

On the contrary, it would be wrong to use

<section>
    <h1>Titulo</h1>
    <p>Texto</p>
    <h1>Título</h1>
    <p>Texto</p>
    <h1>Título</h1>
    <p>Texto</p>
</section>

The same as

<section>
    <h1>Titulo</h1>
    <p>Texto</p>
    <article>
        <h1>Título</h1>
        <p>Texto</p>
    </article>
    <article>
        <h1>Título</h1>
        <p>Texto</p>
    </article>
</section>

This is because the numbering of the h tags is used to rank a context block (or a sectioning content, as described by W3C). A sectioning content may or may not be delimited by a tag, but it defines the difference between a sectioning root and its children.

Following this logic, I can not have two tags considered top-level <h1> in the same document, for the same reason that I can not have two sectioning root in relation to the document.

That is, in the

<section id="sec1">
    <section id="sec2">
        <section id="sec3">
        </section>
    </section>
</section>

A # sec1 will always be sectioning root of the document. # Sec2 is sectioning root compared to # sec3. Still, it will never be a sectioning root relative to the document; so you can never get a% top-level% ( h ) tag, which should belong to the document's root sectioning.

To dig deeper into the question:

The h1, h2, h3, h4, h5, and h6 elements

Headings and sections

Sectioning content

Outline

EDIT

I decided to complement the answer to better fit the question. As pointed out, it is important for both interpreters and indexers that the site follows W3C rules in order to provide the most uniform experience possible. Rankings can only be "one note" if you or your project decide to ignore these parameters. There is no error in this and the site will run. But in certain scenarios (such as crawler ranking) not following marking standards can result in punishments (such as lower indexes and consequently worse positions in the search lists).

    
31.08.2017 / 14:50
5

Brunno Vianna answered the technical question well.

Now On the question whether it's worth using the validator has 2 points to be weighed.

04.09.2017 / 15:58