Images are extremely vital to any eCommerce business, and are probably the most significant contributor to your conversion rates.
People love to look at great images to get excited about buying a product, so there’s plenty of incentive to make appealing products that are optimized not only for your customers, but also for search engines.
But this can be tricky– because of search engine optimization.
Search engines prefer pages that load fast, but eCommerce sites are dependent on high quality product images, which can be very large and high resolution.
So there’s an obvious conflict here, search engines want one thing, but users want another.
What’s the best play here? Having the most optimal images possible that are low in file size, high in resolution, and search engine friendly.
In this post we’ll go over how to get optimal images for your website that are high resolution, but most importantly load fast for search engines that are optimized for SEO.
The Best Resolution and Shape for Product Images on Shopify
Shopify, similar to both Etsy and Amazon Images, prefer that you keep all your product photos as squares.
Squares work best when listing out product category grids, they work well with mobile devices, they are just the smartest way to go about creating your product images.
So be square, and don’t deviate for the sake of being original.
Next up is resolution.
You want your product to feature high resolution images, because they look good.
However, there are some limits and even disadvantages to going too large.
When your image has too high of a resolution (greater than 4000 x 4000 pixels), then the zoom function won’t work properly on mobile, and the image size will be too large without any real benefit.
Therefore, to get the best resolution for images that are a reasonable file size, can utilize Shopify’s built-in zoom function, and work well on mobile devices, you should aim for 2000 x 2000 pixel images for all of your product images on your site.
So let’s recap:
- Make all of your product images squares.
- Make all of your product images 2000 x 2000 pixels for optimal zoom, resolution, and mobile functionality.
There are many ways to adjust resolution and crop your images down to 2000 x 2000 pixel squares for free. You can use standalone free programs like Canva or GIMP, or use the classic Photoshop if you have it.
Overall simple enough, but having all your images being 2000 pixels and having multiples of them on a single page can lead to having a lot of high resolution, large file-size images on a single page is bad for search engine optimization.
So what are we to do? Optimize.
Optimize Images that can Serve People AND Search Engines
You NEED high resolution images for your eCommerce website, but high resolution images come along with large file sizes, so that presents a bit of a problem for search engines.
The solution to this is image optimization.
Optimizing images is actually extremely simple to do (and free!).
Before we talk about how to optimize images, let’s talk about image types and what’s most optimal.
There are a lot of image types on the internet, including (but not limited to):
- JPG or JPEG. The classic image you see almost everywhere, these make up a majority of pictures and images you see online.
- GIF. Typically used for animated pictures or simple images without a lot of varied colors.
- PNG. Similar to GIF but not typically used with animation, it has more color support but comes at a higher resolution.
- TIFF, PSD, EPS, PDF, AI, and others. You usually won’t see these types of images often used, they are mostly for working within photo editing programs or parts of a webpage that aren’t used for pictures.
Ultimately when it comes to product images, you’re going to want to decide between PNG and JPG.
PNG are great because they are a lossless file format that produces perfect images without any imperfections, artifacts or blurriness.
And while you can compress a PNG image with optimization tools, the compression offered isn’t really significant and will result in a product page that has images that are too large in file size (although they will look great).
That pretty much leaves us with JPG as the only feasible format.
But that’s totally fine! JPG images look great when handled properly, and they can be optimized to a fraction of the file size they are created at.
In my opinion, the best way to optimize your images is to run them through an online JPG compression tool. They are fast, free, and if you’re not doing hundreds of product images at once, you’ll never need a paid version of any tool to get a JPG compressed.
The Best JPG Compression Tools
The most straightforward, simple, and fast online JPG compression tools I’ve used are TinyJPG and Compress JPEG. With both of these tools you can dump your JPGs into the tool and it’ll spit them back out compressed with no loss of detail. You can even sometimes get 90%+ file size reduction!
There are Shopify apps that will automatically compress your images as you load them into the platform, but if you start compressing your images early and always remember to take a few seconds to optimize new images as they are made, you’ll never need to pay money for something that you can easily do for free.
SEO Optimize Your Images Even Further
We want to squeeze maximum value out of our images, so that leaves 2 more areas of optimization: image file names and alt-text.
Image File Name SEO
The file name is what you save your file as, so typically it will look something along the lines of IMGB6737_38 or similar.
Your image file name has SEO value, so give it a more descriptive name that succinctly describes what it is, something like green-peak-mens-shoe-front.jpg, which will have some keywords you’re targeting but also actually describes the image.
Doing this will give your image a potential image search boost, and helps contextualize your product page overall.
Going off our shoe example from earlier, we can see this shoe image file name is “Woodland_RightInside_1024x1024.jpg
A few improvements they could make on it:
- Use hyphens in your file name, not underscores. A better name would be Woodland_Shoe_Leather_Right_Inside.jpg
- 1024x1024 is too small a resolution. It needs to be 2000 x 2000, so the zoom function will work better.
Beyond that, we have alt-text.
Alt-text on Images for SEO
Alt-text’s main purpose is to be a guide for the visually impaired, so that they know what an image is about if they’re not able to see it.
Therefore, if you want to write good alt-text, simply write a few short words or a short sentence exactly what your image is in detail.
“Model wearing green Peak shoes facing forward” is an example of a descriptive alt-text.
Alt-text has SEO value, so it’s good to make sure every image has alt-text.
Summary of all Shopify Image Optimization
- JPG/JPEG as your file type for images.
- 2000 x 2000 pixel square images for everything. Free apps for editing photos include Canva or GIMP.
- Compress every image you have in a JPG compression tool. Free tools include TinyJPG and Compress JPEG.
- Descriptive file names that contain keywords for SEO. Use hyphens to separate words, not underscores.
- Write long alt-text that exactly describes what’s going on in your image, also for SEO.
If you take these steps for your images, you will have a store that loads quickly, is optimized fully for search engines, and will give your users with a seamless experience.
