Image SEO for E-Commerce: Alt Text, File Names and Compression
Product images do more than show customers what they are buying. When properly optimised, they drive traffic from search engines, improve page speed, and enhance the overall shopping experience. Google Images accounts for a substantial share of all search traffic, and for e-commerce sites selling visually distinctive products, image search can be one of the largest sources of new visitors.
Despite this, image optimisation is one of the most commonly neglected aspects of e-commerce SEO. Studies have found that over a third of websites still upload oversized images that slow down their pages. Every unoptimised image is a missed opportunity -- for traffic, for conversions, and for accessibility.
This guide covers the three pillars of image SEO: alt text, file naming, and compression. Get these right and your product images will work harder for your business.
Alt Text: More Than an Accessibility Requirement
Alt text (alternative text) is the written description attached to an image in HTML. It was originally designed for accessibility -- screen readers use it to describe images to visually impaired users -- but it has become a meaningful SEO signal as well. Search engines cannot see images the way humans do, so they rely heavily on alt text to understand what an image contains and how it relates to the surrounding content.
How to Write Effective Alt Text
Good alt text is descriptive, concise, and natural. It should accurately describe the image while incorporating relevant keywords without forcing them in awkwardly.
| Poor Alt Text | Better Alt Text |
|---|---|
| IMG_4821.jpg | navy blue leather crossbody bag with gold buckle |
| product photo | stainless steel insulated water bottle 500ml in matte black |
| shoe | men's brown suede desert boot side view |
| buy now best price cheap widget | wireless bluetooth earbuds with charging case in white |
Alt Text Best Practices for E-Commerce
- Be specific. Include the product type, colour, material, and any distinguishing features. "Red cotton cushion cover with embroidered floral pattern" is far more useful than "cushion."
- Keep it under 125 characters. Screen readers typically truncate alt text beyond this length, and search engines give diminishing weight to overly long descriptions.
- Avoid keyword stuffing. Writing "blue wallet mens wallet leather wallet best wallet" helps nobody. Describe the image naturally.
- Do not start with "image of" or "picture of." Screen readers already announce that the element is an image, so this is redundant.
- Make each alt text unique. If you have five images of the same product from different angles, describe each one distinctly: "front view," "interior pocket detail," "side profile showing stitching."
Alt Text and AI Search
With the rise of AI-powered search experiences and generative search results, alt text has taken on additional importance. AI systems use image metadata -- including alt text, captions, and file names -- to understand and contextualise visual content. Well-written alt text increases the likelihood that your product images will appear in AI-generated search summaries and visual results.
File Names: A Small Detail With Real Impact
Image file names are a confirmed ranking signal. Google uses them to understand image content, particularly when other context is limited. Yet the majority of product images are uploaded with default camera file names like "DSC_0042.jpg" or "Screenshot 2026-03-15."
File Naming Rules
- Use descriptive, keyword-rich names. Rename every image before uploading. "mens-navy-polo-shirt-front.webp" tells search engines exactly what the image contains.
- Separate words with hyphens. Google treats hyphens as word separators. Underscores are not treated the same way, so "blue-wool-scarf" is preferable to "blue_wool_scarf."
- Keep names concise. Three to five descriptive words is the ideal range. Long file names with excessive detail are harder to manage and offer diminishing returns.
- Include product attributes. For e-commerce, a good pattern is product-colour-size-variant. For example: "ceramic-plant-pot-terracotta-large.webp."
- Use lowercase letters. This avoids potential issues with case-sensitive servers and keeps your file structure clean.
- Avoid special characters. Stick to letters, numbers, and hyphens. Spaces, ampersands, and other characters can cause problems with URLs and content delivery networks.
File Names in the AI Era
As search evolves toward AI-driven results, file names carry additional semantic weight. Generative search systems embed file names as part of an image's metadata, meaning the words in your file name can influence how your image is interpreted and surfaced in AI summaries. Descriptive file names are no longer just good practice -- they are a competitive advantage.
Image Compression: Speed Without Sacrifice
Images typically account for sixty to seventy per cent of a web page's total file size. Uncompressed or poorly optimised images are the single biggest cause of slow-loading product pages, and slow pages directly cost you sales.
Google's Core Web Vitals metrics, particularly Largest Contentful Paint (LCP), measure how quickly the main visual content loads. Pages that fail these benchmarks are penalised in search rankings. Optimised images can improve loading times significantly while maintaining the visual quality customers expect.
Compression Types
- Lossy compression reduces file size by discarding image data that is imperceptible or barely perceptible to the human eye. At eighty per cent quality, lossy compression typically reduces file sizes by seventy to eighty per cent with no visible quality loss. This is the right choice for product photographs.
- Lossless compression reduces file size without discarding any data. The reduction is more modest -- typically twenty to forty per cent -- but the image is preserved perfectly. This is more appropriate for graphics, logos, and images with text.
Image Format Selection
| Format | Best For | Compression | Browser Support |
|---|---|---|---|
| WebP | General product images | 25-35% smaller than JPEG at equivalent quality | Universal (all modern browsers) |
| AVIF | Maximum compression needs | Up to 50% smaller than JPEG | Growing (Chrome, Firefox, Safari 16+) |
| JPEG | Fallback and compatibility | Good with lossy compression | Universal |
| PNG | Images requiring transparency | Larger files, lossless only | Universal |
WebP is currently the best all-round choice for e-commerce product images. It offers excellent compression, supports both lossy and lossless modes, and works in every modern browser. For sellers who want the smallest possible file sizes, serving AVIF with a WebP fallback using the HTML picture element is the most forward-looking approach.
Compression Targets
As a general guideline, aim for product images under 100 kilobytes each. Hero images and large lifestyle shots may be slightly larger, but individual product thumbnails and gallery images should be well below this threshold. PixelPrep handles image resizing and preparation for e-commerce platforms, helping you maintain quality while keeping file sizes in check.
Technical Implementation
Beyond the three core pillars, several technical practices support image SEO and performance.
Lazy Loading
Lazy loading defers the loading of images that are not immediately visible on screen. Instead of loading every image when the page first opens, images are loaded only as the user scrolls toward them. This significantly improves initial page load time.
Implementing lazy loading is straightforward. Adding the attribute loading="lazy" to your image tags tells the browser to defer loading for off-screen images. For the main product image that is visible immediately, use fetchpriority="high" instead to ensure it loads as quickly as possible.
Responsive Images
Serving the same large image to both desktop and mobile devices wastes bandwidth on smaller screens. The srcset attribute allows you to specify multiple image sizes, letting the browser choose the most appropriate one for the device.
Width and Height Attributes
Always include explicit width and height attributes on your image tags. Without them, the browser does not know how much space to reserve for the image before it loads, causing the page layout to shift as images appear. This layout shift is measured by the Cumulative Layout Shift (CLS) metric in Core Web Vitals and negatively affects both user experience and search rankings.
Image Sitemaps
For e-commerce sites with large product catalogues, a dedicated image sitemap helps search engines discover and index all your product images. This is particularly valuable for new products or images that might not be easily found through standard page crawling.
Structured Data
Including product images in your structured data markup (Schema.org Product type) increases the chances of your images appearing in rich search results. Include multiple image angles in your product schema for maximum visibility.
An Ongoing Process
Image SEO is not a one-time task. As you add new products, update existing listings, and expand your catalogue, each new image needs the same attention to alt text, file naming, and compression. Build these steps into your product listing workflow so they become automatic rather than an afterthought.
Audit your existing images periodically. Check for missing alt text, oversized files, and default camera file names that slipped through. Even improving the optimisation of your top-selling products can deliver a noticeable boost in organic traffic and page performance.
The effort required is modest. The returns -- in search visibility, page speed, accessibility, and ultimately conversions -- are substantial.