How to fix technical SEO errors on Shopify to rank #1?

SEO implementation is a long-term process. I mean it!

Even though you have great content and a well-designed ecommerce website, you still might lose a huge amount of traffic due to lack of technical optimization. I know that Shopify is a pretty-technical friendly platform and that makes Shopify store owners optimistic about their website’s technical aspect. Unfortunately, you can control any errors that might happen during your set up. It can be a 404 error where your server can’t find the requested website or any HTML low text ratio errors.

If you are facing one of those technical errors, you came to the right place. In this article, we will list out top issues to look out for when you have any trouble with your website technically!

Before jumping into each hint in detail, we suggest you to master Semrush beforehand. Semrush is used for audit your site, research keywords and analyze any backlink opportunities. After auditing your website, you are given a full report of on-page and technical website audit, where you find a summary of your website errors.

Based on our experiences, we summarize top issues that you might face during setting up and maintain your website.

Technical SEO hint #1: Check if your store is mobile-friendly

A mobile-friendly website is one that works exactly the same across different devices, from desktop to mobile to tablet. Some features like drop-down navigation are avoided in mobile because it’s hard to use on mobile devices. 

Take the mobile friendliness test from Google. They will tell you shortly if your site is mobile friendly yet. If it says your store is not mobile friendly, it can jump into below reasons:

  1. You are using mobile-unfriendly theme 
  2. Your content is wider than your theme
  3. Robot.txt blocked the resources

How to fix your mobile-unfriendliness?

  1. Switch to a mobile-friendly theme
  2. Follow this code in between <head> and </head>: <meta content=’width=device-width, initial-scale=1, minimum-scale=1′ name=’viewport’/>
  3. Make changes to your robot.txt of your file. If you are using WordPress, apply this code to your file: 

User-agent: *

Disallow: /wp-admin/

Allow: /wp-admin/admin-ajax.php

Allow: /

Sitemap: https://example.com/sitemap_index.xml

Technical SEO hint #2: Site loading speed

Your second to notice issue is your website’s loading speed. You probably know the fact that 40% of visitors are going to abandon the site if it takes more than 3 seconds to load it, leading to a huge percentage of bounce rate. Experts recommended a maximum of 3 seconds to load a website, and around 2 seconds to load an e-commerce site. 

We recommend you to choose either Google’s Page Speed Insight or GTMetrix. To audit our client site, we often use Google’s Page Speed Insight because it’s super easy to use. Your site speed can be reported both from mobile and desktop browsers. 

How to fix your slow loading speed?

  1. Optimize images: Make sure that your images are no heavier than they need to be. They also need to be in the right format and well-compressed.
  2. Minify CSS, Javascript and HTML: Optimizing your code (including removing spaces, commas, and other unnecessary characters), it can help to increase your page speed. Also remove code comments, formatting, and unused code.
  3. Reduce redirect: Each time a page redirects to another page, your visitor faces additional time waiting for the HTTP request-response cycle to complete. 

Technical SEO hint #3: Blocked from crawlings

If a page cannot be accessed by search engines, it will never appear in search results. A page can be blocked from crawling either by a robots.txt file or a noindex meta tag.

Use Semrush’s Site Audit and it indicates how many pages are blocked from crawling. 

How to fix your site that is being blocked from crawlings?

You can choose and test one of those solutions below. 

  1. Delete duplicate pages
  2. Set necessary parameters in robots. txt.
  3. Or set necessary parameters in meta tags.
  4. Or set a 301 redirect.
  5. Use rel=canonical.

Technical SEO hint #4: SSL error

An SSL certificate error occurs when a web browser can’t verify the SSL certificate installed on a site. Below image is a SSL error website.

To check if your site has SSL error, use Semrush’s Site Audit and it indicates how many pages are blocked from crawlings. In this case, the browser will display that your site has an error and is insecure. Below are some few reasons that lead to your SSL errors:

  1. Having a browser problem
  2. An antivirus or firewall might block access to a website
  3. The date and time of the computer trying to access the website is incorrect
  4. Having an untrusted SSL certificate
  5. The website might contain insecure information
  6. The SSL certificate might have wrong information

How to fix SSL error? 

  1. Reset time and date
  2. Tweak your browser

