How To Improve Your Site Speed

Have you clicked on the 'Online Store' tab on your Shopify Admin panel recently? Chances are that you have seen the new feature that Shopify released last year, the 'Online Store Speed' and after seeing the number you probably had a mini heart attack thinking that your website is too slow and that you are losing customers because of it!

First of all, slow down. This is why we are here to help you, this guide will explain about this new tool, and how we should use it, and then show you things that you can do to increase your websites load speed.

So, why does it even matter? Research has shown that if your website is slow to load, then the customer is more than likely going to abandon their efforts to go onto your website and do something else. This time can be as low as 3-5 seconds.

But there one thing to note:

Shopify websites are generally incredibly quick to load because of the high-quality servers that they use. The score that is shown on your admin panel is a score of yours relative to other Shopify stores, this means that even if you have a lower score you are probably still faster than most other websites out there.

So what to look for, If you score more than 50, well done, there is probably very little that you need to do, scoring between 20-30, this is nothing to worry about, there are some things that you can do to improve your website, but it is nothing worth stressing about. Below 20, There are probably some large issues that are slowing your website down, and these issues will be affecting the way that your customers are experiencing your store, and thus impacting your sales.

So what can you do?

Don't go overboard on your apps

Whenever someone opens a website, the data for that page is sent over to the customers' website - A little bit like sending a letter - but the more apps that you install the larger the letter gets, and if you’re not careful you'll be sending over a huge parcel instead!

There are two questions that you should ask yourself before installing an app

  • Do I really need this app, or is there another way to achieve the same functionality?
  • Is this app well written and developed, What are the reviews, documentation and supporting information like?
  • There is a big difference between a well-written highly optimised app and one that has been quickly developed and put up on the app store. One will do the job in as quick and efficient a way as possible, the other will more than likely contain a lot of unnecessary code and perform tasks in a less than optimal way.

Another thing to note is that by just deleting the app from the app manager on your admin panel, you will not be deleting the code that is on your website, by deleting the app you will be deactivating it. So if you choose not to use the app any more, go into the app and see if they have an uninstallation process, if not, then you will need to go into the code and remove it manually, which you should only do if you are comfortable reading and writing code. If not get in contact with a Shopify developer (ahem - US) and they can do that for you.

Optimise your images

Every image that you have on your website has to be sent over the internet to the customer, so the more images you have the more data has to be sent. But, it's not necessarily the number of images that you have, rather the size of these images. If you aren't careful the file size of one image can soar, meaning the amount of data that needs to be sent increases fast, resulting in slower load speeds.

How do we combat this? There are a few ways, but here are the main few:

Image Format

Three of the main formats are JPEG, PNG and SVG. Remembering which is which can get confusing though, so here is a quick explanation and some examples of when to use them. SVG's are vector-based, used for flat line drawings, icons, and logos that will scale to any size while the file size remains small. PNG's are lossless and raster-based, used for images that need crisp lines or text (but do not need to scale), and for images that need transparency and have few colours. JPEG's are lossy and raster-based, used for photos and images with lots of colours where crisp lines aren’t essential, and transparency is not needed.

Choosing the wrong image format could result in the size of the files being much larger than they need to be. So make sure you choose the correct image format.

Image size

The biggest reason for image files being too large is that you are uploading images that are too big for the context where they are being used. While some platforms handle re-sizing for you, it is always best to upload an image that is only a few hundred pixels larger than what you need it for, this way the image will never lose quality and become grainy, and the file size will be a lot smaller than the original file.

A small rule of thumb is that a hero image never really needs to be larger than 1600px wide, and a product image 800px. The size of the image will depend on where you are using it, and there are tools available to help you find out the size required.

Optimisation

Image files also come with a lot of data that is not seen, this data is called Metadata. While this information is useful for your computer to tell you where and when the photograph was taken, you don't need this information on your website. Luckily several websites will automatically remove all unnecessary data from the photograph. Just Google "Image optimiser" and upload your photos, and they will return images that are as small a file size as possible.

Slideshows - You don’t need them

Research has time and again shown that users do NOT use slideshows, the number can be as low as 1% (source) So what does that mean... GET RID OF THEM.

