What is ideal heading tag structure for eCommerce websites?
I often receive questions regarding what should and what shouldn’t be an H tag on a given Magento URL. The confusion mostly comes from different points of view that front-end developers and SEOs might have on the issue.
From the front-end development point of view, different sections of the same URL could have their own H1 tag and that would be completely fine. From the same point of view, sitewide heading tags are also fine, such as using an H2 tag for headings of the sidebar sections for example or even footer sections.
In the image above you see a classic example of a sitewide H3 tag I’m talking about here.
H1-6 from SEO point of view
While having sitewide H1-6 tags or multiple H1 tags on a same URL is not a critical SEO issue, there is an optimal structure from the SEO point of view and that structure does not include sitewide H tags or multiple H1 tags per URL.
The reason is simple. Having more than one H1 tag per URL will split the ranking strength of your most important H1 tag and make it share it with another. In most cases if you need multiple H1 tags in content, it’s very likely you’d do better by splitting that content on two different URLs that each focuses on just the content of one of those headings.
The same thing happens with sitewide headings. If your sitewide site search box has an H2 tag “Search:”, each other H2 tag on your entire website (since it’s sitewide) shares its ranking strength with that word “Search:”. In some occasions, sitewide headings can even cause search engines to think that your website is all about something that it’s really not.
Optimal H1-6 structure for a Magento website
Now that I explained why this is the optimal structure from our (SEO) point of view, let me give you a sample structure for a typical Magento website. This is just a sample for a typical website, so specific needs need to be considered for specific cases. You can ask for an audit in which, among other things, we’ll recommend what’s best for your specific case in terms of heading structure.
Homepage:
H1: Logo
H2: Tagline or some non site wide homepage only element such as “The best blue widget store in Neverland, voted by Neverland’s Choice Magazine”; If there are featured products, you might want their titles in H2 as well.
H3: In most cases nothing.
H4: In most cases nothing.
H5: In most cases nothing.
H6: In most cases nothing.
Category page:
H1: Category title.
H2: Titles of products listed.
H3: In most cases nothing.
H4: In most cases nothing.
H5: In most cases nothing.
H6: In most cases nothing.
Product page:
H1: Product name.
H2: If there are multiple sections within product description (long description text) then headings of those sections could be H2.
H3: In most cases nothing.
H4: In most cases nothing.
H5: In most cases nothing.
H6: In most cases nothing.
CMS page:
H1: Title of the CMS page.
H2: If text has multiple headings, whose headings should be H2.
H3: In most cases nothing.
H4: In most cases nothing.
H5: In most cases nothing.
H6: In most cases nothing.
17 comments
Hi! Thanks for the article. Is it a good idea to use H2 for every product name?
What do you do about the wp issue showing no h1. I’m rebuilding on hempbudexperts.com & not getting an h1 to stay
What would best for our situation, here’s a couple of our pages.
https://blindsusainc.com/blindsusa-drape-traverse.htm
https://blindsusainc.com/blindsusa-clips.htm
I’m agree with you, the example of zappos is true. Except for H2 title for category : it’s depend the number of product and the name. If there are too many products with the same keyword that we want to rank in H2 title, Google can give a panda penalty.
I just incorporated this for http://www.anniescloset.co.uk for the products, hopefully will see SEO benefits, as the site is well formed but still struggling to get noticed for keywords.
This is really a nice article and informative too. I also want to share some knowledge regarding H tags which are not mentioned in this article. Use H1 to H6 tags in a sequence do not use H6 before H1. Number of times you can use these tags in single webpage –
H1 – One Time
H2 – two or three times
H3 – three to four time
H5 – four to five time
H6 – five to six time
These is the best way of using H tags.
where is h4 tag and how to use
[part 2] You can for example check the page: Bureaustoelen –> https://www.schaefer-shop.be/shop/bureaustoelen-directiestoelen/10,692,0,0,0,0,TN/
Hi,
I’m wondering if it makes a difference if you have your H1 hidden for desktop and only visible for phone. Only the H2 is visible for desktop. Does this have a negative influence on SEO? If you want, you can check for example the page
Ideal eCommerce SEO heading advice
Great tips, thanks Toni!
Just removed all tags from the product names in the category page. Just doesn’t feel right to have 40+ ‘s.
Greetings,
Very well written article. I need a suggestion that I have a Magento website ie. http://www.grapplebazaar.com and I want to know how would I use h1, h2, h3 Tags for SEO purpose.
Yes I agree to your H1 SEO point of view, if we are repeating the content, it means we are creating competition for ourselves in our website content.
Don’t forget that disabled sue over web shopping and companies have a legal obligation to make their websites as accessible as their stores.
For screen reader users, header tags are vital in giving a sense of the main topics of the page, and enabling easier navigation through your content and site.
Thanks for the great article. What is your oppinion on this? http://csswizardry.com/2010/10/your-logo-is-an-image-not-a-h1/
Hi Andrej,
That article has some valid points. I believe the optimal solution would be for it to be an image, with appropriate ALT tag. Although it doesn’t make much difference one way or the other from the SEO point of view.