A picture says more than a thousand words: how do you optimize images for your website?

Guest blog by Jarne Niens from Viral Marketing

A picture says more than a thousand words. This proverb indicates why image optimization is important for websites. When you offer a service or product it is important that a customer can visualize this. Of course it is important that your images are of excellent quality. However, there are dangers to this. Large images with a high resolution are huge files. When you place a number of images on your website, a great online experience quickly turns into an irritation process for your (potential) customers. As a result, you not only lose customers, because Google also sees this. This will therefore have a negative effect on you SEO.

The following points are particularly important for image optimization on your website:

• File types of images
• Save images

File types of images

The three most important image file types for your website are JPG, PNG and GIF. Each file type has its own strengths and weaknesses.

JPG (or JPEG) images are good for photos or complex images that contain many colors, shadows and complex patterns. Due to the large available color palette from JPG this is ideally suited for these images. JPGs can be stored in high quality, low quality and everything in between. This allows you to create a balance between file size and quality of the images.

PNG is also an important file type for images. In Adobe Photoshop you have the option to save PNG images as PNG-8 or PNG-24. PNG-8 images have a limited color palette of 256 colors. Although the file size of the images will be smaller as a result, we do not recommend this for complex images. PNG-24 images ensure better quality at the expense of increasing file size.

GIF images were popular a few years ago and are still an option for small images and, like PNG-8 images, are limited to 256 colors. We therefore also advise you not to use this file type for product photos.

Save images

As expected, large images ensure a longer loading time for your website. When we talk about large images we are not talking about the size of the images but about the file size. It is important to keep the images as small as possible to guarantee a fast website. There are three main points to remember when saving images.

First of all it is important that you save the images in the correct dimensions for image optimization. To realize this, you must view the images in your editing program at 100%. This ensures that the images are viewed in the exact proportions as when they are displayed on a screen.

When saving images from the web, it is possible to reduce the size of an image without drastically reducing the quality of the image. In Photoshop, for example, you have the option to save images with the 'save for internet' function. This allows you to save the images with almost the same quality while reducing the size of the images.

Finally, compressing images is the easiest way to reduce the file size of images. Various (free) software is available for this. These programs remove hidden information from the image file such as color profiles and metadata (for example, geolocations or where the photo was taken). These programs provide an easy and fast way to reduce the image size without sacrificing quality.