Legacy Image Formats Detected
Legacy image formats like PNG, JPG, and GIF are detected on your site. These formats are less efficient than modern alternatives like WebP and AVIF, leading to
By Seoxpert Editorial · Published · Updated
Why it matters
Using legacy formats prevents you from taking advantage of superior compression in WebP and AVIF. This results in larger file sizes, slower page loads, and poorer Core Web Vitals scores, particularly affecting Largest Contentful Paint (LCP). Faster image delivery improves user experience and SEO rankings.
Impact
Serving images in outdated formats increases bandwidth usage, slows down page rendering, and can negatively impact SEO performance by harming user experience and Core Web Vitals metrics. This can lead to lower search rankings and reduced site engagement.
How it's detected
Automated SEO tools, Lighthouse audits, or manual code reviews identify image URLs ending in .jpg, .jpeg, .png, or .gif without modern format alternatives. Tools may flag these resources when more efficient formats are available.
Common causes
- Images uploaded directly from cameras or design tools without conversion to modern formats
- Lack of automated image optimization in the build or deployment pipeline
- CDN or hosting provider not configured to serve or convert images to WebP/AVIF
- CMS or e-commerce platforms not supporting modern image formats by default
- Developers unaware of browser support for modern formats
How to fix it
Code examples
Legacy image format usage (problem)
<img src="/images/banner.jpg" alt="Banner">Modern image format with fallback (solution)
<picture>
<source srcset="/images/banner.avif" type="image/avif">
<source srcset="/images/banner.webp" type="image/webp">
<img src="/images/banner.jpg" alt="Banner">
</picture>Node.js image conversion with Sharp (solution)
const sharp = require('sharp');
sharp('input.jpg')
.toFormat('webp')
.toFile('output.webp', (err, info) => {
if (err) throw err;
console.log('Converted to WebP:', info);
});FAQ
How do I know which images are using legacy formats on my site?
You can use tools like Google Lighthouse, PageSpeed Insights, or automated SEO crawlers to scan your site for images with .jpg, .jpeg, .png, or .gif extensions. These tools will flag images that are not served in modern formats like WebP or AVIF.
Will converting all images to WebP or AVIF break image loading in older browsers?
No, as long as you use the <picture> element with appropriate <source> tags for modern formats and a fallback <img> tag for legacy formats, browsers that do not support WebP or AVIF will load the fallback image.
Is it necessary to keep the original JPG or PNG files after converting to WebP/AVIF?
Yes, you should keep the original files as fallbacks for browsers that do not support WebP or AVIF. The <picture> element allows you to specify multiple sources, ensuring compatibility.
Can I automate image format conversion during deployment?
Yes, you can integrate image optimization tools like Sharp, ImageMagick, or Squoosh into your build or deployment pipeline to automatically convert images to modern formats.
Do all CDNs support automatic conversion to WebP or AVIF?
Not all CDNs support this feature by default. Check your CDN's documentation to see if it can automatically serve images in modern formats based on client support, or if you need to handle conversion yourself.
What if my CMS does not support WebP or AVIF?
If your CMS lacks native support, consider using plugins or external optimization services that add WebP/AVIF support, or handle conversion and HTML markup manually.
Related Issues
Pages with many images are at elevated risk of missing or poor alt text, which affects both accessibility and image-search traffic.
Pages with excessive image counts load more than 30 images, leading to increased HTTP requests, higher bandwidth usage, and slower page performance. This can ne
Found this issue on your site?
Run a scan to see if Legacy Image Formats Detected affects your pages.
Scan my website →