Distinguishing Between the H1 and the Heading of a Page
Updated: We all occasionally make mistakes, and correcting them is important. Jenny Halasz is not a web developer, and made a couple of factual errors regarding the use of H1s in code in the original version of this post. Please see below for an updated version.
H1 is a specific piece of HTML code that is usually wrapped around text. It was originally meant to display that text as the largest text on the page.
When Cascading Style Sheets (CSS) were developed, one of the things CSS allowed web developers to do was to take the standard H1 format and adjust it (color, typeface, font size) to match the rest of the page design. This meant that sometimes the H1 was no longer the largest text on the page.
When Google initially wrote their algorithm, CSS hadn’t even been mainstreamed yet. In fact, it was only registered with the World Wide Web Consortium (W3C) in March of 1998, shortly before Google was founded (September 1998), so it certainly was not in widespread use yet.
The bottom line is that H1s were (and still are, mostly) a good indicator of what the most important text on a page was.
The heading of a page is the same thing, just without the official H1 code wrapped around it.
Aboutness & Relevance
What’s ultimately the most important are the many signals (of which H1 is one) that make up a page and indicate what the topic of the page is (a.k.a., “aboutness”).
How relevant the page is to the searcher’s query ultimately determines whether it is listed in the results set, or search engine results page (SERP).
What’s key here is not if the page has an H1 tag, but the text that’s actually in that H1 tag.
Gaming the System
This is why the H1 takes secondary importance to the heading itself. While it’s great if the heading is wrapped in H1 code, it isn’t entirely necessary.
It’s been studied many times, and the studies come back with a similar conclusion:
If you already have good headings, wrapping them in H1 has some effect, but it’s small enough that “if it takes longer than an hour to implement H1 Tags on all pages and they already have some large descriptive text on the page then it is probably not worth the time required.”
If you know of more recent published studies on the effectiveness of H1s, contact me!
This is also why “gamed” headings – like small text at the top or bottom of a page wrapped in H1 and CSS to make it small – don’t work.
It’s why Google ignores the H1 entirely when it’s wrapped around an image (which is a non-standard use; an H1 is a text modifier).
It’s why some tests show that Google ignores the H1 entirely when it’s wrapped around an image like a logo. This is likely because the ALT text on the logo is either not equivalent to the logo itself, or it is the same on every page.
Matt Cutts, formerly of Google, wrote about this in 2005. As far as I can tell, this is still true. It makes sense that it would be.
And finally, it’s why Google can tell that if your heading is prominent on the page but not wrapped in the H1 tag, it’s still for all intents and purposes an H1.
Other Uses of the H1 tag
Another important element the H1 serves is usability. It’s specifically usable for persons with visual impairments and people who use screen readers.
Almost every major screen reader has the capability to skip to the H1 tag on the page to tell that visitor what the page is about. If it’s missing, your site is definitely not as usable and accessible as it could be.
As Google places a higher importance than ever on usability, particularly mobile usability, this becomes more important.
H1 Tags & SEO
As you can see, the H1 tag is pretty important for SEO, usability, and accessibility.
Ideally, you should have one clearly marked on each page of your site.
Also be careful to ensure that the H1 reinforces the point of the page, and that there is only one H1.
While officially it’s OK to have more than one H1 on a page, and Google says use as many as you want, it only makes sense that Google would either:
- Place the majority of the weight on the first H1 they encounter (Bing is on record as doing this).
- Distribute the weight evenly across all H1s, thereby diluting the value of all of them.
Either way, it makes sense to only use one for SEO.
If your site already has clear headings that are not coded as H1s? It’s unlikely that adding the H1 tag will make a significant difference to your overall SEO strategy.
But good SEO is all about checking boxes, so why not check this one now that you know it goes beyond just SEO?