Image Size Matters

ESTIMATE 1-MINUTE READ

Overweight Pages

When the World Wide Web began, images were a luxury. Using slow dial-up connections, people were optimizing bytes. The Internet evolved, and between 1990 and 1995 we saw more pictures. Website designers strived to keep total page size below 100 kilobytes.

Image Diet

The increase in available bandwidth is bringing about more complex pages with lengthy text, multiple programming scripts, and larger images. It is not unusual for a single page to exceed a megabyte of data. This does not mean that web designers should be careless about the size of photos. An optimal size is under 300 kilobytes per page. There are many ways to optimize and minimize files.

Image Size Matters

You can save a dimensionally large image with less (softer) detail to make it smaller. On a scale of 1 to 100, the quality may be between 10 and 40. Actual compression value is dependent upon amount of detail within an image. Artifacts may not be suitable for quality printing, but for the web, it is fine.

Images can include progressive loading. There are ways to delay processing of individual images lower on a grid until someone scrolls down to them.

Some tools like tinyjpg.com or shortpixel.com can compress the size of images without sacrificing quality or changing dimensions. With masking, you can blur areas of your images within Photoshop prior to saving an optimized JPEG. There are also plugins for Shopify that compress images you have already uploaded. (This might change image file names.)

Lazy loading images is also popular. Various asyn­chro­nous javascript techniques display images only when a user scrolls to it.

Bigger Is Better

This brings us to the main point of the article. Your commerce website needs big product images. This is not only so shoppers can see details. It is because more people are using visual search features of Google.

You type in a keyword and related images show up above text matches. So people click to see the matching images. These are often filtered by size. Is your product visible when someone is looking a large image search results?

Ten years ago, the ClinicalPosters website was satisfied with 400 pixel images. A half dozen years later, they were bumped up to 600 pixels. In 2020, over 5000 product photos are now between 800 and 1000 pixels. Earlier this year, images were audited and optimized to reduce page load time.

Part of your site engine optimization should include increasing the dimensions of properly compressed images. This will make your website more popular and bring in more visits.

Main photo by Jennifer Enujiugha from Pexels.

Kevin Williams is a Shopify Partner that has been program­ming data­base systems since 1990 and writing since 2010, before main­tain­ing an e-commerce site in Perl. Along with him, explore the Shopify platform and Liquid programming with marketing and writing tips.

Include Meaningful Comment