The H1 on the Homepage is an image ("H1 tags includes non-text content, such as a link or image")

Technical Q&A

Topic summary

A Shopify store owner discovered their homepage H1 tag contains an image (the site logo) instead of text, flagged as a critical SEO issue by an audit tool.

The Problem:

  • The logo is wrapped in an <h1> tag with class “text-hide”, making it an image-based H1
  • This can confuse search engines and negatively impact SEO performance

Proposed Solutions:

One responder suggested the issue isn’t critical and recommended changing the header’s H1 to a div tag, then using H1 in the first content section instead. However, another participant dismissed this as “bad advice.”

A more detailed solution was provided:

  • Change the logo’s <h1> tag to <h2>
  • Add hidden text-based H1 tags to the theme.liquid file using conditional Liquid code
  • Code snippets were shared for different page types (homepage, product, collection, FAQ, article pages)
  • These H1s would use style="display:none" to remain invisible while providing proper semantic structure

Status: The discussion remains open with conflicting advice and no confirmed resolution from the original poster.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.
1

Hello,

I have a problem concerning the H1 on my Homepage.

After running a SEO app, it tells me this :

“Critical issues found.” : "One or more of your H1 tags includes non-text content, such as a link or image."

My homepage is here : https://mana-words.com/

I did set the Preferences on my store, I put text in the Title and the meta description.
But it doesn’t seem to work.

Instead, the H1 on my homepage is an image (my logo). Here is the code on my homepage :

div class="header__logo align-items-center d-none d-lg-flex mr-lg-25" style="width: 114px;"><h1 class="logo h6 w-100 m-0 text-hide"><a href="/" itemprop="url" class="d-block text-hide">
  
  <div class="rimage" style="padding-top:100.0%;"><img class="rimage__img lazyload"
  data-master="//cdn.shopify.com/s/files/1/0522/8593/1716/files/logo-new_{width}x.png?v=1615543062"
  data-aspect-ratio="1.0"
  
  
  data-srcset="//cdn.shopify.com/s/files/1/0522/8593/1716/files/logo-new_228x.png?v=1615543062 1x, //cdn.shopify.com/s/files/1/0522/8593/1716/files/logo-new_228x@2x.png?v=1615543062 2x"
  
  data-scale="2"
  
  
  itemprop="logo"
  alt="Mana Words">
</div>

So my H1 is my logo… :disappointed_face:

How do I change that ?

If anyone can help, that whould be really awesome ! Thank you !

Amelia

2

Hi there.

You need not worry about this issue as it is not critical. If you would still like to follow the apps response, then might I suggest changing the h1 tag in the header to div and using an h1 tag in first section instead. Though this isn’t necessary.

I do hope this helps you.

If you found this answer helped with your question, kindly mark it as a solution.

Kind regards.
Cole.

Blend Commerce.

BlendCole_1-1633545206304.png

1 Like
3

Hi Cole,

Thanks for your reply.

I will take your advice ! But I’m not sure I know how. Would you mind telling me how I can change the h1 tag in the header to div ?

Do we have access to that ?

Thanks again,

Amelia

4

This is completely wrong. Ignore Coles bad advice.

5

Hi Amelia

Regarding your shared H1 situation on the homepage, it is not a good idea to set an image as H1 because it will confuse search engines and hurt your website’s performance in search results.

So far, you can change this code

<h1 class="logo h6 w-100 m-0 text-hide">

into

<h2 class="logo h6 w-100 m-0 text-hide">

Then follow my lead below to resolve this issue continually, as our APP Team agents have collected some useful H1 codes used to resolve H1 related issues after double checking with developers, I can share you below so that you can use them accordingly by adding them between and in the empty part of the theme.liquid file.



Misssing H1 on the homepage

{% if template.name ==‘index’ %}



{{shop.name}}





{% endif %}


Missing H1 on the product page

{% if template.name ==‘product’ %}



{{product.title}}





{% endif %}


Missing H1 on the collection page

{% if template.name ==‘collection’ %}



{{collection.title}}





{% endif %}


Misssing H1 on the blog page

{% if template.name ==‘blog’ %}



{{blog.title}}





{% endif %}


Missing H1 on the page

{% if template.name ==‘page’ %}



{{page.title}}





{% endif %}


Missing H1 on the FAQ page

{% if template.name ==‘page.faq’ %}



{{page.faq.title}}





{% endif %}


Missing H1 on the Article page

 {% if template.name ==‘article’ %}

{{article.title}}





{% endif %}

You can also choose to contact our APP Support Team for further assistance if you still have any questions. Please click here to install SEOAnt and you can get in touch with us there directly. Moreover, the 30% discount SEOAnt 30% Jeffery for the first two months are available now also, you can have a try if this APP meets your demand, thanks!

SEOAntJeffery_0-1743177196876.png
SEOAntJeffery_0-1743177196876.png3269×1772 677 KB