Whitespider Web design | Multiple H1 Tags, Wordpress, SEO & HTML5 | Whitespider Web Design
ws-alt-logo
ws-logo-retina
For People,
By People
  • multiple-title-tags-on-web-page
18th July 2019
|
by Damian Reilly

Multiple H1 Tags, WordPress, SEO and the Whole Shebang

There is some debate about whether having more than one H1 tag on a webpage is bad thing or not, from an SEO perspective. Sure, we can say that having no H1 tags on your page is most definitely not a good thing, but what if there’s more than one H1 tag? Is this an SEO problem that’s costing you valuable brownie points with Google?

H1 and Design – Getting that Red Rerring Out of the Way

Many commentators tackle this topic of multiple H1 tags from the point of view of web design. In this argument, they reason, that it is poor UX. A page should be visibly hierarchical in structure, with nice large fonts for your H1 tag, clearly stating the title of the page to the user. These should then be followed by a series of H2 tags (potentially with nested H3, H4, tags etc.) marking out different sub-sections of the page and making it markedly more readable and navigable.

However, design is not the issue here. Rather, SEO is the context we are looking at. For design, it would seem that multiple H1 tags merely break the page into many sections, within which the H2 tags can add further hierarchical structure. If that’s not an aesthetic you like, applying a different font-size value to all but the first H1 tag will give the illusion of a single H1 at the top of the page. However, this isn’t what search engines will see – they will still see many H1 tags and, the argument goes, struggle to create a clean hierarchical map of the page.

Multiple H1 Tags and SEO

Like so many things with SEO, there is not a definitive answer as to whether having more than one H1 tag on a single web page really is a problem. Generally, the argument goes that search engines – and by Search Engines, we mean primarily Google – don’t like multiple H1 tags on a single web page, not because it isn’t good web design, but because it prevents a clear crawlable structure of the page. This then, in turn, hurts your SEO.

So, by having multiple H1s you are not giving Search Engines a clear SEO signal of what text is most important on your page. Most SEO experts, at this point in time, see a single H1 tag per page as best practice. Indeed SEO auditing tools, such as SEMrush, still flag multiple H1s as a problem to be addressed, so the experts are certainly very much against having more than a single H1 on your web page.

What About Semantic HTML5 and H1 Tags?

There is one school of thought that says that the argument for having a single H1 tag is a legacy of pre-HTML5 markup. Since HTML5 has come into common usage we have a whole new set of semantically named markup tags, which the likes of Google can interrogate to learn more about the structure of a web page and the content therein.

One such tag is the <article> tag. This neatly demarcates a section of content as a self-contained article in its own right. So, on a single web page we could have a structure with multiple H1s, all housed within their own parent <article> tag

Where would you see a series of articles all one web page though? Well, of the very many examples we could invoke here, two obvious ones come to mind:

  1. One page websites, where differentiated content is all on a single scrollable page, with each section under its own H1 header
  2. Index pages, such as a blog list page, where a synopsis of each blog article is rendered all on one single page (perhaps with pagination to show more articles) and each summary is entitled with its own H1 tag

So, perhaps in the HTML5 age of web design, having many H1 tags is not such a bad thing, if done correctly.

WordPress Themes and Multiple H1 Tags

Even if we agree that, when done correctly, having multiple H1 tags on your web page is’nt necessarily a bad thing, and could quite possibly be a good thing, how can we be sure our website is structured correctly to allow this. One common complaint on this subject is often levelled at WordPress, namely that most WordPress themes carry more than one H1 tag on individual pages, without nesting each tag inside the HTML5 <article> tag.

This criticism, however, should not be thrown at WordPress exclusively, or perhaps even at all. This is because the view (that part of the web development code that is responsible for rendering the web page on the front end) is put together by the theme developer and not by WordPress.

Unfortunately, some web developers aren’t always up-to-date or au fait enough with current SEO to know about this pitfall. Consequently, they will generate markup in their views that can fall foul of SEO best practices, the H1 tag being one such example.

If your website is generating multiple H1 tags on a single page and is not nesting each tag inside the <article> tag, then it needs to be corrected, and the sooner the better. To do this you will need to fix the view by either creating a child theme and making the change safely there, or by editing it directly in the core theme file, which we don’t recommend at all.

In truth, the best thing to do would be to notify the theme designer and wait for an update with the fix to be released, or if you had a custom theme built get a quote from your web developer about having this small, but very important, change made to your theme files.

Leave a Comment

There are no products