Graphic optimization on Amazon

In the following article, we provide an overview of the optimal formats, resolutions and peculiarities on the topic of images on Amazon.

General information about images and image quality on Amazon

What does @x2 and @x3 mean?

In web design, it is common to store multiple versions of an image on the server. This offers modern browsers the possibility to choose the resolution that fits the screen of the device used by the customer. Through various testings we have realized that this also plays a role for Amazon: By using images in higher resolution than specified, the output quality is higher on all screen sizes from desktop to mobile devices.

@x2 and @x3 stands for double or triple pixel dimensions of the required resolution, which provide even better image quality.

300 DPI or 72 DPI?

Dots per inch (DPI) is a value that originates from the printing sector. A higher resolution of 300 dots per inch increases the quality of the printed image enormously compared to 72 DPI. This is different in web design: here we talk about pixels per inch (PPI). The pixel dimensions of the image are far more important online than the resolution.

Amazon processes each image on the server side and always reduces the resolution to a “standard” that fits the device.

There is no visually noticeable difference online between 300 DPI and 72 DPI.

Graphic optimization of the Amazon image gallery

The image gallery contains the first and therefore most important images that can be seen on the product detail page on Amazon.

The task of the graphic designers is to understand the product and to recognize for which target group it is intended. Accordingly, the visual language is adapted to the target group, because customers should be able to identify with the respective product through visual communication.

Technical requirements

Basically, all images are processed by Amazon on the server side. This means that they are optimized for fast loading times. Example: Even if an image is uploaded as TIFF, the backend changes the file format to the web standard for images (JPG).

Caution: It can happen that files are interpreted incorrectly. For example, if a file is uploaded in the CMYK print color space, color deviations may occur when converting to the sRGB web standard.

Image types in the image gallery

Often you will find different types of images in the Amazon image gallery. We have named these types and collected their special features here.

Multipack

Often products are sold in so-called “advantage packs”. If this information is found only in the description, many customers do not notice it. Therefore, packshots have the task of standing out among the many other pieces of information. Through this photo, the immediate feeling of standing in front of a shopping shelf is awakened. The description on the box also makes immediately visible all the information that concerns the product. In this way, having to place the product 18 times on a picture is avoided.

USP Image

3 facts. This doesn’t sound particularly spectacular at first, however the magic number 3 can be found here. The number is considered active, which makes the design look dynamic. It provides perfect contrasts like “small-medium-large” to highlight more important information and lead the viewer’s eye along them. Additional photo-realistic elements enhance the overall image.

Mood Image

The purposeful use of colors to convey a feeling for the product is particularly evident in this example. In color theory, the colors beige and brown are considered warm and grounding, among other things. They trigger a feeling of security and comfort. What we particularly like about the implementation is the common thread that runs through the entire design concept. From the beginning to the end of the gallery, consistent image and graphic elements convey a sense of balance.

Tips and Best Practices

If you put a video in the Amazon image gallery, the number of images to be seen as thumbnails is reduced from 8 to 6, but the thumbnail of the video is now displayed.

Automatic cropping of images by Amazon

As already mentioned, Amazon processes the uploaded images on the server side. In the process, the algorithm removes “superfluous” white space. Even though it can create an advantage in ranking for the main image, it could lead to a jumping gallery for graphical layouts.

A jumping gallery results from the use of different image sizes. Due to the average height alignment of the image, elements of the layout jump.

Graphic optimization of A+ content

Differences between A+ and A+ Premium

Depending on whether a company acts as a vendor or seller on Amazon, there are differences in the creation of A+ content. Sellers can only use Enhanced Brand Content if their brand is registered on Amazon or if they are participants in a special program (such as Launchpad or Amazon Exclusive). Vendors, on the other hand, automatically get access to create A+ pages. 

The two models also differ in the number of A+ modules that can be placed on the page: While Vendors can select 5 A+ elements, Sellers and A+ Premium users can select 7 elements.

A+ Modules

Technical requirements

We have compiled the required minimum pixel dimensions for different types of A+ banners in this image as an overview.

We recommend uploading the minimum pixel dimensions required by Amazon in double (@x2) or triple (@x3) resolution.

Tips and Best Practice

Another approach to designing an A+ section represents the “One Page” concept. By using only full-width image modules, the use of text modules is eliminated and the result delivers smoothly flowing, branded content that immediately catches the eye and delivers high quality design.

By leaving the text blocks in the modules blank, the A+ content can be used as a pure image module. This offers the possibility to visually design landing pages in a one-page approach.