Encoding Guide

Control the details so assets load faster

Compression, color, Retina output, and delivery strategy are inseparable. Use these notes as a checklist whenever you prepare exports.

Compression & quality

The quality slider lets you preview results instantly. Recommended flow:

PNG lossless → consider WebP lossless for smaller files; try Indexed PNG if you stay under 256 colors.
JPEG → start at 0.7 and step down while reviewing gradients—avoid jumping straight under 0.4.
AVIF / WebP → test at 0.45, 0.6, and 0.75, logging both file size and visual notes.

For batch runs, keep a tiny spreadsheet with filename / format / quality / size so decisions are easy to defend.

Browsers primarily display SDR / sRGB. If your source is Display P3 or HDR:

Convert to sRGB in your design tool before exporting to avoid browser-side shifts.
To keep HDR, export AVIF (10-bit) plus sRGB fallbacks via <picture> and type="image/avif".
Check whether screenshots carry ICC/Gamma profiles; re-export in ImgEasyResize if you need absolute consistency.

Queues make it easy to duplicate settings across many assets:

Load every asset, tune the first crop/format/quality, then click “next” to reuse the settings.
Batch download keeps filenames, so conventions like hero-home@2x.avif stay intact.
Document export parameters in your repo README or issues so future tweaks have context.

Optimized files still need shipping tactics:

HTML → use <picture> + srcset for multiple sizes plus loading="lazy".
CDN → cache for 30+ days and version URLs so updates bust cache on demand.
Retina → export 2x/3x assets but set the rendered size in CSS for sharp results.

When embedding Base64 or data URI assets, check:

File size → Base64 inflates files by ~33%, so reserve it for tiny UI pieces.
Cache → inline assets ship with every HTML/CSS change, which suits small, high-frequency elements.
CSP → if Content Security Policy is enabled, allow img-src data: explicitly.

If your site uses strict host allowlists (ImgEasyResize does the same), add every CDN or site domain to avoid blocked images.