Including a slideshow, means that Shopify will need to send over multiple large images to the user, which increases the file size, for something that is highly likely never going to be seen.

If you do want to include a slideshow on your website, try limiting the number of slides to only 2 or 3, to reduce the payload of your website.

Lazy Loading and Asynchronous loading

This is a little more technical so if you cannot comfortably read and write code then it will be best to consult a Shopify partner on looking into this for you.

When you load a page, the browser goes through each line of code and will download it and render it to what you see on your device. The problem is that when it comes to a large file, perhaps an un-optimised image or a script for an app, it will load that before moving onto the next thing. Which if you have multiple large files and scripts, can eat up time.

Fortunately, some things can be put in place to mitigate this. For example, you can set up lazy loading on your images, so they are only loaded once the user scrolls down to the section on the page, meaning that the initial load is much much faster.

Secondly, you can make it so the scripts that are loaded are done so asynchronously, which tells the computer to load this file, but while you are doing so continue to move on and load the next items at the same time. meaning that there is not such a slowdown. Or if you do not need the code upon loading you can also tell the computer to defer loading until the browser has finished loading everything else.

Conclusion

So in conclusion,

Don't panic when you see a low score, it may not be as bad as it makes it seem!

Minimise the number of apps that you download onto your store, and make sure they are reputable and high-quality apps

Optimise optimise optimise your images!

Make sure the code for your theme is loading correctly

No items found.
More Posts

You Might Also Like

Sign up to our newsletter and get information about discounts and promotional offers straight to your inbox. Luxe Salon is committed to keeping your personal information safe. Your personal information will not be passed on to any third parties. To learn more, please read our Privacy Policy.

sell
Published on
June 28, 2021

Why Do I Need A Website & When Is The Right Time?

As an e-commerce business, you have a lot of platforms that enable you to sell your products, Etsy, Not on the High Street, and many others. With this in mind, the question you may ask yourself is; “Do I need a website?” especially if you are already successfully selling your products on these platforms. 

sell
Published on
June 28, 2021

Can I Build my Own Website?

Anyone can build their website if they use the tools available to them, and thankfully creating your website has become a lot easier than it used to, although it can still be a complex process! But is a DIY website the best decision for your personal circumstances?

sell
Published on
June 22, 2021

Why Choose Shopify?

For small creators and sellers, we always recommend Shopify as the platform to host your website and to sell your fantastic products with. Here's why.

work
Published on
June 15, 2021

How To Market As A Small Business

If you don't take marketing seriously in your business then you have to be prepared for a difficult time working in your small business.

lightbulb
Published on
June 8, 2021

How To Write Testimonials

When making a purchase, it always involves an element of risk. The type and nature of this risk is very dependent on what product or service you are offering. This risk is especially strong with first time customers who have not been referred to your business. So how do we help mitigate this risk and bring your potential customers to the point where they feel comfortable to make a purchase from you?

lightbulb
Published on
June 1, 2021

Blog Topics For Small Businesses

So, you’ve heard that writing blog posts/content for your website will help you rank higher on search engines… If you haven’t, well you’ve now learnt something! But the problem we hear time and time again is that you just don’t know what to write about.

lightbulb
Published on
May 25, 2021

How To Improve Your Site Speed

Site speed is one of the main reasons why your customers are leaving your site, yet there are some simple yet effective ways to improve your website's speed. Here's how you so it.

work
Published on
May 18, 2021

Know Your Why

Start with why! Why does it matter to you and your business?

lightbulb
Published on
May 11, 2021

How To Write An E-Commerce About Page

For most people, an about page is the first page they click on after they have entered a website. Here's how you can write an about page that sells as an e-commerce business.

work
Published on
May 4, 2021

Five Ways To Make More Time

Running a business is hard. With so much eating into your time, you may feel as if you need an extra two hours a day, just to get by, let alone think about growing your business.

mclean creative Newsletter

Latest information straight to your inbox

Sharing an insight into the world of small businesses and the problems they face. You can find educational articles in our blog that will both help you identify those problems and solve them in the most efficient way possible. Why not have them sent straight to your inbox?