Why H1 and H2 Header Tags Are Important to SEO

It’s not unusual for us to evaluate a potential client’s existing website and realize that it’s missing H1 and H2 (short for Header 1 and Header 2) tags. Typically, this results in two reactions: A raised eyebrow, and a slight cringe. The reason for this is fairly simple, but first you have to understand what H1s and H2s are.

Header 1 text is usually the largest text on the page, and serves as the title for that page’s content.

If a web page was a book, the H1 text would be the book’s title. It tells would-be readers whether that subject matter is relevant to their interests.  For example, if you are looking for tips on how to detangle poodle fur and you come across a page titled, “How to Groom Your Poodle,” you’ll probably read that page. Conversely, if the page is titled, “Why Barry Bonds Shouldn’t Be in the Hall of Fame,” you’re almost certainly not going to read the page, because it almost certainly isn’t going to help your dirty, filthy poodle.

When you look at a web page and see something that looks like a big title at the top of the page, chances are that it’s the Header 1 text. In this blog, the title at the top of this page, “H1 and H2 Header Tags and How They Affect SEO,” has been marked with H1 tags.  If you looked at the source code for this page, you would find this:

<h1 class=”entry-title” itemprop=”headline”>Explaining H1 and H2 Header Tags and How They Affect SEO</h1>

What we’re interested in is the two instances of “h1” in the brackets to either side of the title. These are Header 1 tags, which designate the text between them as Header 1 text. These tags tell your browser—and search engines—that this is the biggest text on the page (unless someone has manually tweaked the site settings), and thus the most important text on the page.

Let’s assume that our Header 1 text has drawn the attention of a visitor, and the visitor is looking for a very specific piece of information that falls under the topic described by the Header 1 text. Time is ticking. The rule of thumb is that a visitor will spend about 10 to 15 seconds on a page to find what they want. So how does your visitor find that desired bit of info?

Relevant Header 2 text guides visitors to a specific section of web content.

If Header 1 text is your book title, then Header 2s are your chapter headings, which give readers a clearer picture of what your content covers, and allows them to quickly find the specific information they want.

The subtitle text above, “Relevant Header 2 text guides visitors to a specific section of web content,” is Header 2 text. If you looked at the source code of this page and searched for that phrase, you would find this snippet of text:

<h2>Relevant Header 2 text guides visitors to a specific section of web content.</h2>

The two instances of “h2” in the brackets to either side of the text tells your browser—and of course, Google—that the text between them should be larger than normal text, but shouldn’t be quite as big as “h1” text. It’s not a big ol’ honking title, but it’s a nice-sized subtitle that will still grab attention.

These subtitles, which divide web pages into bite-sized chunks of information, help visitors quickly track down the information they want.

That’s a big part of why a lack of H1 and H2 tags is problematic. A site that lacks H1s and H2s is like a book that lacks a title and chapter headings. The content is all still there, but it’s significantly more difficult to readers to quickly judge what the overall subject is, and to subsequently drill down and find the specific piece of information that they want. Remember how I said that visitors will spend about 10 seconds to find what they’re looking for? If there’s no H1 and H2 text to guide them, it’s likely that they’ll lose patience and leave.

The presence or lack of H1s and H2s impacts the behavior of site visitors. And as a consequence, search engines use this text (or lack thereof) to help determine what a site is about, and how well it should rank.

Do H1 and H2 tags affect SEO and search engine rankings?

This question has been the source of endless debate among SEO experts for well over a decade. After all that time, the widely accepted answer is a resounding, “Probably.” It’s believed that Header 1 and Header 2 text used to have a larger impact on search rankings than it does now, having been crowded out by more sophisticated measures.

There have been relatively few case studies that have focused on the direct impact of optimized H1 and H2 tags on search rankings, but occasionally one trickles out that indicates that H1s and H2s directly impact search rankings. Conversely, others have found that simply using bigger fonts for key phrases yielded the same results as using H1s and H2s (which frankly amounts to the same thing, and speaking from experience, it’s a lot easier to just use header tags than manually fiddle with text size, especially since WordPress makes header tags so easy to implement).

At this late date, we’re not 100% certain as to whether Google and company look specifically at header tags, or if the way that users respond to content with header tags has a larger impact on search rankings. It’s become a bit of a ‘chicken or the egg’ conundrum.

