Client Hub →
Theme
Glossary Landing Pages

WebP / AVIF (Image Formats)

Modern image formats that compress files better than JPEG/PNG, reducing page load times and improving Core Web Vitals for landing pages.

Also known as: next-gen image formats modern image compression AVIF format WebP format image optimisation formats

What Are WebP and AVIF?

WebP and AVIF are modern image file formats designed to replace older standards like JPEG and PNG. Developed by Google (WebP) and the Alliance for Open Media (AVIF), these formats use advanced compression algorithms to dramatically reduce file sizes whilst maintaining visual quality.

Why They Matter for Landing Pages

Page speed is crucial for conversion rates and SEO ranking. Image files typically account for 50-80% of page weight, making optimisation essential. WebP files are 25-35% smaller than JPEGs, whilst AVIF can be 20-50% smaller than WebP – meaning faster load times without visible quality loss.

Google's Core Web Vitals prioritise Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS), both heavily influenced by image loading performance. Using modern formats directly improves your landing page's search ranking potential and user experience, particularly important for UK e-commerce and B2B lead generation campaigns.

Browser Support and Implementation

WebP has broad support (95%+ across modern browsers), making it safe for most campaigns. AVIF support is growing but currently sits around 70-80%, so it's best used as a secondary format.

Implementation uses the HTML <picture> element, serving WebP/AVIF to capable browsers while falling back to JPEG/PNG for older ones:

<picture>
  <source srcset="image.avif" type="image/avif">
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="Description">
</picture>

When to Use Them

WebP is suitable for all landing pages, product images, and hero sections where you need reliable support today. AVIF works best for high-traffic pages where maximum optimisation justifies slightly more complex implementation.

Tools like Squoosh, ImageOptim, and most modern CDNs (Cloudflare, Fastly) handle conversion automatically. Many page builders and WordPress plugins now support automatic format delivery.

Practical Considerations

Whilst technically superior, modern formats won't compensate for poor page structure or slow servers. They're most effective as part of a comprehensive optimisation strategy alongside lazy loading, responsive images, and content delivery networks.

For UK agencies managing multi-device campaigns, modern formats are increasingly non-negotiable – particularly as Google's search algorithm tightens performance requirements and competitors adopt these standards.

Frequently Asked Questions

Do I need to use both WebP and AVIF, or just one?
WebP alone is sufficient for most campaigns due to excellent browser support. AVIF is worth adding if you're targeting high-traffic pages or want maximum compression, but use the fallback method so older browsers still work correctly.
Will my website visitors notice lower image quality with these formats?
No. Both formats are perceptually lossless at comparable file sizes – meaning they look identical to JPEG/PNG to the human eye but with significantly smaller file sizes. You may need to test compression settings for your specific imagery.
How much faster will my landing page load with WebP/AVIF?
Image-heavy pages typically see 2-4 second LCP improvements. The actual impact depends on your current image sizes and number of images. Most UK landing pages see measurable conversion uplift from faster load times.
Can I convert my existing images to WebP/AVIF automatically?
Yes. CDNs like Cloudflare, WordPress plugins, and tools like Squoosh handle conversion. Many modern web platforms (Shopify, Wix) offer automatic conversion, though manual control is recommended for campaign-critical assets.

Learn How to Apply This

We build websites — get a quote

Our team can put this knowledge to work for your brand.

Request Callback