Fortunately, Shopify does offer a free SSL certificate when you already your online store. If the SSL Unavailable error in the Shopify admin center it means SSL isn’t available for use on your site. This doesn’t mean you can’t use the free Shopify encryption. It means some part of your domain’s configuration or your site’s content isn’t secure so Shopify can’t issue you an SSL certificate.

Technical SEO hint #5: Low-text HTML ratio

Low-text HTML ratio is basically the inequivalence between the amount of HTML and your amount of content on the website. In other words, your text to HTML ratio indicates the amount of actual text you have on your webpage compared to the amount of code. This issue is triggered when your text to HTML is 10% or less.

Search engines have begun focusing on pages that contain more content. That’s why a higher text to HTML ratio means your page has a better chance of getting a good position in search results. Less code increases your page’s load speed and also helps your rankings. It also helps search engine robots crawl your website faster.

How to fix low-text HTML ratio?

The easiest solution is to add more content to your site. Otherwise, think about moving any inline JavaScript and CSS to external, minified files. This will usually have the most dramatic effect on your ratio, with the least effort. Or remove comments, unneeded code, and extraneous white space.

Technical SEO hint #6: Hreflang issues

The Hreflang tag is to tell Google the language that you are using on a specific page. 

Hreflang tags helps search engines understand which page should be shown to visitors based on their location. It is very important to properly synchronize your hreflang attributes within your page’s source code, otherwise you may experience unexpected search engine behavior. Therefore, visitors might leave your site if they don’t find their native language in the site they are navigating. 

How to fix Hreflang issues? 

  1. Conflicting hreflang URLs:  remove all conflicting hreflang URLs and make sure that you only have one URL specified for a particular language and country.
  2. No self-referencing hreflang URLs:  It means that a particular page that has been translated into other languages is also included in the set of those hreflang attributes. 

Step 1: Visit Shopify dashboard. Then to Online Store. Then to Edit Code

Step 2: Add these codes to the corresponding sites in the theme.liquid:

a. For default language:

Step 1: Find: <link rel=”alternate” hreflang=”{{ original_language }}” href=”{{ canonical_url }}”>

Step 2: Replace with: {% for language in original_language %} <link rel=”alternate” hreflang=”{{ language | replace:”en”,”en-gb” }}” href=”{{ canonical_url }}”> {% endfor %}

b. For other languages

Step 1: Find: {% for language in destination_languages %} <link rel=”alternate” hreflang=”{{ language | replace:”zh”,”zh-CN” | replace:”tw”,”zh-TW” }}” href=”https://{{ request.host }}/a/l/{{ language }}{{ canonical_path }}”> {% endfor %}

Step 2: And add your additional language replacement rules to it in this section: hreflang=”{{ language | replace:”zh”,”zh-CN” | replace:”tw”,”zh-TW” }}”

Technical SEO hint #7: 404 issues

A 4xx error means that we can’t access to a webpage.This is usually the result of broken links. These errors prevent users and search engine robots from accessing your webpages, and can negatively affect both user experience and search engine crawlability.

Why you have such issues? Either one typical trigger for an error 404 message is when the page is deleted from the website; or the page got to move to another URL and the redirection was done incorrectly.

How to fix the 404 issue? 

 The easiest solution is to redirect the URL.

Step 1: Visit Shopify dashboard. Visit Online Store then the section of Navigation

Step 2: Click on View your URL redirects

Step 3: Here you can see multiple redirecting URLs. Solution is that when you redirect, you just direct  them to your similar pages or your homepage/catalog pages.

Technical SEO hint #8: No viewport tags

The viewport meta tag is an HTML tag that allows you to control a page’s viewport size and scale on mobile devices. This tag is necessary if you want to make your website accessible and optimized for mobile devices.

Here is an example of a website without a view port tag:

How to fix no viewport tag? 

Set the viewport meta tag for each page, and then test your website on a mobile device to make sure everything works fine.

The 8 technical errors listed above are quite common in every Shopify store. Please do remember to check it often to ensure your Shopify store runs smoothly and offer your visitors the best user experience. 

Meanwhile, read more about Shopify SEO issues that might happen to your store. Those issues are not that common but still need to be concerned:

Robot.txt issue

Keyword Cannibalization Issue

Other on-page SEO

We’re offering a free SEO project so that you can experience our expertise and professionalism in working and communicating. We want to enhance your confidence and reliability before you decide to walk through a long Shopify SEO journey with us. There are limited slots so you might want to sign-up early. Feel free to learn more about the free SEO project here.