We know that Google very carefully examines user behavior in order to determine the quality of a website, which is why Google Analytics reports information like bounce rates, average time spent on a web page, etc.—because these data points indicate how useful a page is, and thus how highly Google will rank them. If one page about poodle fur detangling has an average visit time of 12 seconds, and another has an average visit time of 50 seconds, odds are that the second page will rank higher. And a major factor in how long a visitor will spend on a page is how easy it is to parse the content on the page. So… what helps a visitor to parse content? H1 and H2 tags.

Based on personal experience and our work with many clients over the years, we believe that effective use of H1 and H2 tags directly impacts search rankings. But even if the improvements in performance that we attribute to using H1s and H2s are simply the result of an improved user experience yielding lower bounce rates and better user engagement (and as a consequence, better rankings), the takeaway is still the same: Use H1 and H2 tags.

Proper use of H1 and H2 tags is pretty simple.

The web development industry as a whole has set rather concise, easy to follow standards for the use of Header 1 and Header 2 tags:

#1: Only use one Header 1 tag per page. Some people like to argue about this, and there are specific circumstances where it might be appropriate to use more than one Header 1 tag on a page. But if you’re reading this and in the position where you need guidance in the proper use of H1 tags, take the easy route: one H1 tag per page. Thankfully, WordPress—which we use for almost all client sites—makes this pretty easy. Most themes simply take whatever the title is for the post or page and automatically set it as the H1 text. Boom. Done.

#2: Use Header 2s sparingly. Don’t litter your content with H2s. The more H2s your page has, the less useful they are. I try to make sure that each H2 I use serves as a subheading for at least a couple hundred words of text. If a page is 800 to 1,000 words long, four Header 2s is the maximum, and I would almost certainly use fewer.

This blog post, which is nearly 2,000 words long, uses a grand total of four H2s.

#3: Make sure that your H1s and H2s are descriptive. To see whether or not your H1s and H2s are useful or not, try writing them down on a piece of a paper in a brief list. For example, my list for this blog post would be as follows:

• H1: Explaining H1 and H2 Header Tags and How They Affect SEO
  • H2: Header 1 text is usually the largest text on the page, and serves as the title for that page’s content.
  • H2: Relevant Header 2 text guides visitors to a specific section of web content.
  • H2: Do H1 and H2 tags affect SEO and search engine rankings?
  • H2: Proper use of H1 and H2 tags is pretty simple.

Now, in looking at that list, is it clear what the page and each of its sections is about?

Yes. I know from the H1 that the post will explain what header tags are and how they impact SEO. Looking at the H2s, I know that the content of the post will explain what H1s are, what H2s are, whether or not H1s and H2s have an effect on SEO, and how to properly implement H1 and H2 tags. It’s pretty clear what’s going on here.

Now, let’s say that in the first draft of this blog post, I gut-checked my H1s and H2s by listing them out, and I came up with the following list:

• H1: Explaining H1 and H2 Header Tags and How They Affect SEO
  • H2: Header 1 text is usually the largest text on the page, and serves as the title for that page’s content.
  • H2: Relevant Header 2 text guides visitors to a specific section of web content.
  • H2: Do H1 and H2 tags affect SEO and search engine rankings?
  • H2: The next step is…

It should be immediately obvious that the very last H2 is useless. It doesn’t tell me anything about the content of that section. I can probably guess from the context that there’s some sort of progression, that we’re taking what we’ve learned in the previous sections and doing… something… with it. But maybe I’m wrong. Maybe the next step is to invest in Amway. Who’s to say?

On a technical level, that H2 is weak because it doesn’t contain any keywords. It doesn’t mention “Header 1,” “Header 2,” “SEO,” or anything peripherally related to the subject matter. It provides no guidance. A good H2 will not leave you in the dark. It should not be vague. It’s not clickbait.

Hopefully, this rather in-depth exploration of a rather boring subject has helped to dispel some of the confusion you might have about header tags and their role in SEO and web browsing behavior.

Please note that this isn’t intended to be the final say on the matter. As I noted above, the importance of header tags is a contentious subject, and as time goes on, the role they play in SEO will likely change. But at Nowspeed this is the approach we take, both for our clients’ websites and our own website, and it works for us. Odds are, it’ll work for you as well.