Mostly because they make web pages lighter without a visible loss in quality. WebP, from Google (first released in 2010), typically produces files noticeably smaller than JPEG or PNG at similar quality, and it supports transparency and animation. AVIF is newer and based on the AV1 video codec. At comparable quality it usually compresses further than WebP, and it handles HDR and wide color well.
The main drivers are:
- Page speed: smaller images load faster, which matters for user experience and for search-ranking signals based on loading performance.
- Bandwidth and hosting costs: fewer bytes means lower data transfer costs, especially for large sites and on mobile networks.
- Browser support: WebP is now supported by all major browsers, and AVIF by Chrome, Firefox and Safari, so sites can serve it without fallbacks for most visitors.
- Automation: content management systems, CDNs and image services increasingly convert images to these formats automatically.
The trade-offs are real. AVIF takes more processing power to encode, so it can be slow to produce at scale. Some older devices, email clients and apps still lack support, so JPEG and PNG remain as fallbacks. Exact adoption figures change quickly, so for current numbers the HTTP Archive's Web Almanac is the best source. A related discussion about when PNG overtook JPEG is at /t/1000.
Also discussed here:
- When did .png become more used than .jpg?
