3

Assume a simple blog-like website as in the picture:

enter image description here

  • Red text is text related to this page only (particular article)
  • Green are headings of articles related to the subject of this page
  • Blue is a completely unrelated text to this page
  • Black is a "guideline text" repeated on every page

You obviously would like to optimize your website - current article - for the article content (red). So the article uses headings from H1 to H3 tags.

But what about the Sidebar and Related articles text? I used to use H2 for "related articles" h3 for THE related articles "Find a way", but since there are a lot of articles and each of them had a h2 text "related articles" and "sidebar", etc.. I found out in Google Webmasters that my website's most notable keywords are "articles" and "sidebar" - so Google thinks that my website content is about "articles" and "sidebars" and that is not what I want to achieve..

I was thinking about using h4 for related articles and h5 for THE related articles headings, but it won't correspond with the heading structure in the article (I would have to end the article with h3 to be able to follow with h4).

there is also a video from Google employee (http://www.youtube.com/watch?v=iR5itZlq8sk) that says it doesn't so much matter if you structure your content like H2 -> H4 (without H3), but in the discussion below they say it is much better to have it in right order.

So how should I structure the Hx tags for the example above to achieve max. SEO (just white-hat techniques)?

Improve this question
2
  • 1
    I only use h1 and h2, rarely h3 and only for the article. I used to make the same mistake and used headings for the keywords "Navigation" or "Related Articles". Removing the extra headings and wrap "Related Articles" in a single div, boosted my website traffic and fixed the keywords. I suggest headings only for title and inside article, and single div for related articles , navigation etc. I believe you want the article to rank for its content, not for the term "Related articles" :)
    – krokola
    Commented Feb 22, 2014 at 15:58
  • I agree with the comment by Krokola above and lean towards using headings only in the article section of a page (and using divs for headings that are in sidebars and outside the main article). This helps maintain heading hierarchy (ie. an H3 should always have an H2 as parent, an H4 should go under an H3, etc.). We used this successfully on past sites, and are about to run a test on a site where we are switching a theme's default "heading" sidebars to divs. I'll post back with our results.
    – user44378
    Commented Aug 27, 2014 at 20:23

1 Answer 1

Reset to default
2

Headings give structure to the document, that is important to remember. Forget about SEO. If you do things right, visitors and ranking will come up.

Now, about the use of H1 - H6.

If you do things right, and taking advantage of the flexibility of HTML5 regarding this subject, you should have a section for each section that you mention, and on each one, you may have headings. Those headings should be used in order, from 1 to 6, but each section gives them independence from the other headings on the other sections.

When I say section, doesn't matter if it's the section or article tags; even any other flow content tag, although section and article are the most common ones.

Conclusion, yes, you should use them if they make sense on the content you are providing.

This is just an example, the correct use of section and article depend on what you want to do.

<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>title of the page</title>
        </head>
    <body>
        <section>
            <h1>main title of the section</h1>
            <p>some text</p>
            <p>some text</p>
            <h2>Secondary title of this section</h2>
            <p>some text</p>
        </section>
        <article>
            <header>
                <h1>main title of the section</h1>
            </header>
            <p>some text</p>
            <p>some text</p>
            <h2>Secondary title of this section</h2>
            <h3>Terciary title of this section</h3>
            <p>some text</p>
            <h3>Terciary title of this section</h3>
            <p>some text</p>
            <h2>Secondary title of this section</h2>
            <p>some text</p>
        </article>
    </body>
</html>
Improve this answer
3
  • Can you please add a part of HTML markup to clarify that?
    – Joudicek Jouda
    Commented Feb 23, 2014 at 10:38
  • Well whoever downvoted the answer is not helping much. If there is something wrong with it, it's much better to comment what it is so I can correct it. If it's a matter of opinion, you can keep hiding behind anonymity, no problem.
    – PatomaS
    Commented Feb 24, 2014 at 15:14
  • 1
    I upvoted, but thats because I missed the double H1. I keep this as rule of thumb: 1 H1, 2 H2's, 3 H3's, etc, per page
    – Martijn
    Commented Jun 23, 2014 at 12:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.