PNG, JPEG, WebP or AVIF: picking formats for generated images
The right answer changes with the destination — an ad network, an email, a web page, a printer. The wrong answer is baking one choice into the pipeline.
PixelDrive··5 min read
Every generated image eventually meets a destination with opinions. Ad platforms want safe, universal formats. Web pages want the smallest bytes a browser will accept. Email clients are stuck a decade behind. Print wants a vector-true PDF. A pipeline that hard-codes one output format is quietly wrong in at least two of those places.
The calmer design is to treat format like any other render variable: the same template, the same data, delivered as whatever the destination needs.
What each format is actually for
- PNG — lossless, sharp type and flat colour, the default for logos and UI; heaviest of the four for photographic art.
- JPEG — the universal photographic workhorse; small, everywhere, but no transparency and soft on crisp text at low quality.
- WebP — 25–35% lighter than JPEG at similar quality, supported by every modern browser; the sensible web default.
- AVIF — the newest and smallest, often half the weight of JPEG; ideal for high-traffic pages, with support now broad across current browsers.
- PDF — when the render is a document: certificates, tickets, price sheets, anything headed for a printer or an attachment.
Make it a parameter, not a pipeline
On a templated render, format belongs in the request. The same URL that returns a PNG returns a WebP by changing one parameter, with an optional quality knob for the lossy formats. Conversion happens server-side and each variant caches independently — the AVIF your product page serves and the JPEG your email sends are both repeat-hits after the first request.
/img/t/8c41f2?headline=Final+week&format=avif&quality=60
/img/t/8c41f2?headline=Final+week&format=jpeg ← same render, email-safeA sane default per destination
- Web pages and OG cards: WebP now, AVIF where you control the audience’s browsers.
- Email: JPEG or PNG — older clients ignore modern formats.
- Ad networks and marketplaces: whatever the spec sheet says, usually JPEG or PNG.
- Documents, tickets, certificates: PDF, generated from the same template as the social version.
The part that compounds
Format flexibility is cheap on day one and valuable forever. The day a channel changes its spec — an ad network starts accepting WebP, a client demands AVIF for page speed — you change a query parameter, not a pipeline. The design, the data and the cache all stay exactly where they were.