What is the Best Size for Ecommerce Product Images?

Good product images move merchandise on ecommerce sites. It’s a fact.

Yet it takes a lot of time to produce good ecommerce product images, unless you take the easy way and simply use whatever the manufacturer or distributor can send you. (If you do, your product pages will closely resemble the other sites using the exact same images).

Size is one of the most important characteristics of good product photography. (For the sake of this article, I’m talking about physical dimensions, not resolution). Assuming you’ve staged and lit the product effectively in your photos, taken sharply focussed images, and don’t have to do any PhotoShop work beyond cropping, the last two issues are file type and image size. While you’re likely going to choose between .png and .jpeg for file type., what is the best size for ecommerce product images?

In general, ecommerce sites use three sizes (the numbers below refer to pixels):

Small: Thumbnails

These are small (100 x 100 or 200 x 200) images that appear in product category or site search results listings. They are usually just large enough to convey shape, design and color. Clicking on the thumbnail launches either a dedicated product page (with a larger, full-sized image), or just the larger image.

Medium: Product pages

Every product needs good product page-quality images. These images (usually 640 x 640 or 800 x 800) should show the various perspectives of the item such as front, side, underneath, etc. Here is a great 880 x 667 picture from MarthaStewart.com.

What's the best size for ecommerce product images? 

Detail Views/Zoom

Depending on the product category, detailed close-ups are super important. Any products where fabric, surface texture, patterns, colors or manufacturing details are part of the product value and evaluation criteria require zoom functionality. You can do this in a couple of ways; take separate close-up shots, or integrate click-to-zoom or mouse hover functionality. 800 x 800 and 1000 x 1000 are plenty big enough for mouse hovers.

Fast fashion retailing giant Zara uses huge close-up photos that fill your screen. The Bird’s Eye suit page has six photos, all of which you can click to produce a closer view. In contrast, athletic footwear brand Saucony has used mouseover closeups for several years. Here is an example:

Best practices for ecommerce product images

Platform Restrictions

Many ecommerce platforms have their own photo size restrictions that supersede what you just read. For example, LightSpeed’s Point of Sale application restricts maximum image size to 512 x 512. If you load a 1000 x 1000 image,  it is automatically reduced to a maximum of 512 X 512.

Shopify’s own recommendations are 1024 x 1024 at 72 dpi (dots per inch resolution). While this is the recommendation, the platform does support product images up to 2048 x 2048.

Magento recommends three different image sizes. A 50 x 50 thumbnail works for the thumbnail gallery, shopping cart, and Related Items suggestions. A 370 x 370 “Small Image” is recommended for listings on category and search results pages, as well as the Up Sells, Cross Sells, and the New Products sections. The main image on the product details page is referred to as the Base Image. 370 x 370 is the base non-zoom size, while 1100 x 1100 is recommended for image zoom situations.

Yahoo! Merchant Solutions restrict uploads to 2000 pixels in width or height.

Wix has two formats, 200 x 200 for the gallery images sizes and 400 x 400 for product pages. What’s interesting about Wix is the insistence that all images have an image ratio of 4:3. (They’re pretty rigid about this requirement).

What is the Best Size for Ecommerce Product Images?

The short answer is the one that works for your site. If you’re one of the millions of retailers hosted on platforms, your options are limited by the vendor. Whatever you choose, however, standardize on your categories. If you’re going to use thumbnail, product and zoom categories, pick three sizes (one for each category) and stick with them.

Clip to Evernote

11 Responses to “What is the Best Size for Ecommerce Product Images?”

  1. Nice article Nigel, for each of these providers listed above do you need to upload multiple images of different sizes or do they resize them for each requirement?

    Reply
    • Hi Richard,

      In most cases, the platforms will automatically handle image resizing based on the settings of the templates. This makes things much more convenient for the store owners – as when they do any site updates later that require different image sizes, things are routinely automatic. It isn’t this way in all cases, but almost always the case for product images specifically. Thanks for the read!

      Reply
  2. I am planning to open an online supermarket (Grocery & others) with only Android and iOS mobile apps and not Web application. The store is developed on Magento Community Edition Version 1.9.2.4 Will you please tell me what size, resolution and bytes of photographs I should use in order to balance between the quality of pictures and loading time on mobile app.

    Reply
    • Size of images in a mobile app is best answered by your App designer and developer. They will want to designate image options in the app according to their placement and function.

      Reply

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>