5 tips to optimize the speed of your Shopify website
Speed holds a significant value in the success of any online store. The quicker the response rate of your store, the lower the bounce rate. And when your e-commerce store is fast, you have a better chance of ranking on Google over slow websites.
If that you look from an overall viewpoint, it’s clear that adding a lot of functionality will slow your site down. But here’s the catch – if you remove additional features and functionality in order to speed the site up, you won't be able to utilize all that Shopify has to offer.
Speed isn’t everything, of course.
You want a functional and professionally designed website that’s fast - at least as fast as can be, in order to achieve your goal which is high traffic and conversions.
Let’s have a look at the following step by step strategy to optimize the speed of your Shopify store.
1. Compress High-Resolution Images
Image compression is a significant factor and a necessity for quicker loading website pages. While performing image optimization, ensure the images are not larger (in pixels dimensions) than the placeholder the layout requires and don't include an excessive number of them on any single page.
Before uploading images to the admin, compress them using tinypng.com / tinyjpg.com (they’re the same site). It’s amazing how much the file size is reduced without losing any image quality.
When you replace all the pictures with these compressed versions, the page load time greatly improves.
2. Setup Lazy Loading
Lazy loading is a feature that only loads the images on any given page once they're supposed to appear in the viewport. This substantially speeds up the loading of the site because usually the images are the largest assets needed to be loaded.
Hence, lazy loaded images don't add to the initial page load so your site is lighter and loads much faster.
3. Discard Image Carousels and Sliders
Image carousels are bad - especially on the homepage. Although they are standard practice and you see them everywhere, image carousels/sliders get too much credit and don’t provide the value they seemingly do.
They move automatically (usually too fast) so that you miss the messaging. They usually translate to mobile devices in a suboptimal way and usually have too many slides that most users don’t even bother to view.
And when discussing page load speed, the numerous large-scale images in each slideshow add a lot for the page to load.
So when considering that most slides aren’t even viewed, they don’t perform well on mobile devices and the size of the images themselves, it’s best to forget about multiple slides and just stick to one large and impressive “hero” image. The rest of the important messaging and user flow that you want to direct the user to can happen below it.
If you are reluctant though on doing that though, the least you can do is to optimize those images and explained above.
This also doesn't mean you can't use them anywhere and it also means not all carousels are equal. Read more on the best and worst use cases for Shopify sites.
4. Optimize the usage of Shopify applications
When you are running your store on Shopify, it’s extremely unlikely that you can completely abandon the use of third party apps.
Each app usually includes JavaScript files that hinder the loading and you don’t have much control over when or how to load these files. You’re also dependent on the quality of the coding that takes into account page load speeds.
But since you can’t completely forget about using any, here are some of the tips that you can take to limit the impacts:
- Remove all the apps you are not using at that moment.
- There may be some apps that aren’t really necessary an that you can do just fine without.
- You can hire a developer to replace the app with custom code in your site that can provide the same functionality, only it’s optimized for your site.
- Test the page speed with or without these apps installed to understand how they are influencing the page speed.
- Try to limit their use to just the pages where you need them.
- Manually installing apps is sometimes favorable because you have more control over where to use them and how they will affect the speed.
- Replace apps with pre-built sections made by qwiqode, which could achieve the same result, but faster and easier.
5. Use quality responsive themes and apps
You can use responsive themes and apps that take into account the details described above. These themes should be fast and load images based on screen size of the device so that the larger images aren’t being loaded on small devices.
Check the speed of your site
A slow website can negatively affect your users experience which can keep them from purchasing your products – your main goal.
A quick and easy analysis of your store's performance will assist you with deciding if you have to address load times. Two great tools that we use are:
You’ll get all sorts of information here and what can be done to improve the speed. Some might be easy and others may require the help of a developer.
After running these tests, you can make the decision on whether you can fix it yourself or get in touch with a professional developer or agency that can help. It's a cost that will pay off over the long haul.
So if you need any assistance with your Shopify store, don’t hesitate to reach out!
