Usually, a slow website is due to the web hosting (servers), code optimization or errors, and large unoptimized images. Learning to optimize your product images will help you greatly improve your website.
Your website speed is a rank factor for Google and a slow website will get penalized, ranking lower in the search results. This is part of the Google strategy to improve web usability, especially for mobile users.
Mobile traffic has grown exponentially in the last years and optimizing your website for mobile visitors is a must. A lot of times mobile users have slower internet connections, image optimization will improve loading times greatly.
A lot of times images uploaded on websites are way bigger than they need to be slowing them down. Unoptimized images load slower, consume more bandwidth, and are racking up your hosting bill.
The goal is to optimize your product images in a way that will help both with your website speed and increase your SEO rankings.
Here are 4 ways to help you:
Background Removal
One of the easiest ways to reduce the files size of an image is to remove the background. The file size is reduced substantially because a lot of the non-necessary information is deleted.
The image on the left is 2MB, the image on the right is 397kb. That’s five times less than the original making, substantially improving the load time on any product page.
The DropSpace background removal tool is created to work great for any type of product image, give it a try here free.
Image optimization
Image optimization is the process of using different types of compression algorithms to reduce the file size of an image without altering its quality. A smaller file will make your website load faster, scoring more points in the eyes of the Google ranking algorithm.
Also, Google knows if you can optimize your image and that you didn’t do it. Just go to PageSpeed and test your website.
There are multiple types of image compression, some are more appropriate for product images and some are not.
The issue with image compression is image quality degradation, it needs to be carefully considered and applied. Too much might change the colors of the image.
Types of Image Compression
Lossy
Lossy compression means that the image size is reduced while some data from the original image file is eliminated, by data it means pixels.
The biggest benefit of lossy compression is that it significantly reduces the size of the image file. But the biggest disadvantage is that this is achieved with some loss of quality, sometimes very visible.
Lossless
Lossless compression reduces the size of an image without any quality loss. This is achieved by removing unnecessary metadata from JPEG and PNG files and using specific compression algorithms. The big benefit of lossless compression is that you can retain the quality of your image and still achieve a smaller file size.
Each compression type has its advantages and benefits. We at DropSpace.co we are offering a lossless compression for any file uploaded.
Using the Smart Download button you can choose to compress the images you download automatically and the format you want: JPG, PNG, WEBP.
An example of a lossless compressed image below.
The left image is a JPEG at 2.7 MB, the right image is 1.6MB WEBP lossless compressed image.
File types
When it comes to compression the image type is important:
JPG
This usually is the most often used and provides a good balance between size and quality.
PNG
Used for higher resolutions or when transparent backgrounds are needed.
WebP
This is a new image format from Google and provides amazing image quality that combined with lossless compression gives small image sizes without compromising quality. It also has transparency like the PNG format.
Resize
Most of the time your images are oversized and they should be resized at a smaller resolution. This will further reduce their weight on the page and make your website even faster.
There is no need to have a 4000x4000px image, most of the time a 2000x2000px or smaller will be more than enough. A lot of times our eyes won’t be able to pick it up.
With DropSpace you can reduce the size of your images from our smart download button. Test both on your desktop and mobile version of your website what works best.
Rename
Another important factor that might improve your SEO rankings is the name of the files you use. If you sell a pair of jeans for example a name like levis-jeans.jpg is much better than image22343.jpg.
Google is smart enough to also understand what’s in the image and if the name is matching what it seems that’s a win.
Conclusion
I hope you got a better understanding on how to use image compression to improve your website speed, offer a better experience for your users but also to increase your website’s Google ranking.