Imagine you have a really nice and attractive site. With eye-catching stylish design and beautiful images on it. Visitors simply adore it. But lots of high quality images make the site too heavy and, as the result, it works too slow. Irritatingly slow! You wish to make it faster. But how? The answer is image optimization!
What’s image optimization and what do I need it for?
Image optimization is a good way to speed up your website loading time, because non-optimized images can essentially worsen site performance. Most “weight” of the web pages is made up off images (pictures, icons, patterns etc.). They make site attractive, but slow loading. This is especially relevant for online shops, whose pages are pretty much overcrowded with images of selling products.
Some of the potential customers might not wish to wait ages and will leave your online shop before the page even fully downloads. And that’s damn bad! That’s why online store owners should be aware of the importance of image optimization.
In this article we’ll offer you some useful tips on how to improve site performance and optimize images easily and without quality loss.
JPEG, PNG or GIF?
Today you can come across lots of image file formats, but we are going to сonsider only these three formats as the most spread ones. It’s not too important for a common user to know the exact difference between them, but it might be important when it comes to image optimization.
JPEG file format was specifically designed for photographic images. By using the method of lossy compression it allows to compress photo-like images with very insignificant loss in quality. JPEG is typically the most effective for products photos.
PNG, on the other hand, is better suited for images with sharp transitions and large areas of solid color: logos and images that contain text, line art, or graphics. Using PNG for photo-like images would сause a large increase in file size.
GIF file format has palette limitation up to 256 colors for each frame which makes it unfit for color photos. Still it’s good for small graphic images or logos. GIF uses lossless data compression technique to reduce the file size.
Here we should also talk about so-called optimized and progressive types of image files.
Optimized JPEG or optimized PNG (also called non-interlaced PNG) file creates improved image file with smaller size. The browsers load such files top-to-bottom while image information comes gradually. Gives the best compression for image files with size under 10K and that’s why is usually more preferable.
Progressive JPEG or progressive PNG (also called interlaced PNG) file appears progressively. It allows to display the low quality image before all the graphic info will be loaded. The more information is loaded, the better image quality one will see. You don’t need to wait full loading to get the idea of what there is on the picture. This type in most cases gives better compression with the files over 10K.
After we have come to understanding which image format is better for different types of images on your ecommerce site, we still have one more important matter to deal with. And that is the way to compress all the images on the site to make them substantively smaller.
The thing is, even if you choose the most appropriate format for your images, they still might have a huge file size. The better quality an image has, the more it weighs. When you have thousands of pictures in your online store even 10% image compression will be extremely effective to improve the loading speed.
Image Optimization Tools
Image optimization is now widely available with the help of image optimization tools. Here is a list of the most popular and certainly useful image optimization tools that provide compression without quality loss of an image. Some of them can be used online, the others must be installed on your computer.
Online image optimization tools
Smush.it is a popular lossless image optimization tool from Yahoo! team. It is web based, which means you can run Smush.it through the web site.
Another web based tool for compressing different image file formats. With its help you can also convert your image to different file format. Though it’s not perfect and has a limit of 200KB per file. Also it allows only one file to be conversion at once.
Unlike the previous two image optimization tools, this one uses several optimization techniques. After you have uploaded the image PunyPNG will check it and then choose the best compression technique.
When using the SiteReportCard Image Optimization Tool online you can either paste the URL of your image or upload the picture from your computer. The tool will compress and optimize the image into various size and quality.
Image optimization tools for Windows
After installing Shrink O’Matic on your computer you can compress and optimize your images with lots of additional options like picking the output formats, output name or the output sizes.
This image optimization tool will easily convert various file formats into optimized PNG.
7. JPG & PNG Stripper
The best thing about this application is that it can remove unnecessary metadata from the image files to reduce their size. Works with JPG and PNG file formats.
8. RIOT – Radical Image Optimization Tool
RIOT is very nice tool that can read and optimize images with uncommon extensions, which makes it unique if compared with other image optimization tools. Handy display allows to see and compare the original and output images, that are shown next to each other.
Image optimization tools for Mac
Allows to compress the whole folder with different file formats at once.
Compresses different file formats to JPEG. You can choose the output quality.
Image optimization can bу a great help to your online shop. It can speed up your site and make shopping process more relaxing and comfortable. And this may not be the most crucial, but certainly very important step to your success. So don’t hesitate. Optimize, speed up and enjoy!
Promokit Team wishes you good sales!