Heading order in HTML5

Question

This is a webpage example of my site:

<html>

<title> artilce header </title>

<body>
    <header> <h1> nme of website</h1></header>

    <section>
        <h2> name of section</h2>

        <article>
            <h3>article header</h3>

        </article>
    </section>
</body>
</html>

I want to know if this order is correct? Or does it maybe have a bad effect on SEO?

header is in all pages, section must have an header because of header/…

For example, do I I have to change it to something like this:

<html>

<title> artilce header </title>

<body>
    <header> <h2> nme of website</h2></header>

    <section>
        <h3> name of section</h3>

        <article>
            <h1>article header</h1>

        </article>
    </section>
</body>
</html>

score 0 · Accepted Answer · edited May 23 '17 at 12:05

0

Both variants are valid HTML5.

The HTML5 spec says about headings and sections:

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.

So your first example is recommended by HTML5.

HTML5 does not define that h1 would be more "important" than h6.
How consumers (like search engines) interpret this is up to them and it most likely differs from consumer to consumer, so you’d have to check their documentation.

edited May 23 '17 at 12:05

Community

1
1

answered Jun 03 '15 at 12:32

unor

92,415
26
211
360

To be clear, h1 is a higher rank than h6. Which may be a different meaning than "important" but I wouldn't think so. – Rob Jun 03 '15 at 12:44

score -1 · Answer 2 · answered Jun 03 '15 at 10:09

-1

Use your Second Concept it looks simple and good as per SEO.

answered Jun 03 '15 at 10:09

Richard Olga

1

Heading order in HTML5

2 Answers2

Linked