Image Optimization for SEO

Image optimization for speed and search

Images are the heaviest part of a typical store page. They are the most common reason the largest contentful paint metric, by which search engines assess speed, comes out poor.

What is included

• compression without visible quality loss;
• conversion to modern formats with fallbacks for older browsers;
• correct dimensions: a 3000-pixel image scaled down to 300 by CSS is the most widespread and most expensive mistake;
• lazy loading for anything below the fold;
• loading priority for the page's main image;
• explicit dimensions in the markup — so the layout does not jump;
• alt attributes for image search.

What delivers the biggest effect

Not compression, as people usually assume, but correct dimensions. A store serving camera originals and shrinking them with CSS transfers tens of times more data than necessary. No amount of compression compensates for that.

Second by effect is priority for the main image. If the browser loads it last, the metric will be poor even with light files.

For stores specifically

Thumbnails must be generated once and stored, not created on every request. Otherwise the arrival of a search crawler takes the server down: it requests hundreds of pages and each one forces image generation from scratch.