How to optimize images for your online store

February 12, 2019

images

A high-quality visualization is one of the secrets to attract and engage more users on your site. How you can do it? As it turns out, there is not enough to just create a good illustration and download it to your site. You also need to fill all the attributes, reduce its size, and know exactly in which format to download (e.g. PNG, JPEG, GIF). Let’s clear these points.

Image optimization: what is this

Image optimization is the process of reducing the size of images without losing its quality. For what you need this:

  • To attract new users through Google images
  • To reduce site load time
  • To boost your SERP rank
  • To increase customer retention.

For the e-commerce store, it is critical to find a balance between image quality and image size. As of March 2018, almost 50% of the website content was the images. It is a huge share.

image share

Images share in the overall website content

 

Another evidence is a survey conducted by BigCommerce and Square in 2017. They discovered that Americans customers rank the product photos as the #1 thing they want more from online stores.

What shoppers want online-study

What shoppers want online

 

The statistics above show that image optimization should be one of the priorities for all marketers. And now we are going to dive deep into this process.

Image optimization: file types

When you upload images to the site, you have to always make a decision about what image’s types to use. The most popular are PNG and JPEG. Do you know the difference between them and how it influences your site’s load time?

JPEG

JPEG mixes blue, red, and green light making possible to display millions of colors. It is important because not all file types allow to do it.  Another JPEG benefit is that you can adjust the file size. But be aware, when you reduce the size, you also reduce its quality.

Notice, that JPEG and JPG are definitions with the same meaning.

JPEG images are the best choice to use for the:

  • Product images in the main catalog
  • Photography images
  • When you have an illustration with a lot of colors.

Look at the example below. There is the screenshot from the Zappos store.

zappos

Example: Zappos

 

PNG

PNG is a new format comparing to JPEG. Usually, the PNG images are better in quality compared to JPG, but, at the same time, larger in file size.

There are two types:

  • PNG-8: allows 256 colors, is smaller in size
  • PNG-24: allows millions of colors, has a big size.

PNG images are the best choice if their quality is much more important than its size. The most bright example is the site of the photographer Zena Holloway.  

Zena Holloway

Example: Zena Holloway

 

divider

attention-grey Attention attention-grey

The PNG images are better in quality compared to JPG, but, at the same time, larger in file size

divider

Image optimization: name, alt text, description

When you have uploaded the images on the site, you need to optimize its SEO parameters, like name, alternative text, and description.

Below there is a screenshot from the WooCommerce admin panel.

image SEO

Image SEO parameters

 

Title: you can leave its like “product-image-205231288_480x480@2x.jpg”. But it is much better to rename as “Heel shoes”. Think about how your customers will search, which queries to use, match this with the keywords to improve image SEO.

Caption: it the text which appears when you hover the mouse on the image.

How the Caption works

 

Alt text: it is a text alternative to the image. For example, in the situation when the browser can’t display the photo, customers will see what you write in this field.

Description: image’s description.

Image optimization: compressing

Image compressing platforms are a simple and quick way to reduce the images’ sizes. The remove all the extra data like additional color profiles and metadata. At the same time, it doesn’t affect the image’s quality.  We can recommend these platforms:

Conclusion

To recap all the writing above:

  • Choose the right file format
  • Don’t forget about Image SEO optimization
  • Reduce the image’s size with the help of image compressing platforms.

Leave a Reply

Your email address will not be published. Required fields are marked *