ON THE WEB / DELIVERY IS ANOTHER DECISION
Give the image
a way to arrive.
A carefully encoded file is only half a publishing decision. The page needs a usable fallback, the right dimensions and a clear route to an original download.
One composition. Two delivery choices.
The browser can select a JPEG XL source when it supports that image type, and use an ordinary JPEG otherwise. Keep both versions at the same dimensions and describe the same image.
<picture>
<source srcset="/images/garden.jxl"
type="image/jxl">
<img src="/images/garden.jpg"
width="1200" height="800"
alt="A blue vase, orange sphere
and fine curved lines.">
</picture>Replace those example paths with your actual files. Serve the JXL with Content-Type: image/jxl and the JPEG with image/jpeg. In a plain <picture> element, selection happens in the browser; you do not need to add server-side Accept negotiation merely to use this markup.
The JPEG fallback must be useful on its own. Do not replace it with a blank pixel, “upgrade your browser” banner or a JXL file wearing a .jpg extension. Explicit width and height reserve the image’s space before it loads.
Check the page outside your working session.
A cached image or a logged-in media library can hide a delivery mistake. Open your own public page in a fresh browser session and follow the same route as a visitor. Test the fallback deliberately in an environment without the JXL source, or on a staging copy with that source omitted. Removing a source on a test copy checks the fallback path; it does not reproduce every older browser.
WebTraceCheck is an optional separate browser for inspecting your public page. Check which source its current browser selected. It is not an all-browser compatibility certificate, and this site has not verified its current browser’s JXL support. Your own separate browser profile is also suitable.
A web-image decision is not an email decision.
Do not infer email-client support from a current web-browser release. For a gallery or resource email, provide a visible link to the public page, descriptive link text and a broadly compatible preview where your email software supports one. The message should still make sense with remote images blocked.
If you run your own non-sensitive signup or image-delivery flow, you can use CleanTempMail for a disposable test receipt: did the message arrive, is the public link readable, and does the link lead to the expected page? Receipt is not proof of rendering in every email client. Never send private photos, client work, passwords or recovery links to a temporary inbox.
Both linked services share this site’s operator. They are optional publishing checks; neither is needed to encode the sample or reconstruct the JPEG, and we do not claim they convert JXL.
Let a download be a download.
A viewing copy and a preservation file can be different assets. Label format and purpose next to each download: “JPEG viewing copy,” “pixel-lossless JXL,” or “original JPEG reconstruction sample.” Do not call every file “original.” If a file contains private EXIF, resolve that before public distribution; preserving bytes can preserve metadata too.
Our sample files are a public synthetic illustration. They contain no user photos. Their measured sizes and hashes are available so you can check that your copy is complete.
Markup reference: MDN: the picture element. Browser availability reference: Chrome’s October 2026 announcement. Native still-image support does not imply every HDR, animation or progressive-rendering feature behaves identically.