We are beyond excited to announce that Remix is joining Shopify! 🎉 Thank you all for joining us on this journey. It's only getting better from here! Learn more 👇 remix.run/blog/remixing-…
1st February 2023 • 9 min read
10 Shopify SEO best practices with Sanity and Remix
Omar Benseddik
Ecommerce competition keeps increasing - for each product you now have dozens of alternatives.
As a result, CAC (Customer Acquisition Cost) increases, pushing ecommerce business owners to look for more affordable lead generation strategies.
SEO is one of them. Online store owners aim to optimize their ecommerce for search engines, to attract more web visitors and increase sales.
In this article, we will go through the top 10 elements that make Shopify stores we build favoured by search engines
Before we get into what makes our Shopify stores optimized for search engines, it's worth noting that we build Shopify stores with a headless architecture instead of relying on themes.
This means that we decouple the frontend (what users interact with) from the backend (where staff handles inventory, returns, customer data, and other admin-related items).
A headless architecture helps us enable SEO best practices without having to rely on paid Shopify apps and get to automate most of the work.
Aside from SEO benefits, this architecture comes with different benefits, like setting up Sanity as the headless CMS to manage content, picking the best 3rd party tools for each functionality (analytics, A/B testing, translations, etc.), and designing the ecommerce without any constraints.
Here's a simple diagram of the architecture:
Title and meta description
Content editors have the ability to manage titles and meta descriptions directly from Sanity. These fields come with word counters, to help you stick with Google's best practices.
Depending on your use case, we can also pre-fill these fields so you can immediately publish products and pages without having to worry about writing them manually.
You also don't have to rely on a Shopify app like Metafields, which costs $20 per month.
Alt text
You can add and edit alt text on images directly from the module or from the media library.
Alt text helps your images rank on Google Images and makes your Shopify store more accessible.
Canonical URL
If your product has different landing pages and you want to avoid content duplication issues when getting indexed, you can directly set a canonical URL directly from Sanity.
You can also reference a URL, instead of typing it manually, that way you're sure you'll be always pointing to the correct URL, even if that one changes.
You decide if to keep a page private for your content editors only, published on the Internet but not indexed, or published online and available for indexation.
Control indexation for products
Google clearly states in its infinite scrolling optimization page:
"Your site's news feed or pinboard might use infinite scroll—much to your users' delight!
When it comes to delighting Googlebot, however, that can be another story.
With infinite scroll, crawlers cannot always emulate manual user behavior—like scrolling or clicking a button to load more items—so they don't always access all individual items in the feed or gallery.
If crawlers can't access your content, it's unlikely to surface in search results."
To avoid having orphan pages and ensuring all your product pages are accessible to the search engine, we implement pagination in our Shopify projects and follow Google's recommendations.
We make sure that each paginated result has a unique URL, give each page its own canonical URL, and block unwanted URLs (with filters or other sort orders) from being indexed.
Sitemaps are key if you want to help Google crawlers understand the structure of your site.
This is especially relevant for new ecommerces or online stores that have more than 500 pages, which is the case for most ecommerces we support.
We automatically generate sitemaps, so you don't have to manually submit it to Google Search Console.
Another benefit of using a headless commerce architecture with Remix as the frontend framework, is that thanks to SSR (Server-Side Rendering), your sitemap will always be up to date.
When necessary, we can also implement an image sitemap.
Automatic sitemap submission on Google Search Console
Schema markup (structured data) helps search engines better understand your products and pages.
Instead of relying on a Shopify app like Schema Plus for SEO, which costs $15 per month, we implement it on the frontend and automatically any product created has Product, Review, and FAQ markups.
To validate the schema markup, we use Google's Schema Markup Testing Tool and monitor progress on Google Search Console.
Schema markup progression on Google Search Console
This will help create Rich Snippets and make your URLs more attractive on SERPs (Search Engine Result Pages).
Here's an example from Tinloof's Sanity page, where two FAQs appear right under the result:
Tinloof FAQ Schema Markup
We can also enable you to manually control some JSON-LD elements.
For example, at Tinloof we manually add "sameAs" URLs on our Service pages, and automatically setup "logo" on all pages.
If you want your products to be found in the Google Shopping tab, we can automatically upload your Shopify products to Google Merchant Center.
This will help Google know all your products, and gain greater control over the timing of updates.
We leverage the Content API to enable such seamless integration.
Google Shopping
By default we enable optimized URL structure by following Google's best practices, and also give you the ability to override them directly from Sanity.
We create one URL per product or variant, stick to lowercase, and add descriptive words.
Optimized URL structure on Tinloof Store
Considering page speed is a Google ranking factor, we create Shopify stores with performance in mind.
We focus on website speed optimisation to reach peak performance that delights both visitors and search engines.
We go in detail about how we build fast Shopify stores in this article.
Thanks to the headless architecture, you don't have to rely on a Shopify app like SEO, Speed & Image Optimizer, which cost $20 per month. You are also more likely to reach top page speeds when you are in control of the frontend.
If you haven't heard of Remix, it is a React framework that allows to reach top page speeds. It got acquired by Shopify.
To avoid losing organic traffic when a URL changes, you can directly create redirects from Sanity.
You can also decide on the status (e.g. permanent, temporary).
Control redirects from Sanity
The items we've listed above are mainly technical SEO elements, however, it is worth mentioning that by integrating Sanity as the headless CMS for the Shopify store, content creators are able to easily add and edit content of the website, and create narratives around the products they sell.
Content creators can seamlessly create landing pages and blog posts, to increase traffic sent to product pages.
Here's an example of a blog post on Tinloof Store:
If you haven't heard of Sanity, it is the #1 ranked headless CMS according to G2.
It enables top tier content editing management and excellent developer experience. Shopify invested in it.
We’re thrilled to announce that @Shopify has invested in @sanity_io, creating a strategic partnership that connects content with commerce. Read more about how the Sanity Connect app and this partnership will help merchants deepen customer relationships. sanity.io/blog/shopify-i…
To keep track of SEO health, we mainly use two tools.
First, Ahrefs to clear errors and keep track of pages' growth.
We aim to achieve Health Scores of 100:
100/100 Ahrefs SEO score
If you're keen to use Ahrefs, there's a free version called Webmaster Tools.
Second, we use Google Search Console to monitor page experience, core web vitals, and other parameters.
