Image and Media Optimization: AVIF, Google Lens and Visual Search

Images are not decorative extras. They are a search channel of their own and a direct performance factor. They help decide whether a page reaches its Largest Contentful Paint quickly, whether it shows up in Google Images and Google Lens, and whether multimodal AI systems can make sense of the image content at all. At the same time, image SEO is one of the most neglected areas of technical on-page work. This article shows how modern image formats, correct alt texts, Core Web Vitals optimization and structured data work together, with a concrete focus on mobile usage in Austria.

Why image SEO determines visibility and performance

The economic lever behind image and visual search is measurable. The global visual search market was valued at USD 41.72 billion in 2024 and is projected to reach USD 151.60 billion by 2032, a CAGR of 17.50% (global). The main driver is Google Lens: according to Google, more than 1.5 billion people use Lens every month (international) to search what they see. Usage frequency is even higher than the user count: in October 2024, Google reported nearly 20 billion visual searches per month, with 20 percent of all Lens searches being shopping-related (international). For B2B suppliers of products, machines or components, this is a real discovery channel that starts with the physical object itself.

On the technical side, images are the dominant performance factor. According to the Web Almanac 2025, an image is the LCP element on 76% of mobile and 85.3% of desktop pages (international). This means that in most cases, the load time of the largest image directly determines whether a page passes the Core Web Vitals threshold for LCP. If you don't optimize your images, you don't optimize your Core Web Vitals.

Even so, a lot of potential goes unused. According to the Web Almanac 2024, 45 percent of all img elements have no alt text, and only 55 percent have a non-empty alt attribute (international), and many of the existing alt texts contain only file names or meaningless short strings. That is an SEO gap and an accessibility problem at the same time, and it opens up a competitive advantage for anyone who does better.

How it works: how search engines and AI interpret images

Search engines and multimodal AI systems understand images through three signal layers that work together.

• Textual context: Alt text, caption, file name and the surrounding body text provide the verbal description of the image content. This layer matters most for classic image SEO and for citability in AI answers, because machines can read it reliably.
• Visual analysis: Google Lens and image recognition models analyze the image itself and detect objects, text in the image and similarities to other images. This requires sharp images with sufficiently high resolution.
• Structured data: Schema markup such as ImageObject or Product places the image in a semantic context, links it to license, creator and product information, and enables rich results in Google Images.

For Generative Engine Optimization (GEO), the textual layer is decisive. Multimodal AI systems such as Google Lens, AI Overviews and AI answer engines combine image analysis with alt text and caption to understand the context and name a source. An image without descriptive alt text and without a caption gives the AI no verbal anchor it could use to cite the page. If you want to appear in AI answers with image content, treat image and text as one unit.

Alt text has a dual function: it is the text alternative for screen readers (accessibility under WCAG) and at the same time a ranking signal for image search. Both goals require the same thing: precise, descriptive wording in the context of the page, without keyword stuffing. A good alt attribute describes what the image shows, the way you would explain it to someone on the phone.

Best practices for image and media optimization

Write descriptive, context-aware alt texts

Phrase the alt text so that it reflects the image content in the context of the page. Bad example: alt="IMG_4087.jpg" or alt="product-photo-final-2". File-name alt texts like these are exactly the problem the Web Almanac documents, and they are worthless for screen readers and search engines alike. Good example: alt="Stainless steel screw conveyor FS-200 in use in a food production plant". Avoid keyword stuffing and phrases like "image of" or "photo of", because screen readers already announce the img role. Purely decorative images get an empty alt attribute (alt="") so screen readers skip them.

Use modern image formats deliberately

AVIF is the technically superior compression standard. According to a widely cited international comparison, AVIF achieves a 50.3% smaller median file size than JPEG at the same visual quality, and WebP a 31.5% smaller one (international), which gives AVIF a lead of around 27 percent over WebP. The practical format logic:

• AVIF: First choice for photos and complex images, with the best compression at the same quality. Encoding is more compute-intensive, so it is best precomputed in the build or by a CDN.
• WebP: Solid all-rounder with near-universal browser support, ideal as the middle fallback tier.
• JPEG/PNG: Universal fallback for maximum compatibility. Use PNG only for images with transparency or sharp edges; otherwise JPEG is smaller.
• SVG: For logos, icons and diagrams, because it scales without loss and is usually very small.

AVIF adoption is growing, but it is still early. According to the Web Almanac 2024, image formats on mobile break down into JPEG 32.4%, PNG 28.4%, GIF 16.8%, WebP 12% and AVIF just 1.0% (international). That gap is the opportunity: the chapter notes that almost all JPEGs, PNGs and GIFs on the web would benefit from a modern format.

Deliver AVIF with a picture fallback

Don't use AVIF without a fallback. The <picture> element serves each browser the best format it supports:

```html
<picture>
<source srcset="product.avif" type="image/avif">
<source srcset="product.webp" type="image/webp">
<img src="product.jpg" alt="Screw conveyor FS-200 in production"
width="1200" height="800" loading="lazy">
</picture>
```

