Kristina Henry — October 29, 2019 TL;DR
Our conclusion is that while it’s fine to stick with one H1 per page, multiple H1s can be used as long as they are not being overused to the point of spamming, and the H1s fit contextually within the structure of the page.
Update: Google created a video on October 3, 2019 – Multiple H1 headings: how to handle them for SEO & accessibility
Update: Confirmed by Google on December 21, 2017 – My site’s template has multiple H1 tags
The Multiple H1 Tag Debate
H1 tags are synonymous to SEO. HTML5 “officially rolled out” in October 2014. This sparked renewed interest in an old SEO debate amongst web designers and online marketing pros. Is using multiple H1 tags on a single page bad for SEO? Depending on the school of thought you subscribe to, some web designers debated the true use case in the document outlining. As did some SEOs. We know H1 tags have value, but lately that value has dwindled to “light” as a ranking signal. Some SEOs try to insert several H1 tags on a page (usually with target keywords) believing they are impacting an outlining algorithm. I’ve seen H1 elements in breadcrumb trails, hidden behind wordless graphics, and pushed to the margin with CSS.
But other SEOs who worry about being spammy, go with a single h1 tag rule of thumb. When a client asked about this topic, we re-assessed our multiple H1 best practices. We had to establish where we stood on this matter. We wrote this blog post with the input of fellow SEOs, and web designers via social media.
HTML5 Document Outlining Overview
For all you non-techies, since 1997, HTML4 was the go-to way for web developers to outline, code and build sites. In fact, many of the sites that exist today are built in HTML4. Whether you’ve made the switch to the HTML5 specification or are using HTML4, using multiple H1 tags is OK. Be sure there is a logical reason for them and that you aren’t abusing them at the cost of user experience. This old-but-relevant video from Matt Cutts concurs.H1
Tag Usage for Beginners
We (SEOs, writers, and web designers/developers alike) always say that tag usages are similar to how an article’s title is structured. Because of this, it makes sense that Google would use them as signals or contextual clues towards your subject matter. They help search engines better understand what the content of the page, article, or piece is about.
Technical SEOs then put their spin on this fact. The old-school way of “optimizing” HTML header tags and H1 tags for better search rankings was to do keyword research and then stuff those keywords many times on one piece of content. Google was aware of this tactic. What followed was the tactical portion of the SEO industry performing experiments on the value of H1 tags, most of which was convoluted and had inconclusive results.
For as long as I can remember, there have been contradicting articles proclaiming the H1 has no power, to only the first H1 matters, to all H1s have a huge impact. The eventual general conclusion was akin to, “Google is on to us – only use one H1 tag and make sure it’s keyword rich.” I would argue that that is where half the SEO industry is today.
But does that make sense from a content marketing and digital marketing perspective? Aren’t there situations where a page might aggregate several topics (despite some technical SEOs’ recommendations), where a few H1 tags are apt? Thanks to HTML5 document standards finally being agreed upon, using multiple H1 tags on a single URL is now accepted as semantically correct – as long as they are used the right way and not as a spammy trick. Simply put, there are new H1 usage rules.
The following is how H1 tags can be used within your document structure:
- An H1 should always be in the first section of the page’s content (usually the logo or the level heading area).
- H1 tags can be used for dividing content sections (traditionally where most considered an H2).
- H2 tags are used as HTML head elements to detail an outline to support the H1 section label, with H3 etc. following.
From our perspective, as Google grows its comprehension past simple keywords, encouraging us to always write for humans, we’re going to recommend using H1 tags as needed for users. Then, work in keywords when it makes sense. We are no longer of the “one H1 tag only” mentality and see no reason against recommending the HTML5 usage rules. It feels like an appropriate match to Google’s desires post-Hummingbird.
Optimizing H1 Tags for SEO
You should always try to include a keyword when it is relevant to the preceding copy in your H1 tag so that your users and the search engines understand the main idea of your web page. Below are a few helpful tips that our SEO team follows so that our headings are optimized for on-page SEO. We are interested in getting any SEO value left from these tags.
- The keyword you choose for your H1 tag should be somewhat different than the keyword you’re striving for in the title tag and URL.
- Write your web page content so that your H1 articulates a compelling, user-friendly message that makes sense and is easily recognizable, in contrast to a keyword-stuffed heading.
- The words in each H1 tag should be unique and targeted to the web page they’re on. Having a unique H1 tag would be helpful in regards to Google recognizing unique relevance between different pages. The H1 tags are one of the most significant SEO elements on the page beside the title tag.
Example of HTML4 Document
<div> <—This is the start of the article<—This is the start of the article <h1>Learning SEO</h1> <—This H1 is the heading tag of the article; typically the primary subject matter <h2>About SEO</h2> <—This H2 tag is the start of a specific part of the article <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> <h2>Why learn SEO</h2> <—This H2 tag is the start of another specific part of the article <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> </div> <—This is the end of the article
Example of HTML5 Document
Now, this is the same article created using HTML5 document standards:
<div> <header> <h1>Learning SEO</h1> <—This H1 tag is the heading tag of the entire article and also represents the first content section. </header> <—Note how the heading is separated from the rest of the article <article> <—Note the “article” div, a new addition for sectioning content. <h1> About SEO</h1> <—This H1 tag is the start of a specific part of the article. (Note these are now H1, not H2 tags like in HTML4). <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> </article> <article> <—Note how each content section is held within its own article div. <h1> Why learn SEO</h1> <—This H1 tag is the start of another specific part of the article. (Again, note these are now H1, not H2 heading tags like in HTML4). <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> <p>paragraph<p> </article> </div> <—This is the end of the article.
So what do these two HTML tag examples show? In a simplified nutshell, the reason why it’s OK to use multiple header tags in an HTML5 document is that of elements such as the <article> and <header> tags. These HTML tags tell search engines that they should treat those sections as separate articles.
Since Google is favoring sites with longer-form, more holistic pieces of content (as evidenced by Hummingbird), as well as increasing its semantic understanding ability, having multiple H1s on a single page may continue to become more common. It could actually be beneficial in helping both users and search spiders better digest the content section on each webpage. It’s a safe assumption to think Google will get on board with HTML5 regarding H1 tags – if they haven’t already.
Digital & Social Articles on Business 2 Community
(86)
