Image guide

Best Image Format for Websites

The best image format depends on what the image contains and how it will be used. A photograph, a transparent logo and a simple diagram do not necessarily benefit from the same format.

JPG for photographs

JPG is widely supported and works well for photographs with many colours and gradients. It uses lossy compression, so saving repeatedly at low quality can introduce visible blocks or smearing around fine details. Keep an original copy and inspect the compressed version before publishing.

PNG for sharp graphics and transparency

PNG preserves image data without lossy compression and supports transparency. It is useful for screenshots, interface graphics and images that need a transparent background. A photographic PNG can, however, be much larger than an equivalent JPG.

WebP for web delivery

WebP supports lossy and lossless compression and can be a good choice for website images. Check that your publishing workflow and any downstream tools support the format you choose. Keep a source copy when converting important assets.

A simple selection rule

• Photographs: start with JPG or WebP.
• Transparent graphics and many screenshots: consider PNG or lossless WebP.
• Website delivery: compare the visual result and file size rather than relying on the extension alone.

Prepare an image before publishing

Resize the image to dimensions close to its displayed size, then compress it and review the result. Sending a 5000-pixel image to a 500-pixel slot wastes bytes even if the format is efficient.

Use Alyvero's Compress Image tool to reduce file size or Resize Image to change dimensions. For more practical comparisons, see HEIC vs JPG.