h1, h2 HTML Headings and SEO

h1-seo

Headings are used to structure the contents of a document by specifying a hierarchy of sections. They help creating the document outline for user agents. It’s also helpful to know that H1 heading is one of the most talked and controversial subject among search engine optimization professionals. And that’s for a good reason; the lack of communication with webmasters from search engines leaves room for intense debates. Add accessibility issues next to SEO and you will see why such debates will never end.

Before going into what SEOs, programmers, designers and copywriters should know about HTML headings, let’s go through some of the most common questions about them. Keep not that for the rest of the article I will mostly refer to H1 and HTML headings interchangeably.

Tricky questions about the H1 tag

First thing everybody needs to know (before thinking SEO) is that headings play a huge role into the accessibility of your website. Screen readers are looking for H1 to H6 tag to rapidly “jump” blind people within the section of a page. They can “skim” a page by pressing the “H” key to jump/hear from one heading to another. Considering this argument only, you should pay more attention to your document outline and headings.

Here are few interesting questions:

1. Will multiple H1 hurt my rankings or is it considered a spam technique?

2. Is it ok to have the same H1 on each page of the website?

3. Is it H1 image replacement in the logo good/bad/spam?

4. Should H1 be the same with <TITLE> tag?

5. Is there any correlation between H1 and better rankings?

Here’s what I think:

1. Will multiple H1′s hurt my rankings or are they considered spam?

multiple h1 warning

Will multiple H1 tags hurt my ranking?

Most likely no. Multiple H1s are acceptable and if you think logically, there are valid reasons for multiple H1 on the same page. For example, WordPress assigns H1 to all post title on the home page (we actually modified the theme to go with H2, if you look at our blog home page). This myth has also been debunked by Matt Cutts, the head of web spam at Google, in this video.

Keep in mind thou that multiple H1 could trigger spam flags, as reported here.

Contradictory enough, Bing recommends that each page should contain a single H1 tag.

2. Is it ok to have the same H1 on each page of the website?

internet marketing services tag line above logo

Same H1 on each page, good or bad?

Yes and No. Again, if you look at the default installation of WordPress you will notice that WP sets the same H1 on each page (usually, that H1 will be the blog name). This can be good or bad, depending on your website. I used to wrap the same, most important keyword in an H1 on each page to hint Google about what’s the main theme of the website (Internet Marketing Services). However, read question #5 to understand why we don’t mind too much about same H1 on the each page of the site.

3. Is it H1 image replacement in the logo considered spam. Is it good or is it bad?

w3c html code displaying h1 image replacement

W3C uses H1 image replacement too

No, it is definitely not spam as long as you don’t abuse this technique with keyword stuffing or other crazy stuff. W3C uses image replacement, SEOmoz used it before their 2011 redesign, A List Apart does it too and Smashing Magazine also.

Funny, there’s even a website where you can vote your opinion on this subject.

Bing suggests in the same document mentioned at questions #1 that each heading should contain only text. So, Bing doesn’t like image replacement? And since there seems to be a very strong similarity between Google and Bing algorithms, would this mean you should not use H1 image replacement for Google?

I wouldn’t worry about it, however I tend not to recommend putting logo images with alt text under the H1 heading. I would rather put a text tagline below/above the logo and make it H1, rather than image replacement, depending on the website.

I am not sure if H1 image replacement is good or not from an accessibility point of view. Any light on this subject would be appreciated.

4. Should H1 be the same with <TITLE> tag?

There’s no penalty for doing so, but the answer is no, it shouldn’t. Search engines tend to give less weight to content which is not directly visible in the browser or SERPs, because such content can and is abused/spammed. You can’t hide the TITLE element on the title bar of the browsers, but you can do that with H1, right? Thinking white hat (where you don’t actually hide H1 content) why would you repeat the same content twice?

The HTML specs specify that, authors should use the TITLE element to identify the contents of a document and that the TITLE element is not considered part of the flow of text. Hence, TITLE and H1 are used in different contexts. TITLE is used to identify the contents of a document, while H1 describes the section of information that it introduces.

