Image Compression Formats for Web Delivery: PNG, WebP, and AVIF Compared
Once you have a cutout, the next question is how to deliver it. The three formats that support transparency each have tradeoffs between file size, browser support, and quality.
Once you have a cutout, the next question is how to deliver it. The three formats that support transparency each have tradeoffs between file size, browser support, and quality.
PNG has supported 8-bit alpha since 1996. Every browser handles it. Every image editor handles it. Every print workflow handles it. If you do not know where the file is going, PNG is the correct choice.
The problem is file size. PNG uses DEFLATE compression, which is lossless but does not do well on photographic content. A 2000 by 2000 cutout with a detailed subject can run several megabytes.
For a web page with twenty product thumbnails, that is a performance problem. For a single hero image, it is fine.
WebP supports both lossy and lossless compression with full alpha. In practice, WebP files are twenty-five to thirty-five percent smaller than equivalent PNGs at the same visual quality.
Browser support is universal in 2026. Chrome, Firefox, Safari, and Edge have supported WebP alpha for years. The only browsers that do not are ancient versions of Internet Explorer, which stopped receiving updates in 2022.
For web delivery, WebP is the correct default. The savings are significant and there is no meaningful compatibility risk.
AVIF is based on the AV1 video codec. It produces files thirty to fifty percent smaller than JPEG at equivalent quality, and it supports alpha.
Browser support has crossed ninety percent in 2026. Safari, Chrome, and Firefox all support it. Older browsers do not, so you need a fallback.
The encoding is slower than WebP, which matters for server-side processing but not for client-side delivery. For a static site with a build step, AVIF is a good choice if you generate both AVIF and WebP and serve whichever the browser supports.
For most use cases: deliver WebP. It is smaller than PNG, universally supported, and fast to encode.
For maximum performance: deliver AVIF with a WebP fallback. You get the smallest files for browsers that support it and a safe fallback for everyone else.
For local files and print: use PNG. You do not need to optimize file size for a file on your computer, and PNG has the broadest compatibility.
For email and messaging: use PNG. Most clients and platforms handle PNG correctly. WebP and AVIF may be flattened or converted without warning.
Yes. Both lossy and lossless WebP support alpha channels.
AVIF, typically. It is thirty to fifty percent smaller than JPEG at equivalent quality. WebP is smaller than PNG but not as small as AVIF.
Yes. Use cwebp with the -alpha_q 100 flag to preserve full alpha quality. The default alpha quality is lower and can produce visible edges on complex cutouts.
The app is rendering the transparency as white. This is a display choice, not a file problem. The alpha channel is still there. Download the file and open it in an editor to verify.