When you hear about “optimizing” product photos, you can interpret it two different ways depending on how familiar you are with digital photography and images. You might think optimization means a technique for taking the best types of photos for your eCommerce website. You might also think optimization refers to technical aspects that get your images ready for the internet, even if you don’t know much about them.

Both are correct, as both are types of optimization, although in very different ways. We’ll cover both in this eCommerce University lesson.

What Are the Best Types of Product Photos for an Online Store?

In previous lessons of our Introduction to Product Photography course, we’ve discussed the advantages of photography that isolates your products on a white background. We also briefly mentioned that you should take multiple photos of each product displaying it from different angles. But how many angles are necessary, and which ones?

Product Photos from Multiple Angles

Generally, a front, back, and side view are sufficient, but you may want to expand upon these to provide more detail and to make your products more enticing. Some products lend themselves well to 3/4-view photos, while others don’t need them. For example, a 3/4-view photo of a pair of shoes provides the type of additional information some customers are looking for, as they seek to picture themselves wearing the shoes and imagine how they’d look from different angles. But a 3/4-view image of a product like a wall poster would be pointless. In fact, you’d never need to show a poster from any angle except the front, unless it came with a built-in hanging apparatus on the back.

How about side views? Is one side view enough? Yes, unless the other side of the product is different from that shown in your first side-view photo. Shoes are another good example of this, especially sneakers which are often quite different on the arch of the foot versus the outside.

Ultimately, use your common sense when it comes to taking different-angled product photos. If displaying the product at a certain angle will either (1) expose more detail about the product, or (2) make the product look dynamic and interesting, or both, then take a product photo from that angle. Both are likely to increase sales.

Lifestyle Photos

Lifestyle photos are the exception to the white background rule. This type of photo shows your product in use or in an example environment. For example, most apparel retailers include photos of models wearing the available products while engaged in typical activities, like shopping, walking outdoors, relaxing, or playing sports. These photos can be seen in traditional apparel catalogs as well as online stores. The advantage of these photos is that they make it easy for the shopper to put themselves in the model’s position, using your products in day-to-day life.

A lifestyle photo of a product in an environment helps customers understand how the product will fit into their own environment. Furniture, lamps and lighting, entertainment systems and more are all prime candidates for these types of photos. Another good example is the poster we mentioned earlier — while it may be true that a photo of the back of a poster would be useless, the same poster could benefit from being shown on a wall alongside other posters and typical décor.

Scale Photos

Scale photos help show the size of a product by displaying it next to other items. To properly take a scale photo, you need to compare your product with an item your customers are familiar with. Some sellers use coins or other common objects for scale, but never be afraid to use something as simple as a ruler. Remember, you don’t want customers to think the “scale item” is included with the product!

Scale photos can depict a product next to a scaling item with the typical white background, or they can overlap with lifestyle photos by showing your product in a room with other items. The latter method is usually more effective, although the first method might be necessary for very small products.

For very familiar types of products where size isn’t really in question, you can skip the scale photos, especially if you have lifestyle photos. Customers will be able to get enough information from your other photos of that product.

Which Photos to Include?

If you’re going to use lifestyle and/or scale photos on a product page, don’t skip the “regular” product photography. If you’re using a modern eCommerce platform like 3dcart to run your online store, you have plenty of room for product photos. Include a complete set of regular product photos from all the angles you deem necessary, along with any lifestyle and scale images. The overall effect of this collection of product photos is very powerful, as it helps customers form a complete image in their minds of what owning and using your product will be like.

Technical Optimizations for Product Photo Image Files

When you take photos with a camera, they’re likely to be in a large format like a BMP (bitmap), EXIF (exchangeable image file format), TIFF (tagged image file format), or RAW (literally a “raw” camera image file). While some graphics software will let you work directly with these image formats to do your background removal and other editing, you need to save your images into an appropriate format for use on the web.

First, you must understand the difference between a lossy file format and a lossless file format. “Lossy” formats have that name because they result in a loss of quality from the original, while lossless files do not. This loss can be invisible to the naked eye, but you should still be aware of it.

Repeatedly saving an image in lossy format will continue to reduce quality with each save. For example, some smartphones save images directly into .jpg format, but .jpg is a lossy file type. If you edit a .jpg image directly and save it as a .jpg again, you’ll lose quality each time you do this. You can get around this issue in the following way:

1. Open the .jpg you need to edit with graphics software like Photoshop.
2. Before you edit the .jpg, save a copy as a different format. In the case of Photoshop, this is a .psd file. Doing this will also give you access to all the graphics editing tools that you couldn’t normally use directly on a .jpg image.
3. Perform all your edits in the .psd file (or other working format). While you do this, you can save your work freely.
4. When your edits are complete, save your working file normally and then select “Save As…” or “Export” from the menu, and choose .jpg or another web-friendly format from the list.

If you need to edit .jpg files directly and you can’t save them as a working file type first, you can still avoid quality loss by saving your edited .jpg into a lossless format. A good choice for this is .png, as it provides lossless quality and is friendly for display on web pages.

Creating Internet-Friendly Image Files

The .jpg and .png formats are both perfect for use on the internet. Since .jpg is a lossy format, it results in smaller file sizes — and if you’re careful, you won’t lose too much quality. The .png format is much newer, lossless, and also supports more image data including transparency. File sizes are larger than with .jpg, but rarely large enough to cause problems.

Regardless of whether you save your files in .jpg or .png, you need to take a few additional steps to make them web-friendly. These involve optimizing the size and resolution to appear on a computer screen or other device.

Image size is measured in pixels, such as 1200×800 (an image 1200 pixels wide by 800 pixels tall). Resolution is measured in pixels per inch (ppi). Both affect the size of the image as it appears on your screen, and the speed at which the image is loaded and displayed. Large, high-resolution images enable close viewing of tiny details, but can also drag your website’s loading speed down to intolerable levels.

People who are familiar with the process for printing images are often likely to overestimate the resolution online images need to be. Print resolution is usually 300 dpi (dots per inch — like ppi for printers), but a 300 ppi image is unnecessarily large for a computer display. 72 ppi is the ideal resolution for online images, no matter their size.

The process of changing an image’s size in pixels is called resizing while the process of changing the ppi resolution is called resampling. Nearly all graphics programs allow you to resize and resample images, often in the same menu. You’ll be able to choose your desired image size and resolution together by entering the target numbers into text fields, but check that changing one option doesn’t change the other. If this happens, just change them in a different order.

When changing image size, you’ll also see a check box to lock or preserve the aspect ratio, which means you only have to change one of the image’s dimensions and the other will automatically resize to keep the image in proportion. If you don’t lock the aspect ratio, you can end up with a stretched or squashed image.

So now that you know how to change them, what’s the best image size and resolution for your online store? As we mentioned, 72 ppi is the best resolution. As far as pixel size, for regular product photos, keep the image’s longest dimension between 600 and 800 pixels. There are occasional exceptions to this image size, such as uploading larger images to allow customers to zoom closely into your product photos, if your eCommerce software supports image zoom.

Depending on your eCommerce software, you may be able to skip part of the image resizing process. For example, 3dcart has an option to automatically resize images when you upload them, but you should still be familiar with the process and what it means.