Also keep in mind that TITLE show is the SERPs and it has a limited space to impress, while H1 can be expanded. If you can, write TITLE tags with both SEO and CTR in mind, but write headings just for conversion. However, you should include the page targeted keyword(s) in both elements.

5. Is there any correlation between H1 and better rankings?

Yes, but not as strong as SEOs think. SEOmoz research claims that there is just little positive influence on rankings, as compared to using large font. But, wait! It’s not zero, and if it’s positive then you should take it into consideration.

However, one thing is for sure: changing the content of the heading tags is changing the document outline and structure. And that’s important.

keyword confidence tables

Keyword Confidence with & w/o H1

The tables above are displaying what Bing is “thinking” about the relevance of the term seo services on our home page. The left hand had “seo services” in the H1 tag, while the one on the right does not contain the term inside the H1 tag. To get this “secret” keyword confidence report read our article on Ad Intelligence.

Also, here’s an interesting statement from one of the recent Google Webmaster Central blog post:

“One way Google’s algorithms determine the context of content on a page is by looking at the page’s headings. The way semantic markup is used throughout a site, including h1, h2, and h3 tags, helps us to understand the priorities of a site’s content”

What designers should know about HTML headings

- Don’t embed headings into images

- The look and feel of the headings can be altered using CSS; if your desired font is not browser standard you should use image replacement techniques such as sFIR to accomplish your goals

- Heading levels (1-6) should be differ visually one from each other, at least by font size, if not by color and letter spacing too

- Think how your design will be coded in HTML so that the first heading in the code will be H1, then H2, then H3 and so on. It’s interesting to note that Web Content Accessibility Guidelines 2.0 WCAG 2.0 accepts (and even suggests) using H2 before H1 for 3 column layouts. What’s even more surprisingly is that they also suggested that headings can be used to display navigation elements.

- Do not use inline styles, use CSS include files (for page load speed)

- You should use headings consistently throughout your designed page (consistent design)

What SEOs should know about H1 and other HTML heading tags?

- Using the appropriate HTML heading order helps users get a sense of the hierarchy of information on the page. The appropriate use of H1-H3 heading tags also allows users of assistive technologies to understand the hierarchy of information. (source)

- H1 should be the first heading on the page.

- Use the main keyword of the page in H1

- If you chose to have the same H1 on each page of the website, use the single most important keyword for your business inside the H1

- You can have multiple headings on the same page, even H1 if it makes sense (see question #1 above)

- It’s not advisable to skip heading levels (i.e. H1 to H3), but you can go from H2 to H3 then H3 again, then back to H2

- Google will always focus on content relevance rather than the HTML standards compliance or the technical knowledge of the programmer, designer or webmaster who wrote the code.

- Anything that visually looks like a heading should be marked up as a real HMTL heading because it is more important to mark up headings as headings than having a perfect heading hierarchy.

What should programmers know about H1-H6 tags

- Every page within your site should have at least one heading, preferably the H1 tag

- Default WordPress themes (and possibly other blogging platform) are big time offenders: multiple H1 tags on the front page, H2 in sidebars, etc

- If you’re running a WP blog, the home page needs a different heading structure than the post page – read this article to understand why

- don’t hyper link your headings (especially for Google News) to point back to the same page

- Use H1 to H6 to mark up the text for humans not for search engine bots

- Generally, it is not a good idea to hide (i.e. -9999px outside the screen, or display:none) anything under heading tags. This may trigger a spam flag or a human evaluation of your website and you don’t want that ;)

Headings and SEO

What should copywriters know about H1-H6 tags

- All other headings (except H1) are subheadings; they should thematically connected with the previous level heading

- Your H1 should contain your main keyword on that page, or site if you go with a site wide H1, it should be the same on each page

- H1 should be similar but not the same as the page <TITLE>

- Headings should be grammatically correct, logical, easy to scan and related to the text to follow

- Headings are one of the most important things to consider for conversion rate optimization. They should contain your targeted keyword but also entice visitors to take action on that page. There should be a tradeoff between CRO and SEO

