Did you know that simply uploading the images to your website – without optimizing them – could be slowing down your website speed?
Most people that are starting with their website in the digital world do not optimize their images for their website – and this is costing them (sometimes) seconds in load time.
When it comes to WordPress speed, this is a little less relevant as WordPress will automatically create and serve different versions of the same image – which are usually reduced in size.
Regardless, even with WordPress, scaled images can still end up a few megabytes in size which is completely unnecessary, unless you’re working on a photography website.
In this article, we’ll go over the various methods to optimize your images – before, and after uploading.
Why website speed matters
Let’s start with some statistics related to website speed. Digital.com gathered data from 1250 eCommerce shoppers to determine the key metrics that eCommerce websites should be focusing on:
- 1 in 2 shoppers will abandon the website if it takes too long to load
- 21% of consumers say slow-loading pages are their main source of dissatisfaction when shopping online
- 39% of shoppers want pages to load within 2-3 seconds, while 14% want them to load in one second
- Businesses with slow-loading pages leave a negative impression on 45% of customers
Other than the impact on your conversion rate, page speed also has a big impact on your SEO rankings. Google will always prefer websites that perform better over websites that are slower when possible – and this is especially true on mobile.
Apart from images, there are many other optimizations you can do to your website to increase its speed, but in this article, we will focus on images only.
How to optimize images for your website
Before we get into the “how” part of the article, let’s take a look at what exactly image optimization is.
When an image is taken by your phone (as an example), it is usually in very high resolution and it’s very lightly compressed. These two things combined cause the size to be over 3 megabytes in most cases.
Now, this is actually good, because it means the camera could fit more data into the image. However, all this data is not needed when the image is used on a website, so the size can be reduced by a lot.
Let’s perform a test. The image is 4032 × 3024 in resolution and originally 6.6 MB in size, taken by an iPhone. After compression, the image weighs 2.1 MB, and this is without resizing it to a lower resolution, which you should also do. Can you spot which side is the original, and which is the compressed side?
For most people, the answer is no – which is why image optimization is worth it to increase your website speed.
Method 1. Use a free service to reduce the size of the images before adding them to your website
There are plenty of services you can use to optimize an image before you upload it to your website. Most of these online services only perform compression and do not resize the image for you, however, there are also some that will resize the image.
Due to the popularity of such services, it’s so easy to find one – just ask your favorite search engine.
Method 2. Saving your images with lower quality in your photo editing software
Since not everyone edits their photos before adding them to their website, we’ve decided to place this as a second method. However, if you are using a tool such as Photoshop, you could reduce the file size when saving.
Photoshop is the leading tool used for photo manipulation. When saving to JPEG, the modal window asks you to choose the quality and save the image. Usually, choosing 8 does not result in any noticeable quality loss.
As you can see, simply dragging this slider – without even reducing the resolution of the image – shrinks the file size to under 3 MB.
Optimizing your images in WordPress
WordPress is the most popular platform for creating websites, it wouldn’t be a guide if we didn’t include some specific instructions for WordPress. There are some very easy solutions to optimizing your images in WordPress if you feel like manually optimizing images is unnecessary work.
1. Use the Litespeed Cache plugin
One of the most popular optimization plugins for WordPress is Litespeed Cache. This plugin consistently provides great results across various types of websites – due to the obscene amount of configuration options.
Litespeed Cache has a specific option to optimize images automatically after upload. In the configuration, you can set the image quality, and opt-in to automatically convert images to WebP for better size.
One drawback of Litespeed Cache is that it only works on Litespeed servers, so some hosts might not support this. Worry not though, Eltris runs Litespeed on all servers so you can install the plugin and improve your WordPress speed.
2. Using another optimization plugin
While Litespeed Cache is a great plugin to use, there are various other plugins that are available within WordPress. Some free examples include:
- Robin image optimizer
- WebP Express
There are also paid plugins that provide more advanced optimization functionalities, however, the free options provide enough features for most people.
If you already have a website and are not saving the images optimized for website speed, then you need to start doing it now. We would also recommend going through images you’ve uploaded in the past and optimizing them to reduce the file size.
To conclude, let’s revise the benefits of optimizing your images:
- Faster website load time
- Better SEO rankings
- Potentially more conversions
Other than optimizing your images, one of the other easy ways you can increase your website load speed is to connect a CDN to your website.
We hope this article helped you improve your website speed.
Eltris uses Litespeed on our servers and allows you to perform automated optimizations with the LSCache plugin for WordPress.