Is it worth using the W3C validator?

Asked

Viewed 150 times

8

I ask this because it seems that he accuses things that, I think, were not 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’s an optimized document, but in the validator, it’s from the H1 Warning:

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).

Since now, as HTML5 creates nodes, there is no problem using other H1, within the same page, remembering that it has to be within a header, article, etc...

html5 w3c-validator

2 answers

8


Let’s go over the HTML5 specification on the type tags <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 must 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: the tags <h#> are made to mark a section (whether they are within 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 right, 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, I 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>

Just 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>

That’s because the numbering of tags h serve to rank a context block (or a sectioning content, as described by W3C). A sectioning content may OR NOT be delimited by a tag, but it defines the difference between a sectioning root and its children.

Following this logic, I cannot have two tags considered higher level <h1> in the same document, for the same reason I can’t have two sectioning root in relation to the document.

That is, on the dial

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

The #sec1 will always be sectioning root of the document. The #sec2 is sectioning root compared to #sec3. Still, it will never be a sectioning root relative to the document, so it can never receive a tag h higher-level (<h1>), which should belong to the sectioning root of the document.

To deepen the question:

The H1, H2, H3, H4, H5, and H6 Elements

Headings and sections

Sectioning content

Outline

EDIT

I have decided to supplement the answer to better fit the question. As pointed out, it is important both for interpreters and indexers that the site follows the rules of the W3C, in order to offer as uniform an experience as possible. The ranking can only be "a 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 ranking of indexers) not following the markup standards can result in punishments (such as lower indices and, consequently, worse positions in the search lists).

6

Brunno Vianna, answered the technical question well.

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

  1. When your code is within the norms the W3C offers you a stamp of quality, which you can put on your website.

  2. For SEO is great because it helps them a lot bots identify what your website is about.

Browser other questions tagged html5 w3c-validator

You are not signed in. Login or sign up in order to post.