Increase site speed
You don’t have to spend long reading about e-commerce before you’re guaranteed to come across a story about site speed and revenue loss. You know the structure: Brand X loses €Y,000(,000) for every Z seconds that their site decreases in speed.
And all these stories are true. Site speed is one of the fundamental factors in converting traffic into sales. Why? Because fast site speed is an essential part of a strong UX. Customers won’t hang around for your site to load. If it’s slow they’ll simply go elsewhere.
But before you tell us you’ve heard it all a hundred times before, just hear us out. Because it’s about to get even more serious.
In May 2021, Google will update their algorithm to include a brand new factor called Page Experience. In essence, Page Experience will be a way of ranking how easy it is for users to navigate sites.
Because Google want to provide answers to people’s search queries as fast as possible, right? And until now, the sites that display the corresponding information correctly do well in search results. They know, however, that a site might provide all the answers people need, but if it takes an hour to load and never runs properly it’s effectively useless. So with that in mind they’re introducing the new update. From May, sites will rank not only on their usefulness in reference to search, but also in how well they perform for the user.
And yes, that means site speed.
As part of the update Google have already launched Web Vitals - a checklist of benchmarks that your site will need to hit to score well on Page Experience. For now there’s 3 vitals to rank on, and 2 of them are about speed. That’s how seriously Google are taking it. The first is Largest Contentful Paint (LCP) and is all about loading times, and the other is First Input Delay (FID) which measures a site’s responsiveness.
So from May, not only will site speed directly affect your conversion rate, it’ll also be a contributing factor to your SEO and SERP rankings. Ignore it at your peril. If you’ve always had site speed on your radar, but never really given it much note or looked into how to make your site faster, now is the time to act. Handily, we’ve got a site speed checklist right here. Work your way these 3 key tips and your site will be breaking sprint world records in no time.
In May 2021, Google will update their algorithm to include a brand new factor called Page Experience.
In May 2021, Google will update their algorithm to include a brand new factor called Page Experience
The first place to begin when considering e-commerce site speed is the platform you use. Get yourself off to the best possible start by building a site on a platform that cares about speed and UX.
How do you know if a platform is serious about speed? Here’s 3 factors to look out for:
You need a platform that has the infrastructure to quicken load times for your customers. This is a continual job for any platform that requires frequent upgrades and new initiatives to keep speeds as fast as possible. Look out for platforms that frequently launch such upgrades - they’re a sign that the platform really cares about your customers’ experiences whilst shopping in your store.
Shopify’s Storefront Renderer (SFR) is dedicated to serving up storefronts as fast as possible, and subsequently reducing load times for your customer. Briefly, it changes the way read requests are served and consequently provides server-side performance gains that are up to 5x faster.
The upgrade was introduced last year and has already been proven to increase both conversion rate and overall revenue. All Shopify Plus stores are now powered by SFR because the Shopify platform is dedicated to increasingly faster site speeds.
Downtime costs money. And downtime is most likely during the moments when the most money is at stake. Flash sales, Black Friday, new collection launches - all of these events can bring surges in traffic far beyond what is normal. That’s great for business but catastrophic if your site crashes.
To avoid this, you need an e-commerce platform that provides fast and reliable hosting capable of handling even the tallest waves of customers. When looking into hosting capabilities look for the following:
1) Memory and/or bandwidth limits for scaling during peak times.
2) Projections for traffic peaks to avoid crashes from sudden spikes.
Shopify boasts a cloud-based hosting service that guarantees 99.8% uptime. At the peak of 2019’s Black Friday Cyber Monday (BFCM) $1.5 million in sales were processed every minute on Shopify stores around the world, proving the platform’s surge-resistant capacities.
CDNs are groups of servers distributed around the world. They deliver content to your site visitor through the server that’s closest to their location, resulting in much faster local user experiences.
With a broad distribution of CDNs, customers can get the same site speeds and service levels from your store all around the world. E-commerce by its very nature is a global enterprise and therefore a world-class CDN is an absolute must from your platform.
Shopify has CDNs located across Europe, North and South America, Southern African, Australasia, and South and East Asia, meaning store visitors in each of these regions will experience rapid site speeds.
It’s not the entire globe, but Shopify has a lot of it covered. If your customers are arriving from any of these regions, you want a store built on Shopify.
If you’ve already built a site on another platform but want to take advantage of Shopify’s superior site speeds, you’ll need to migrate. This can be tricky business, moving over all of your store’s innerworkings to a new platform without losing any customer data etc.
We have a lot of experience in this field, with a perfect record of success moving clients over to Shopify whilst safeguarding all data and minimising lost business days. If you’re in the market for a move to Shopify, drop us a line.
To improve your Shopify site speed, each individual page needs to hit the gym
Once you’re set up on Shopify - the platform that’s setting the pace in the race for the fastest site speeds - that’s when the real work begins. To improve your Shopify site speed, each individual page needs to hit the gym. Here we’ll show you all the ways to trim the fat and get your pages as lightweight as possible.
The very first thing to do is get a complete audit of your current site speed. It’s important to know the level you’re currently working at, and to set targets of where you want to end up. Google’s PageSpeed Insights will give you a comprehensive report of your site’s current performance.
Remember: you want to check for both desktop and mobile. It’s likely that a large chunk of your customers, if not a majority, arrive to your site on a mobile device. During 2020’s BFCM, 67% of all sales were made on a mobile device. That figure will only keep on rising. With increasing numbers of mobile shoppers, it’s vital that you keep their experiences at the forefront of your decisions. Sites on mobile devices are often slow and frustrating, both of which drive customers away. Make sure yours performs better.
They used to say that mobile e-commerce was the future, well the future is here. If it isn’t already, mobile optimisation should be your top priority.
Your optimisation workout routine begins with image sizes. 50-75% of your site’s total weight will be contained in images. They’re an absolute necessity to any successful e-commerce store, so you can’t do away with them altogether. But you can do these 2 things:
1) Make sure that every image is absolutely necessary.
2) Make each image as lightweight as possible.
Your website will likely need a load of images. But don’t just use an image for the sake of it. Make sure each one is there for a reason, and bin those that aren’t.
Before uploading, use tools like TinyJPG or ImageOptim to compress your images whilst keeping their quality.
Other image issues come when using thumbnails. Say you have a carousel of product thumbnails on your homepage. The information to generate these thumbnails is pulled straight from your product pages.
The problem is, the information being pulled can be larger than necessary and a visitor’s browser has to scale it down to fit the thumbnail. The process of scaling down impacts page load time.
Thankfully, Shopify has image size parameters built in. These make sure you only download the smallest possible image, whilst keeping the highest possible quality. The parameters reduce the required browser-side scaling, and subsequently speed up Shopify’s sites.
There’s a seemingly endless debate amongst online e-commerce gurus over the value and effectiveness of homepage heroes. We’re going to chip in by saying, irrespective of whether they’re useful or not, there’s no denying that they slow down site speed.
The size and quality of image required to fill the space increases load times. If you have 4 or 5 slides, you’re increasing that time 4 or 5 times. We’d recommend reducing the number of slides, preferably to 1.
A single, well-designed hero banner with a clear CTA will be more than enough to draw in customers and convert traffic into sales. Don’t fall into the trap of throwing in as much information into your hero, on numerous slides. Less is more.
Imagine a website in 2021 without video. Yeah, neither can we.
But just like images, video is a huge load for a website to bear. Also like photos, however, there’s ways to make your video content as lightweight as possible. Lite embeds is a great place to start.
The standard Youtube embed code is not only unnecessarily heavy, its <iframe> tag means the height and width of the video is fixed. Your video therefore cannot adjust depending on a device’s screen size.
Lite embeds only load the thumbnail image of the Youtube video onto your video at first. The video player and extra JavaScript then load only when your customer clicks on it. This keeps the weight drastically down when your page is initially loading, thus making it load much faster. Thumbnails usually only weigh around 15KB, something like a whole MB lighter than an entire video!
We’ll be honest with you: in most cases, pop-ups are more trouble than they’re worth. Especially quick-view pop-ups on product pages. Why? Because most of the time they pre-load the entirety of a product page, on top of the page your customer is already on.
Imagine you’ve got a collection page with 20 products. That’s 20 lots of information being loaded in one go, just in case a customer clicks on the “Quick View” button. A hell of a lot of loading, for something that might not even happen!
Unless they’re absolutely critical to your business model, we’d recommend that you avoid using pop-ups altogether. Think of it this way - if all your pages are loading in super-fast speeds, your visitors will be more willing (and more likely) to click on each individual product page and navigate their way through your entire store.
With all your pages honed and toned, it’s time to pop the hood and take a look under the bonnet. Here we’ll show you what to look out for in the code and scripts that run your Shopify site, and the changes that will increase its speed.
When browsers load pages they go through a process called ‘parsing’ the HTML. Parser-blocking scripts are configurations of JavaScript that prevent this from happening and force the browser to focus solely on that script before doing anything else. As you can imagine, this slows down the loading process.
To fix the issue, you need either the “async” or “defer” attribute. Here’s an example:
Parser blocking: <script src="jquery.js"></script>
Not parser blocking: <script src="jquery.js" defer></script>
As long as they’re done properly, these changes shouldn’t make any difference to your UX. But it’s always worth checking after!
We’ve seen it a thousand times before. Clients complain of a slow site, then lurking in the background are 5 apps they downloaded when they first set up their store and haven’t used since.
If you think that simply because you’re not using an app it isn’t decreasing site speed, think again. Even your idle apps are still running in the background, despite not doing anything.
The reason being, an app’s <scripts> are added directly into the <head> of your theme.liquid file. This has an immediate impact on performance because the apps must be rendered before any other code is loaded.
So the apps you aren’t even using are slowing down your site and not giving you anything in return. Get rid!
Data is the new currency of e-commerce. Don’t believe us? Check out our thoughts here on data-driven and data-informed e-commerce.
Tracking all that data, however, can hinder your site’s performance. This is often because each metric - conversions, clicks, etc. - requires an individual JavaScript tracking tag. Thankfully, there’s a way around this.
Tag Management Systems (TMS) condense all of those individual tracking tags into a single JavaScript request. That means you can run all of your Shopify Plus store tags with just a single piece of code. Check out Google Tag Manager for more info.
If you think that simply because you’re not using an app it isn’t decreasing site speed, think again.
Olympic sprinters don’t become fast overnight. It takes years of training to get to the top level, and even more training to stay there. Your site is the same. It takes a lot of time to get it running to its maximum performance, and then once it’s there, you need to keep it there.
Think of site speed as an ongoing, never ending project. Here we’ve skimmed through the very basics of how to improve your Shopify site speed. But there’s a whole lot more to it than this.
Since April 2021, we’ve established a new agency standard that is totally focused on platform performance. Site speed is now one of the key goals in every project we take on. It’s continuously tracked and improved, and we’re always learning new methods for making a site faster. A project we’re particularly proud of is the GAÏA GAÏA webstore. They say travelling at the speed of light will never be possible. Well, we’re not so sure.
This store could be yours. If you want to hear more about how to find top gear, get in touch with us to book a consultation.
Do you want to
stay updated?
Yes
Shopify is activating Agentic Storefronts for all stores in 2026.
Agentic Commerce for Shopify: Protocols, Platforms, and What to Prioritize in 2026
From Platform Chaos to Unified Commerce
From Platform Chaos to Unified Commerce: The Blueprint for Multi-Brand Consolidation on Shopify
Klaviyo Vol 5: Solving Localised Double Opt-In at Scale
Klaviyo Vol 5: Solving Localised Double Opt-In at Scale