The browser picks the first format it supports. To generate the variants, you can use tools such as Squoosh (manual), the Sharp library (programmatic, in the build pipeline) or build plugins and framework components such as next/image, which automate format negotiation and responsive sizes.

Responsive images with srcset and sizes

Deliver the right resolution to every device. With srcset width descriptors and sizes, a smartphone loads a smaller file than a desktop. CDN-based image transformation generates these variants on the fly and negotiates the format via the Accept header. Get the cache headers right: versioned image URLs get a long max-age in the Cache-Control header. MDN recommends Cache-Control: max-age=31536000, immutable (one year) for this. That way, returning visitors load images from the cache.

Prioritize the LCP image, never lazy-load it

The LCP image (usually the hero image above the fold) has to load as early as possible. Set fetchpriority="high", add a preload if needed, and always remove loading="lazy" from this image. Lazy-loading the LCP element is an anti-pattern that slows down every page. Also reserve the space in the layout with width and height (or aspect-ratio) to avoid Cumulative Layout Shift (CLS). Lazy loading is still right, but only for images below the fold.

Optimize for Google Lens and visual search

Visual search rewards high-quality, well-described product images. Specifically:

• High resolution and sharpness: Lens analyzes the image itself; blurry or undersized images make object recognition harder.
• Structured data: ImageObject and Product schema link image, product name, price and availability, which enables rich results in Google Images.
• Image sitemaps and indexable URLs: Images must be reachable via a stable, crawlable URL and belong in the XML sitemap so Google picks them up reliably.
• Context text and metadata: The caption and surrounding text give Lens and the AI the verbal context; EXIF/IPTC metadata can carry creator and license information.

Technical image SEO and schema markup

Use descriptive file names (screw-conveyor-fs-200.avif instead of img4087.avif), place images in the text section they belong to, and add visible captions where they help the content. For rich results in Google Images, ImageObject schema with license and creator metadata (license, creator, copyrightNotice) is relevant, complemented by Product schema for products. This way, images get indexed and also carry usable additional information.

Mobile-first: the example of Austria

Desktop is ahead, but the mobile share is still substantial: according to StatCounter, in Austria in May 2026, mobile accounted for 41.74%, desktop for 56.71% and tablet for 1.55% (Austria). So just over four in ten page views come from smartphones, often over mobile networks with limited data plans and fluctuating bandwidth. Every kilobyte saved improves load time and conserves users' mobile data, which directly affects bounce rate and conversion. AVIF and responsive delivery pay off especially for these visits.

Common image optimization mistakes

• File name as alt text: alt="DSC_0421.jpg" is worthless for screen readers and search engines and one of the most common mistakes on the web.
• Missing alt text: A completely missing alt attribute gives away a ranking signal and accessibility at once.
• Lazy-loaded LCP image: Delaying the most important image with loading=lazy measurably slows down LCP.
• No width/height: Without reserved dimensions, the layout jumps when the image loads, which worsens CLS.
• AVIF without a fallback: AVIF without a <picture> fallback risks an image that doesn't display in older environments.
• Keyword stuffing in alt text: Strings of keywords instead of a real description hurt accessibility and rankings.
• Images missing from the sitemap: Google often doesn't index images reliably if they are not referenced or are loaded via JavaScript.

Metrics and measurement

The impact of image optimization shows up in concrete metrics:

• LCP (field data): Measure Largest Contentful Paint from Google Search Console and CrUX. Because an image is the LCP element on 76% of mobile pages, every image optimization has a direct effect here.
• CLS: Check Cumulative Layout Shift, which typically rises when image dimensions are missing.
• Lazy-loading audit: Make sure the LCP image is not lazy-loaded. The Web Almanac 2024 shows that 9.5 percent of LCP-relevant img elements on mobile are incorrectly loaded with native lazy loading, with native lazy loading adopted on around one third of all websites.
• Alt text coverage: Crawl the site for non-decorative img elements with a missing or empty alt attribute. The benchmark is the documented share of 45 percent of img elements without alt text, and you should stay well below it.
• Image file sizes and format: Monitor the delivered format and the bytes per image to track the AVIF/WebP share and the savings.
• Image search visibility: Track impressions and clicks from Google Images in Search Console as an indicator of visual search performance.

Further reading

Image and media optimization combines three on-page disciplines: technical performance (Core Web Vitals), accessibility (alt texts) and semantic markup (schema). The pragmatic starting point: identify the LCP image of every important page, deliver it as AVIF with a <picture> fallback and fetchpriority="high", write descriptive alt texts and reserve the layout space with width/height. In a second step, add responsive srcset variants via a CDN, ImageObject/Product schema for image search and image sitemaps for reliable indexing. In Austria, where just over four in ten page views come from smartphones, every kilobyte saved contributes directly to load time and conversion. Related topics include Core Web Vitals and LCP optimization, on-page schema markup, featured snippets, and GEO and citability in AI answers.