Check this page with an assistantOpens a chat asking it to summarise this article and name the evidence behind each claim.
Claude opens with the prompt on your clipboard: Anthropic does not support prefilled prompts on the web, and we would rather copy it than ship a button that drops it.
Image SEO Has Four Jobs
A useful image must be discoverable, understandable, visually valuable, and inexpensive to deliver. Optimizing only filenames or alt text solves one small part. Optimizing only compression can produce a fast blur. Treat the image, its landing page, and its delivery code as one search experience.
| Job | Primary control | Common failure |
|---|---|---|
| Discovery | Standard image HTML, crawlable URLs, links and sitemaps | Important image exists only as a CSS background |
| Understanding | Alt text, caption, filename, adjacent content, page topic | Keyword list describes neither image nor context |
| Visual value | Originality, relevance, composition, sharpness | Generic stock image contributes no decision value |
| Delivery | Responsive sources, dimensions, format, compression, priority | One oversized asset is sent to every device |
Google Images, text-result thumbnails, Discover, rich results, and visual product surfaces can all use imagery differently. No single setting guarantees selection. A representative, high-quality image on a useful page gives the system better options while improving the page for the person who actually arrives.
Make the Actual Image Discoverable
Google recommends standard <img> elements and can discover the URL in the src attribute, including an image inside a <picture> element. It does not index CSS background images as page images. Use CSS backgrounds for decoration; use semantic image markup for content people should find or understand.
Responsive delivery can use srcset, sizes, and <picture>, but retain a fallback src. Keep image URLs stable and crawlable. If a CDN hosts the files, make sure crawler controls, hotlink rules, authentication, and expiring signatures do not block the URLs. Google recommends verifying a CDN domain in Search Console when possible.
An image sitemap can expose assets a crawler might otherwise miss and can reference CDN-hosted files. It is most useful for large catalogs, galleries, JavaScript-heavy media experiences, and recently migrated libraries. Do not use it to compensate for landing pages that have no standard image markup or internal discovery path. The XML sitemap guide covers the canonical inventory and honest lastmod rules around that extension.
Write Alt Text for Meaning, Not for an Algorithm
Google uses alt text alongside computer vision and surrounding page content. The W3C frames alt text as a replacement for the image’s function or meaning in context. The same photograph can need different text on a product page, a news article, and a decorative banner because its job changes.
| Image role | Alt decision | Example approach |
|---|---|---|
| Informative photo | Briefly convey the meaning relevant to the page | “Walnut desk with cable tray viewed from the back” |
| Functional image link | Describe the destination or action | “Download the 2026 catalog” rather than “PDF icon” |
| Decorative texture | Use an empty alt attribute | alt="" prevents redundant noise |
| Complex chart | Supply a concise alt and the full information in text | Summarize the trend; provide the values nearby |
| Text already repeated nearby | Avoid announcing the same content twice | Use empty alt when the image adds no extra meaning |
Do not begin every description with “image of,” copy the entire caption, or insert a list of keyword variants. Alt text has no target character count. It should be concise enough to orient the user and specific enough to replace the image’s contribution. For a complex process or chart, the durable answer is real text or a data table on the page, not a paragraph trapped in an attribute.
Use Context, Captions, and Filenames in the Right Order
The landing page is a major image signal. Place the image beside the section it supports, use a caption when provenance or interpretation helps, and keep the page title and section heading accurate. A beautifully named file on an unrelated page remains poorly contextualized.
Google describes filenames as a light clue. Replace camera defaults such as IMG_0048.jpg with short descriptive names when practical, especially in a managed publishing workflow. Do not rename a mature image library and break URLs solely to add keywords. Stable referenced URLs and correct redirects can matter more than a prettier filename.
Original product angles, diagrams, before-and-after evidence, charts, maps, and process visuals can answer questions generic stock art cannot. The test is not whether the image is unique at any cost. Ask whether it changes understanding, confidence, or choice.
Serve the Right Pixels Without Sacrificing Quality
- Create variants at useful display widths. Let
srcsetandsizeshelp the browser choose an asset close to the rendered size rather than shrinking a 3,000-pixel original on a phone. - Choose format by content and support. AVIF and WebP can reduce photographic payloads; SVG suits appropriate vector graphics; PNG remains useful for transparency and exact pixels. Keep fallbacks where the audience or pipeline needs them.
- Compress to a visual threshold. Compare the output at its real display size. Product details and text in screenshots need more fidelity than an atmospheric background.
- Declare intrinsic width and height. Modern browsers can reserve the aspect ratio before download, reducing cumulative layout shift.
- Cache immutable image versions. Use a versioned URL when the file changes and a long cache lifetime for assets that do not.
Do not convert formats blindly. Transparent illustrations, line art, screenshots, and photographs compress differently. Automate sensible defaults, then preserve an exception path for images whose commercial or explanatory value depends on detail.
Lazy-Load Below the Fold, Not the Hero
Browser-level lazy loading is useful for offscreen images. It is harmful when applied to the likely Largest Contentful Paint image because the browser discovers and requests that important resource later. Keep the primary in-viewport image eager and available in the initial HTML; consider appropriate priority hints or preloading only after confirming the actual LCP resource.
Give lazy-loaded images explicit dimensions too. Without reserved space, content can move when media arrives and users can lose their reading position. Google’s current Core Web Vitals guidance identifies LCP, INP, and CLS as the user-experience metrics to monitor, with good thresholds of 2.5 seconds, 200 milliseconds, and 0.1 respectively.
Measure field data, not only a fast office connection. Search Console groups Core Web Vitals issues by similar URLs, while PageSpeed Insights can combine field and lab evidence. Test representative templates: product detail, category, article, location, and home pages often use different image systems. The Core Web Vitals playbook shows how to separate resource delay, main-thread work, and unstable geometry before choosing the fix.
Audit and Measure the Image System
Crawl templates for missing or empty alt attributes, but remember that empty alt is correct for decoration. Flag oversized transfers, missing dimensions, broken CDN URLs, CSS-only content images, duplicate generic filenames, offscreen images loaded eagerly, and in-viewport images delayed by lazy loading. Review samples manually because a crawler cannot decide what an image means.
In Search Console, use the Image search type to examine reported clicks and impressions, then connect landing pages to qualified actions. Also monitor image-driven product experiences and Discover where relevant. Annotate large media migrations. A decline after changing a CDN, URL pattern, or rendering component requires technical diagnosis before another round of alt-text editing.
Include image controls in the publishing checklist from the SEO content operations guide: ownership, source/license, dimensions, meaningful alternative, responsive outputs, representative metadata, and post-release validation.
Questions About Image SEO
- Does alt text help image SEO?
Yes, when it provides a useful text alternative. Google uses alt text with page context and computer vision to understand an image, and alt text is essential for accessibility. Describe the meaning the image contributes in its current context. Use an empty alt attribute for purely decorative images instead of stuffing keywords.
- Which image format is best for SEO?
No format ranks simply because of its extension. Choose the smallest format that preserves the required quality and browser support. Google supports common formats including JPEG, PNG, WebP, SVG, GIF, BMP, and AVIF. Delivery, sharpness, accessibility, crawlability, and landing-page relevance matter together.
- Should every image be lazy-loaded?
No. Lazy-load images below the initial viewport. Do not lazy-load the likely Largest Contentful Paint or other immediately visible hero image because that delays its discovery and rendering. Give all images explicit dimensions so the browser can reserve space and reduce layout shift.
- Do I need an image sitemap?
An image sitemap can help Google discover images it might not otherwise find, especially images loaded through unusual galleries or hosted on a CDN. It is an additional discovery path, not a replacement for standard image elements, crawlable landing pages, contextual text, and stable image URLs.
Primary Sources Reviewed
- Google Search Central: Image SEO best practices
- W3C Web Accessibility Initiative: Alt decision tree
- web.dev: Browser-level image lazy loading
- web.dev: Optimize Largest Contentful Paint
- Google Search Central: Core Web Vitals and Search
- Google Search Central: Image license metadata
Reviewed July 28, 2026. Browser image support, search surfaces, and performance recommendations evolve; validate formats and delivery decisions against current platform support.
