Images Compressed (WebP/AVIF Format)

Issue No: 22

Category: Image Analysis

Issue type: Issue

Priority: IMPORTANT

Description

Verifies whether page images are delivered in modern compressed formats such as WebP or AVIF instead of legacy-heavy formats (for example JPEG/PNG where modern alternatives are possible), to reduce payload size and improve Core Web Vitals and crawl efficiency.

How do we capture it

1. Image Discovery: Crawler extracts image candidates from <img src>, <img srcset>, <picture><source srcset>, CSS background-image URLs (when available in rendered styles), and Open Graph image references (if enabled).
2. URL Normalization: Relative image paths are converted to absolute URLs using the final page URL. Query strings are preserved for fetch consistency. Extension inference is based on URL pathname.
3. Fetch and Probe Strategy: Crawler first sends a lightweight HEAD request. If HEAD is blocked or incomplete, crawler falls back to ranged GET (Range: bytes=0-2048).
4. Format Detection Logic: Detection priority is: 1. Response header Content-Type, 2. URL extension, 3. Magic-byte signature sniffing for MIME mismatches.
5. Classification Rules: Modern format: AVIF or WebP. Legacy format: JPEG/PNG/GIF/BMP/TIFF.
6. Aggregation: Page-level counts and coverage ratio are computed. Site-level totals are rolled up across crawled pages.

What to store

Field	Type	Comment
total_images_detected	INT DEFAULT 0	Total unique image resources detected on the page.
modern_images_count	INT DEFAULT 0	Count of images in AVIF or WebP formats.
legacy_images_count	INT DEFAULT 0	Count of images in JPEG/PNG/GIF/BMP/TIFF formats.
images_modern_format_ratio	DECIMAL(5,2)	Percentage of images in modern formats at page level.
has_modern_image_formats	BOOLEAN DEFAULT FALSE	True when at least one WebP/AVIF image exists.
legacy_image_urls	TEXT[]	List of legacy-format image URLs.
unsupported_or_unknown_image_formats	TEXT[]	Image URLs where format could not be verified reliably.
image_format_detection_method	TEXT[]	Detection method used (mime, extension, magic-byte).
site_total_images_detected	INT DEFAULT 0	Site-level total images across crawl session.
site_total_modern_images	INT DEFAULT 0	Site-level AVIF/WebP count.
site_total_legacy_images	INT DEFAULT 0	Site-level legacy image count.
site_images_modern_ratio	DECIMAL(5,2)	Site-level modern format coverage percentage.

Condition for trigger

The crawler flags the issue based on the presence of legacy format images, lacking modern formats, and coverage thresholds.

• Trigger Rule 1: No Modern Formats Detected

  • Target Field: has_modern_image_formats
  • Evaluation Logic: = FALSE AND total_images_detected > 0
  • Severity: IMPORTANT
  • Diagnostic Message: "No WebP/AVIF images were detected. Page is likely serving heavier legacy image formats."

• Trigger Rule 2: Legacy Images Still Present

  • Target Field: legacy_images_count
  • Evaluation Logic: > 0
  • Severity: IMPORTANT
  • Diagnostic Message: "[legacy_images_count] images are still in legacy formats (JPEG/PNG/GIF). Consider converting to WebP/AVIF."

• Trigger Rule 3: Low Modern Coverage

  • Target Field: images_modern_format_ratio
  • Evaluation Logic: < 80.00 AND total_images_detected >= 5
  • Severity: IMPORTANT
  • Diagnostic Message: "Modern image format coverage is only [images_modern_format_ratio]%. Improve WebP/AVIF adoption."

• Trigger Rule 4: Site-Level Modern Adoption Weak

  • Target Field: site_images_modern_ratio
  • Evaluation Logic: < 85.00 AND site_total_images_detected >= 20
  • Severity: IMPORTANT
  • Diagnostic Message: "Site-level modern image coverage is low ([site_images_modern_ratio]%). Optimize image pipeline globally."

• Trigger Rule 5: Unknown/Uninspectable Formats

  • Target Field: unsupported_or_unknown_image_formats
  • Evaluation Logic: array_length(unsupported_or_unknown_image_formats, 1) > 0
  • Severity: WARNING
  • Diagnostic Message: "Some image formats could not be verified due to missing headers or blocked requests."

Sources

• Google Search Central: Image SEO best practices: https://developers.google.com/search/docs/appearance/google-images
• web.dev: Use WebP images: https://web.dev/use-webp-images/
• web.dev: Serve responsive images: https://web.dev/serve-responsive-images/
• MDN: image/webp: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#webp
• MDN: image/avif: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#avif_image

Long description

Image assets are commonly the largest bytes transferred on a page. If a site relies heavily on JPEG/PNG without modern alternatives, users see slower loads and worse experience on mobile and low-bandwidth networks.

Modern formats such as WebP and AVIF usually provide substantial payload reduction while preserving acceptable visual quality. Smaller images improve rendering speed and can support better LCP outcomes, especially on image-heavy templates.

Why this matters for SEO and UX:

• Faster image delivery improves perceived performance.
• Better performance supports page experience quality.
• Smaller payloads reduce bandwidth usage and improve crawl/render efficiency.

Common Failure Scenarios:

• Legacy-only image pipeline: Site outputs only .jpg and .png with no WebP/AVIF derivatives.
• MIME misconfiguration: AVIF/WebP files exist but are served with incorrect Content-Type.
• Partial rollout: Some templates use modern images but large sections still use legacy formats.
• Hardcoded legacy references: Templates/CMS content points to old .jpg/.png paths while optimized versions exist.
• Broken content negotiation: Server/CDN does not reliably honor modern format delivery across all routes.

How to Fix

Implement an image optimization pipeline that generates and serves WebP/AVIF by default with safe fallbacks.

1. Generate AVIF/WebP derivatives at upload/build time.
2. Use <picture> with AVIF/WebP first, then JPEG/PNG fallback.
3. Ensure proper MIME headers (image/avif, image/webp) from CDN/origin.
4. Replace hardcoded legacy image references in templates/CMS.
5. Re-crawl and validate improved modern-format ratios.