Ecommerce Image Optimization: How To Optimize Product Images

CREATE COMMUNICATE CONNECT

Awesome Experiences Brand Stories Your Customers

Monday, Nov 18, 2019 / Ecommerce solutions / KrishaWeb

How to Optimize Product Images for Your eCommerce Website

E-commerce Image Optimization Tips

On any eCommerce site, product images occupy more space in source than other parts of the website. Hence, the performance of any eCommerce site is largely dependent on the size and complexity of the images, as it is essential to display the images of each product on an eCommerce site. With image optimization;

  • The product images displayed on your website shows up whenever these products are searched on Google.
  • The product images on the landing page do not reduce the loading speed for the customers.
  • The conversion rate and the customer retention rate increases due to a website’s improved performance (it is possible to increase profits by 95% with a 5% increase in customer retention rate).

Therefore, product image optimization is essential for all eCommerce sites.

Pay Attention to “Google Image Search”

Google Image Search

Currently, the eCommerce industry dedicates around 99% (or more) of its resources to Google’s core-search product even though Google image searches account for 25.2% of all searches. A recent study also shows that over 900% more searches are performed on Google than Bing.

It is therefore prudent for the eCommerce industry to pay closer attention to the 25% of the Google searchers activities. E-commerce sites that showcase a diverse collection of products can benefit from taking advantage of this neglected sector of the search-market, as you can bring the products directly in front of image searchers in this way. This is an excellent way to improve a product’s brand image or to increase the click-through rate.

Do You know?
Your eCommerce Store is getting enough traffic but no conversions! Why?
Focus on Image Optimization… Well optimized high quality product images can get you 25% more conversions

Importance of “Google Image Search” for E-commerce Sites

Google Image Search For E-commerce Websites

E-commerce is different than the content-oriented websites and image search is more important for these eCommerce sites, as an image can deliver more information to the viewers than a product’s description. Properly optimized images can even attract a large number of prospects and it is also possible to entice the users to invest in a product with proper Image SEO. On an eCommerce site, a consumer is more likely to purchase a product based on its appearance after viewing its image. Hence, it is prudent to invest in image SEO, as it ensures a higher profit for an eCommerce site.

And the following steps are vital for eCommerce Image Optimization.

Learn About Image File Types

Image File Types

There are different types of image files, such as JPEG, PNG and GIF. In this digital era, it is prudent for a marketer to have basic knowledge regarding these file types to determine what type of image can be more beneficial whilst taking up less space on an eCommerce site.

  1. JPG/JPEG (Joint Photographic Experts Group): Unlike other file types, JPEG files can efficiently mix blue/red/green lights which allow for the display of numerous colours. It is even possible to easily adjust an image file’s size when it is in JPEG format. Therefore, JPEG file type is ideal for larger image files, as the larger images download faster if it is possible to adjust a file’s size without degrading its quality. JPEG file type is equally suitable for the photography images and images with multiple colours.
  2. GIF (Graphic Interchange Format): It is fun to watch GIF videos and these files are compressed versions of videos or images. However, these compressed videos can only display 256 colours. Therefore, this file type is ideal for animations, images with limited colours (logos) or small images (icons/thumbnails).
  3. PNG (Portable Network Graphics): PNG is the latest type of image file. These files are larger in size and better in quality in comparison to JPEG files. However, PNG-8 does not ensure better quality, as it allows for the display of 256 colours. On the other hand, PNG-24 allows for the display of millions of colours whilst ensuring the best quality. PNG is the ideal file-type when the quality of an image file is important than a file’s size. However, it is prudent to use PNG for simpler images.

Use Correct Image Size For More Conversions

Correct Image Size To Increase Conversion Rate

The measurement of the ‘Image Size’ is different from the measurement of ‘File Size’. The ‘Image Size’ refers to the dimensions of an image, such as 852×852 or 1280×720. However, the ‘File Size’ refers to the space that is required to store an image on a server and the loading speed of an image is in direct proportion to the file size. Hence, it takes longer to download an image with larger ‘file size’. Therefore, the performance of any website, especially an eCommerce site, is largely dependent upon the ‘file size’ of an image. Hence, it is prudent to keep the images at 1-2 MB in size, as it increases the loading speed of a web-page and reduces the bounce rate with satisfied prospects and customers.

Ensure Used Images Have Strong Technical SEO Foundations

Strong SEO Technical Foundation For Used Images