- Headings should always be subject to testing and optimization. When testing keep in mind that varying the heading can have impact on your rankings. Read our article on minimizing the impact of A/B Testing on SEO.

Hopefully, you are now fully convinced that you have to use headings properly on each page of the website, if not for SEO purposes but at least for accessibility concerns. One of the main reasons for using them, apart from being good coding practice, heading tags are for screen readers, and it is very important for that reason alone.

If you were patient enough to read this entire article, I would like to have your thoughts on this controversial subject.

Pitstop Media offers ROI focused SEO services. If you need a SEO company to help you rank #1 please contact us for a free, no obligation quote. We’ve helped companies rank first on Google in short periods of time, for highly competitive terms.

VN:F [1.9.22_1171]
Rating: 9.4/10 (41 votes cast)
VN:F [1.9.22_1171]
Rating: +16 (from 16 votes)
h1, h2 HTML Headings and SEO, 9.4 out of 10 based on 41 ratings

About 

Traian is Founder and Director of Search Marketing at Pitstop Media Inc. He has more than 11 years experience in helping small and medium businesses generate and convert organic traffic from search engines. Connect with Traian on Google+

 

35 Responses to “h1, h2 HTML Headings and SEO”

  1. Candace Dellos said:

    Jul 27, 11 at 9:53 am

    Very useful post here. Thanks for sharing your wisdom with me. I’ll definitely be back and will tell so friends about your site.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  2. Watpads said:

    Nov 07, 11 at 11:24 am

    Can any body please describe me how we can optimize flash website in terms of SEO

    VA:F [1.9.22_1171]
    Rating: 5.0/5 (1 vote cast)
    VA:F [1.9.22_1171]
    Rating: -1 (from 1 vote)
  3. TraiaN said:

    Nov 10, 11 at 4:28 pm

    just don’t use Flash. switch to HTML5 or CSS+javascript

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 2 votes)
  4. Rakel O'Add said:

    Nov 12, 11 at 8:03 am

    By not having a h1 on the site but always on the page, it is likely that the comparable value of that specific page will be higher since it does not have to share the power of the h1 with more factors, right?

    E.g. spreading the link juicie just on the pages will make the page stronger than using it on both site and pages, right`?

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  5. TraiaN said:

    Nov 14, 11 at 10:42 am

    Rakel, I don’t understand what you mean by “not having a h1 on the site but always on the page”. H1 is an page factor, not a server factor.

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  6. mystaku said:

    Dec 19, 11 at 10:50 pm

    Thanks a lot for the tutorial :)

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  7. Ali said:

    Jan 15, 12 at 3:19 pm

    Was Very good.
    very tanks for your tutorial :)
    regards

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  8. ancajasjc said:

    Mar 12, 12 at 1:07 am

    thanks for this information. but still a little problem when in terms of h1 vs strong tag.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  9. Slots said:

    Mar 12, 12 at 11:23 am

    I used to work with blog settings that had the same h1 heading as title text, changed headings to h2 but now my other site has the same h1 tag across all pages and it is not a blog will google see this differently being it not generated with wordpress but by static html pages?

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  10. TraiaN said:

    Mar 12, 12 at 11:30 am

    Google doesn’t really know/care if a page was generated with WordPress or is a static html. As long as the H1 tag is pertinent and not spammy, you should be fine.

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  11. Yaeger Design said:

    Apr 04, 12 at 2:26 pm

    @TraiaN, yes, Google does know. Just take a look at your Webmaster Tools dashboard…

    @PitStopMedia, thanks for the great writeup. There are some good tips here that I will certainly use moving forward in designing sites for SEO.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: +1 (from 1 vote)
  12. Andrew Taylor said:

    Jul 22, 12 at 12:54 pm

    I have a question regarding and tags. I have no idea until I run tests etc but I can’t do that with a live site.

    Imagine an e-commerce site selling Teddy Bears in Australia , all different models of bears. A particular page would have the heading “Brown Teddy Bear” with keyword content below. Later on in the page I would have with it’s keyword content below also. I am trying to target both googlers looking for teddy bears and teddy bears in Australia. I am unable to use a single tag for “Teddy Bear Australia”.

    My question is , am I better off using 2 tags , or , or perhaps only . Thoughts? This analogy probably makes me seem simple , I most certainly am!

    Email moi if you have a brilliant insight : airmontaustralia@live.com

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  13. TraiaN said:

    Jul 22, 12 at 4:13 pm

    Do people in Australia really search for “teddy bear Australia?”. What’s the search volume for the phrase in exact match?
    If the volume is low, you could rank for that term is you add Australia at the end of the TITLE tag. I would not use the word Australia in the H1 heading, but I would probably use it in the copy of the product.

    VN:F [1.9.22_1171]
    Rating: 3.5/5 (2 votes cast)
    VN:F [1.9.22_1171]
    Rating: +1 (from 1 vote)
  14. Janardhanprasad DVS said:

    Jul 25, 12 at 8:32 am

    Dear Sir(s),

    My problem is with SEO of my Web site(s), which are non commercial. I have little knowledge about Computer programming.

    In fact, in Weebly hosting there is provision for submitting Web site title and page titles and meta key words, and also provisions for submitting header and footer codes for google, etc,in the Web site design itself. Accordingly I did what could do in the Advanced settings Tab of Weebly SEO widows a few months back.

    But the key words, title words did not attract any search engine signals.

    I found that these Web site title and page title which were submitted by me through Advanced settings tab were not transferred to the HTML codes.

    A few days back I have edited the title tag in head section of html and wrote the Web site name there. But could not submit title tags for each and every page because there is only one HTML for all pages.

    That is, HTML/CSS is common for all pages.

    When I tried to use h1, h2, .. tags to enter page title and paragraph titles in the HTML the entries are showing up in all the pages immediately.

    I am unable to set up separate h1…tags for each and every page separately.

    Please help me by giving your valuable suggesyions to create titles in the HTML for each and every page separately.

    Yours sincerely,
    Janardhanprasad DVS

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  15. Traian Neacsu said:

    Jul 25, 12 at 10:36 am

    Janardhanprasad,

    I am not familiar with Weebly SEO, so I can’t tell you how to do it. You should contact them directly.

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  16. Matras Kopen said:

    Aug 08, 12 at 2:30 am

    Is it important to have first the h1 tag and thén the h2 tag? In some cases I have on my page first a h2title and then the h1…

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  17. Bruce Wampler said:

    Sep 03, 12 at 1:13 pm

    I have come to the conclusion that all this H1/H2 stuff is obsolete with the advent of HTML5. The long time intent of HTML is to describe structure, and now HTML5 has tags that appropriately mark the content structure (, , , etc.) that now allow H1 to mean BIG HEADING and nothing more.

    There has been considerable recent discussion various places on the web that search engines recognize HTML5, and so the so-called importance of H1 is much diminished.

    It is time to move on and use the features of HTML5.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  18. Steven said:

    Sep 30, 12 at 11:36 pm

    So if I use h1 tag for getting robots easier identify wy website, I can also optimize my meta title at the same time .

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  19. How To Write SEO Friendly Blog Headline said:

    Oct 03, 12 at 6:30 am

    [...] forget to optimize your headlines for SEO [...]

  20. Stefan said:

    Dec 04, 12 at 12:37 am

    I used h1 image replacements for my start page using my h1-text inside the alt-tag (as recommended by various sources)

    it seems that google did not pick up my alt-text as an h1, instead ignored it and states no h1 for my start page

    so I would vote against h1 image replacement

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  21. Traian Neacsu said:

    Dec 04, 12 at 1:27 pm

    I just checked your website. What you have there for the logo doesn’t seem like image replacement, but just an alt text. You may want to check the source code of http://www.w3.org. You will notice there’s a span element wrapped in the H1.

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  22. Tom said:

    Dec 19, 12 at 2:35 pm

    Great info! Thanks!!

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  23. Sunita said:

    Dec 27, 12 at 11:28 am

    Loved the information provided. We are currently redesigning our site and this information will be very useful for us.

    Thanks again!

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  24. Kamal Yusuf said:

    Jan 29, 13 at 9:23 am

    hi nice post

    i just make a new blog and have problem with this H1 tags, it said i have 2 H1 tags the one is “original text” the other is my title head

    gladly it’s solved now, but if i know having 2 h1 tags doesn’t that matter i wouldn’t worry that much before

    ty

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  25. Roni Mmi said:

    Feb 07, 13 at 12:45 am

    thanks for your informative post. As i should mention…i previously used + ! sign for my website title and i still prefer – and | this is much better.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  26. Alfredo said:

    Feb 13, 13 at 1:54 pm

    What do you recommend if my website shows the same structure of content in all my pages? I have the same subtitles in every page, so can I use a H2 tag for the content inside that subtitle?

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  27. Traian Neacsu said:

    Feb 18, 13 at 3:34 pm

    Alfredo, I am not sure I understand what you’re trying to say…

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  28. Rex said:

    Feb 22, 13 at 5:08 am

    Hi,

    I find the article/blog very informative specially for a beginner like me. But the one thing I was looking for seems to be wasn’t discussed. I’m actually trying to look for an answer regarding WP title pages on an SEO perspective. When I make a page in WP the theme framework automatically makes the title page as H1 if i’m not mistaken, which is this: . But I would like to hide the page title on my homepage so it won’t display the word “Home”. But then I don’t want to compromise the SEO friendliness of the website.

    I did already remove the part wherein the page will automatically use the entry-title as H1 of the page, specifically on my homepage. But do you think that’s good for my website? And I’ll be using a different H1 on my homepage which is a part of the homepage content and not the entry-title.

    Please let me know what would be the best thing to do since I’m really getting confused as to what the WP community suggests me to do like hiding H1 though CSS or omitting that entry-title which I have done. Feel free to check my website but it’s still under development and I’m only concerned to my homepage as of now.

    Great work on this article.

    Rex

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  29. Traian Neacsu said:

    Feb 25, 13 at 10:47 am

    Rex, having a different H1 on your home page than the rest of the site is totally fine for SEO. You may want to keep only one H1 on your home page, rather than 3 – not that there will be a penalty for having 3 of them, but multiple H1′s on such a light content page is not really necessary.

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  30. V. Antonio said:

    Feb 28, 13 at 7:58 pm

    The image replacement method you use as an example for “not to do” puts an image tag inside the H1. How about css image replacement like this:
    h1 {
    padding-top: 100px;
    width: 200px;
    height: 0;
    overflow: hidden;
    background: transparent url(‘yourLovelyLogo.png’) 0 0 no-repeat;
    }
    So long as the text in the logo image and the text within the H1 matches, I don’t see an issue with this method. Your thoughts or opinion?

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  31. Traian Neacsu said:

    Feb 28, 13 at 9:47 pm

    Antonio, I am not sure to which example are you referring to.

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  32. Nancy said:

    Mar 09, 13 at 3:16 pm

    rewrote (missing words in previous email)

    I found your article very informative. I am going to modify my h1,
    h2 fonts. I have been struggling with using the same H1 title on each page of within category or if I should make the H1 title on each page unique. Still a little torn. I noticed that top ranking competitors sites use a unique h1 for each sub category.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  33. Eoghan Wyndham said:

    Mar 19, 13 at 4:43 pm

    Very rarely do I leave comments, but in this case, I am forced to: exquisite post, Mr. Neacsu. Yours has proven among the positively most helpful h1-related posts on the web. Thank you.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  34. Traian Neacsu said:

    Mar 19, 13 at 8:52 pm

    Eoghan, thank a lot. Your comment has made my day (actually, my night).

    VN:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VN:F [1.9.22_1171]
    Rating: 0 (from 0 votes)
  35. Nugraha said:

    Apr 04, 13 at 6:42 am

    I have found many greats thing about headings on this post, and I think single H1 is better than multiple H1 heading. Thanks U.

    VA:F [1.9.22_1171]
    Rating: 0.0/5 (0 votes cast)
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)