Email Hero Images that Survive Clients

A personalized email hero image is the largest image in the message and the easiest to get wrong: too wide, too heavy, blocked by default. jsontoimg renders a per-recipient (or per-segment) JPEG you already sized for clients. It does not send the email.

Client-safe spec

Rule Value
Display width 600px (width=600, max-width:600px, height:auto)
Source width 1200px (2×)
Format JPEG for photos; PNG for flat graphics
Weight Aim ≤150KB
Alt Required; images are often blocked

Send-time vs open-time

Most campaigns should render at send, upload to your CDN, and use a boring static URL. Open-time signed URLs are for countdowns and stock. Minting is free; the first GET bills a credit. Details: email hero tutorial.

Why JPEG and not WebP

On the web, WebP and AVIF are the obvious answer. In email they are not. Can I email tracks it feature by feature: WebP support and AVIF support are both patchy across the clients people actually read mail in. A hero that fails to decode is a blank rectangle at the top of the campaign, so the same template serves JPEG to the inbox and WebP to the landing page.

Alt text, blocked images, and the proxy

Plan for the image not loading. Most clients block remote images until the reader opts in, which makes alt, width, and height load-bearing rather than decorative — the alt text is the headline for everyone who never allows images, and the explicit dimensions stop the layout collapsing.

The other surprise is who fetches the file. Gmail routes images through its own caching proxy, so an open-time signed URL is hit once by Google rather than once per reader. That is good for your credit count and bad for anything you hoped to personalise per open — treat open-time rendering as segment-level, not reader-level.

Related

FAQ

What size should an email hero be?

Design at 1200×630 (or 1200×600), display at width 600, max-width 600px. JPEG for photos, PNG if you need a hard graphic. Stay under ~150KB. Always set alt text — many clients block images.

Send-time or open-time?

Send-time for names, products, prices (render, host, reference a stable URL). Open-time signed GET only if the pixel must be fresh (inventory, countdown). Cache by the full query string.

Will this fix deliverability?

No. Image-to-text ratio, alt text, and your ESP reputation still rule. A personalized hero helps click-through after the message lands.

Get 25 free images →