There are some images on every eCommerce site, such as design elements, that need not turn up on search results. However, it is essential for the majority of the images displayed on an eCommerce website to turn up on search results. Hence, it is crucial to resolve all issues with the following image SEO foundations if you want all the images to score higher on search results.

Image Filename

To create an effective filename, it is essential to pay attention to the following points

  • Keep a filename simple and include at least one keyword or one variation on a keyword into the image filename.
  • Avoid using multiple keywords in a filename.
  • Use underscores/hyphens in between the words, as search-engine can easily read a filename that is legible.
  • Avoid using spaces, as a filename becomes illegible.
  • Ensure that naming conventions are transparent to the users and search engines.
  • Use descriptive words and information that people search for during an image-search instead of adding hexadecimal labelling.
Image URL

It is crucial to remember the following points when creating an image URL.

  • Use a keyword in the URL; however, avoid using the same keyword used in the image filename.
  • Make sure that a correct URL-architecture is in place for all image URLs.
  • Create subfolders for different types of images, such as /images/shirts/women’s/, instead of creating a standard folder, such as /images/.
  • Create a hierarchical taxonomy for image URLs, as the search engines can have a better semantic understanding of the images.
Image Alt Attribute

The ‘Image Alt attribute’ is not supposed to be treated as a meta-keywords tag, as it is supposed to be used by the ‘screen readers’ for visually impaired individuals. The ‘Image Alt’ also works as a substitute for the browsers that cannot display a particular image for some reason. The ‘image alt’ attribute can be used as a descriptive replacement for the product images that include keywords.

Compressed Images

If the images on an eCommerce site take longer to download, then it may negatively impact the SEO, as the overall loading speed of this website may slow down due to these images. The larger images are loaded directly from a website and the users are unlikely to click an image if it takes longer for it to load in Google images. It is possible to avoid these issues with the following tips.

  • Avoid uploading extremely large product images on an eCommerce site.
  • Know the maximum size of an image when it is displayed and avoid uploading an image that is larger than this size.
Mobile-Friendly Design

Google ranks the responsive/mobile-friendly websites higher and the following CSS can be used to make a responsive ‘img attribute’.

‘img {

max-width: 100%;

height: auto;

}’

It is possible to reduce an image’s size using this CSS. The “height: auto;” argument in this CSS can prevent an image from being squashed if the window is narrowed, as it can adjust an image’s height.

The CSS that includes the “@media only screen and (min-width: 400px)” argument can reduce the loading time of an extremely large image on the mobile phones. It instructs the browser to use a different image when the browser window is more than 400 pixels wide. This command improves the performance of an e-commerce site and enhances the user experience.

Keyword Choice Tips
  • It is useful to learn about the keywords that are commonly used during the image search. However, it is also essential to consider the users’ intent when selecting keywords for images.
  • It is also useful to add words, such as image, images, graphs, charts, pictures or pics, in Google’s Keyword Planner; you can have an idea regarding how different keywords compare against each other.
  • You may check on Google if any of these keywords show any image recommendation. It is an indicator that people searching for these phrases are usually looking for the images and are likely to visit the ‘image search’ results.

Produce Images for Content Producers to Earn Links

Produce Images For Content Producers

Content producers are likely to use the following images enabling you to earn more links for a website.

  • Images representing statistics
  • Images showing how to perform a task, as the textual narration of the process may take longer
  • Images containing quotes
  • Images that depict the important points of any content
  • Images answering a question
  • Graphs/charts/data-based images that content producers may look for during the case studies.

It is essential to thoroughly research and to carefully select the keywords when using these images. The selected keywords are supposed to communicate user-intent. It is equally essential to avoid the keywords that are already saturated with high-quality images. By following these steps, you can earn organic and passive links over time for the product images.

Include Interacting Text in Product Images

Include Interactive Text in Product Images

It is prudent to include texts in ‘product images’ if you want to encourage the viewers to purchase a product after clicking on the image. A text may even become a differentiator that encourages people to visit a website, as it conveys the message that cannot be visually communicated.

Use ‘Alt Text’ to Keep Website Images Accessible

Image Alt Tags For accessible Products on eCommerce Website

