Images make a website clearer, more attractive and more user-friendly. But they are also one of the biggest causes of slow pages, and a missed opportunity when search engines can’t understand them. Image SEO is the work of preparing images so that they load fast, are understood by search engines, appear in image search and help users.
In this guide we explain what image SEO is and why it matters, how to name files, write alt text, choose formats, compress, set dimensions, use lazy loading, handle responsive images, include images in sitemaps and optimize e-commerce product images, with a pre-upload checklist.
What Is Image SEO?
Optimizing images on a website so that they load quickly, are accessible and are understood and ranked by search engines.
Why Is Image SEO Important?
It Supports Page Speed
Large images are often the heaviest part of a page. Optimizing them helps the page load faster; see Google PageSpeed Insights and Largest Contentful Paint.
It Supports Visibility in Google Images
Well-described images can bring traffic from image search.
It Improves the User Experience
Fast, clear images make pages pleasant to use, including on mobile; see mobile SEO.
It Increases Accessibility
Alt text helps people who use screen readers.
It Supports E-Commerce Sales
Good product images help buyers decide. See e-commerce SEO.
What Should the Image File Name Be?
Use short, descriptive, lowercase names with hyphens, such as blue-leather-wallet.webp instead of IMG_4821.jpg.
Rules for SEO-Friendly Image File Names
- Describe the image’s content
- Use hyphens between words
- Avoid spaces, special characters and long names
- Avoid keyword stuffing
What Is Alt Text?
A text description of an image in the HTML alt attribute. It is read by screen readers, shown if the image fails to load and helps search engines understand the image.
How to Write Alt Text
Describe what the image shows, briefly and naturally, in the context of the page. Example: “Woman testing a blue leather wallet in a store.” Don’t start with “image of” and don’t stuff keywords.
Should Decorative Images Have Alt Text?
Purely decorative images should have an empty alt="", so screen readers skip them.
Is the Image Title the Same as Alt Text?
No. The title attribute shows as a tooltip and isn’t a replacement for alt text.
How to Choose the Image Format
JPEG
Good for photographs; widely supported. Read what is JPEG.
PNG
Good for graphics with transparency and sharp edges; files can be large.
WebP
Smaller than JPEG and PNG at similar quality, with broad support.
AVIF
Often smaller still, with good support in modern browsers.
SVG
A vector format that is ideal for logos and icons and scales without losing quality. You can convert formats with the image format converter.
Image Compression
Lossy Compression
Removes some image data to reduce file size. Used on photographs at sensible levels, the loss is hard for users to notice.
Lossless Compression
Optimizes the file without permanently removing data. Better for logos, icons and images with sharp detail.
What to Watch When Compressing
- Decide the image’s use first
- Don’t use higher quality than needed
- Don’t blur images that contain text
- Check mobile and desktop views
You can use the image compression tool.
Image Dimensions and Responsive Images
Serve images at the size they are displayed; don’t upload a 4000-pixel photo to show at 400 pixels. Use responsive images (srcset, sizes) so that devices get appropriate sizes. See responsive web design.
Should Width and Height Be Added to Images?
Yes. Defining width and height lets the browser reserve space before the image loads, which prevents layout shifts as the page loads.
Lazy Loading
Load images below the fold only as users approach them, with loading="lazy". Don’t lazy-load the main image visible at the top (the LCP element).
Use a CDN
A CDN delivers images from servers closer to users, improving speed.
Image Sitemaps and Discovery
Make sure images can be crawled and can be found. Include important images in your sitemap if they are not otherwise discoverable, and don’t block them in robots.txt. Check coverage with Google Search Console and a crawler such as Screaming Frog.
Images and Context
Place images near the text that relates to them and use captions where useful. Original images, charts and infographics can earn attention and links. For writing around images, see how to write an SEO-friendly article.
Image Structured Data
Where appropriate, use structured data (for example Product, Article or Recipe) so that images can be eligible for rich results. See Google rich snippets.
Image SEO on WordPress
Use sensible upload sizes, a good optimization plugin and check what your theme outputs. See the most used WordPress plugins and what is WordPress.
E-Commerce Product Images
Use Multiple Product Images
Show front, back, side, close-up detail, usage and scale comparison.
Variation Images Must Be Correct
Show the right image for each color and model. A user who selects black and sees a white product loses trust.
Images Should Be Zoomable
Let users inspect materials and details.
Product Images Should Load Fast
With many product images, consider thumbnails, responsive sources, lazy loading, compression and a CDN. See how to set up an e-commerce website.
Image SEO Checklist
Before uploading:
- The image is resized to the right dimensions
- The file is compressed
- A suitable format is chosen
- A descriptive file name is used
After uploading:
- Alt text is written
- Width and height are set
- Lazy loading is used where appropriate
- The image is displayed well on mobile
For a complete review of a site, see technical SEO, on-site SEO optimization and our SEO consulting.
Frequently Asked Questions
Does image SEO matter?
Yes. It helps pages load faster, improves accessibility and can bring traffic from image search.
Which image format is best?
WebP and AVIF are good for photographs and graphics where supported; JPEG remains widely compatible; SVG is best for logos and icons.
How long should alt text be?
Short and descriptive, usually a sentence or less. Describe the image; don’t stuff keywords.
Should every image have alt text?
Every meaningful image should have alt text. Decorative images should have an empty alt attribute.
Should I lazy-load all images?
No. Lazy-load images below the fold, but not the main image at the top of the page.
