You have photographed your products and have high resolution quality images. This is great, but these images might be too large for the internet. For those of your customers have slow internet connection or browse your site from a mobile, these images might slow down the site loading significantly.
The visitors might become impatient and leave your site without buying. To prevent this, you might want to optimize your images by reducing their size.
In this article:
Any image has two sizes: the space it occupies on the screen and the memory space it takes up.
The space the image occupies on the screen is measured in pixels (px) – the points that make up the screen. In your Ecwid store you can upload images of any size. They are always optimized to fit the screen. However, it’s best to reduce your product images to about 1000 x 1000 px. That size is large enough to display the product and small enough to load quickly.
The memory space the image takes up is measured in kilobytes (KB), megabytes (MB), gigabytes (GB) and so on. The larger the image physical size is, the more storage space it takes up and the longer it takes to load. You can solve this problem by compressing the image.
However, after strong compression images might lose in "quality": there is noise or an abrupt color transition. To avoid this, it is enough to save images in the correct format and use special compression services.
There is a “standard” set of proportions that people perceive as pleasant. They always have a nice result and they are: 1:1, 4:3, 3:2, and 16:9.
The proportions are important, as they define the look of your site. Give all your images the same proportions, as this will give your shop window a structured and professional look.
If you have already reduced the size of an image, you have probably noticed that it has lost its sharpness. How to retain the sharpness?
Most modern photo editors allow you to select a new image size when “saving for Web”, with a reduction algorithm that directly affects the sharpness. In Photoshop, we recommend that you use the image size below 1000 px and quality = Bicubic Sharper.
You should select the appropriate format for saving your images to have the highest quality with the smallest size.
These are the most popular formats:
GIF (Graphics Interchange Format — “format for sharing images”) is capable of storing compressed data without loss of quality. The format supports animations.
PNG (Portable Network Graphics) uses lossless compression and stores an unlimited number of colors.
JPEG (Joint Photographic Experts Group, the name of the developer) is the most common format for storing photos and other images.
So what to choose?
- If you have a picture, choose JPEG or PNG.
- If you have an animated picture, Choose GIF.