Optimise Your Images
Posted August 30, 2017 by Simon
Most website visitors expect your site to load in two seconds or less, and many users will leave your site if it doesn’t load in less than three seconds.
One of the best ways to improve the page loading speed of your site is to optimise your images, which can significantly reduce the amount of data that needs to be transferred.
This article is primarily about ways to improve the loading time of WordPress sites, but the principles apply to all sites.
Ideally, you would use your image editing software (such as Photoshop, GIMP, etc) to compress your images before upload. However, if you don’t have access to any image editing software, you can use an image compression plugin.
One of the better image compression plugins currently available for WordPress is the EWWW Image Optimizer.
This is a free plugin that once installed will automatically compress your images when you upload them, and it also has the option to go through all of your current images and compress them too.
The compression process removes data from the image file that the human eye can’t see, so the file gets smaller but the image still looks clear and sharp.
Lazy Load Leveraging
If your site uses a lot of images (for example a gallery) and you want to improve the speed that it loads, you can use lazy loading.
This will only load images when they are visible to the visitor, and as a result it spreads out the load time creating a smoother user experience.
The Lazy Load plugin is ideal for this, and is free to install.
Use the right format for the image
If you have access to image editing software, you can save on file size by choosing the best format for the image. The main image types that are used on the web are currently .jpg, .png and .gif.
- JPG – This is a lossy compressed file format, and is best suited for saving photographs or images that have a lot of colours. Depending on the image you can reduce the quality down to as low as 60% without affecting the appearance of the image too drastically.
- PNG – This is a lossless compression format, and is good for transparent overlays, simple images and line drawings. It’s also useful for text, as it retains the crispness of the original.
- GIF – This is suitable for small images that use a small palette of colours, and it can also support transparency and animation.
If you are looking to save your images optimised yourself and don’t fancy the cost of Photoshop, you can use GIMP. GIMP can be thought of as the free Photoshop, and it has many of the features of Adobe’s image manipulation software.
Alternatively, there are a number of online services that can convert your images for you.
- TinyPNG – This features a clever compression technique that reduces the file size of PNGs without affecting the quality of the image.
- JPEGmini – This uses recompression to reduce the file size, and is available as a free web service or there is a premium edition desktop application.
- ImageOptim – This is a MacOS application that removes unnecessary meta data, and it also allows you to use lossy minification to get the smallest file.
If you would like to know more about improving the speed of your website, or you have any other questions then please get in touch, our support team will be happy to help.