The main objective of using ‘alt’ attributes is to ensure that the images receive pertinent and simple descriptions that remain within a website’s code and ‘alt’ tags can benefit in three different ways.

  • The ‘alt’ attributes keep a website optimized for search engines, as SEO crawlers read these descriptions.
  • Visually impaired individuals can learn in detail about an image using screen readers, as a ‘screen reader’ can narrate the ‘alt’ attribute description whenever they hold a cursor onto an image.
  • The ‘alt’ attributes function as a line of code and informs the browser regarding a file if an image has difficulty loading.

Use CDN to Increase the Speed of Image Delivery Time

Use CDN for eCommerce Product Images

It is possible to increase the speed of image delivery time using CDN (content delivery network). It is a network of servers. These servers are located around the world to deliver multimedia, such as videos/images. CDN reduces the number of network points between the server and the user. Therefore, it becomes possible to quickly deliver the content that is crucial if you want to load the images or different types of multimedia content.

Use Image Sitemap for Google

Product Image Sitemap for Google

Memes, videos or infographics are loved by modern consumers, as they can deliver any message in a curtailed yet entertaining fashion. Hence, it is prudent to add these to the site-map of a website. The sitemap is a file that lists the web-pages of a website and these files can inform the search engines regarding the organization of any website’s content.

Web-crawlers, such as Bingbots/Googlebot, can intelligently browse a website using these files. Hence, the Sitemaps are crucial for image optimization and it is prudent to create separate Sitemaps for each type of content on an e-commerce platform as there are thousands of images/videos.

Drive Upsells with Optimized Thumbnails

Drive Upsells with Optimized Thumbnails

Upsell is an additional product or an upgrade that a seller introduces to you after the initial purchase. The thumbnail images can be used to effectively advertise the upgrades or related products once a customer has either purchased or searched for a product. The thumbnail images are usually displayed at the bottom of a web-page. These images can be a great source for upselling after optimization, as the optimized images load quickly and make sure that an e-commerce platform does not lose potential businesses due to consumer’s frustration.

Understanding Aesthetic & Technical Aspects of Images

Understand Aesthetic and Technical Aspects of Images

The technical aspect of an image is concerned with an image’s size, resolution and file type. On the other hand, the aesthetic aspect of an image is concerned with the styling or background colours along with other subjects that may affect the overall appearance of any image. It is crucial to understand both of these aspects to correctly optimize an image for an e-commerce platform.

Improve Retention & Conversions with A/B Test Images

Image A/B Test For More Conversions

An e-commerce platform may lose its business due to having too many images leading to extremely slow loading time or due to having the pictures of products from the wrong angles. Therefore, you may perform the following test to learn about the effectiveness of the images.

  • You may perform an A/B test between many and fewer images of each product, each category and each page.
  • You may test how many Thumbnails images can be featured under the image of each product without crowding a web-page.
  • Using the A/B test you can also learn if the higher quality or slow loading times are affecting the conversions on a website.
  • The A/B test can also inform what type or what angles of images are liked mostly by the viewers.

Use as Many Unique Images as Possible

Use Unique Images for Products

A majority of the eCommerce platforms use product images that are displayed on a manufacturer’s website, especially if there is a large product catalogue. However, Google does not generally display duplicate photos on search results, as one copy of an image is considered to be sufficient for a user. Hence, it is crucial to include unique images on the product pages of an eCommerce site.

It may not be possible to include unique images of each product, especially on large e-commerce sites. However, it is beneficial even if you can include the unique photos on some high-potential or high-performing pages. If you want to go an extra mile, then you can ensure that the images on your website can be differentiated from any image visible on image-search results.

Conclusion

An e-commerce site contains more images than any other website. Therefore, optimizing the images becomes a priority for any e-commerce website. Thus, these businesses need to pay closer attention to the image size and file names. For optimized images,

  • You may start with the inclusion of descriptive image names and ‘alt’ attributes. With this step, images can catch the attention of web-crawlers and accessibility of a website improves.
  • The next step is to implement a sitemap enabling the web-crawlers to have easier access and to keep the images as small as possible without sacrificing the quality, as it improves the loading time.
  • The third step is to use optimized thumbnails for upselling.
  • The final step is to use the A/B test to identify the best-preferred version of product images. And that will help to boost eCommerce sales and retain customers.

These image optimization tips can improve the ranking of an eCommerce site as well as the revenue.

divider

Creative Coming Soon HTML Template

Mass User Password Reset

Download this free ebook of

A Detailed Explanation Of The WordPress Platform

DOWNLOAD THIS FREE EBOOK OF

Website UI/UX guide for 2019

line

You have a visionWe know the way to get you there.