Last updated: 21 August 2026. Originally published July 2021 and substantially expanded.
It is always a nuisance when you try to upload an image somewhere and get told the file is too big. But if you are optimising a website, oversized images are a bigger problem than an error message — they are usually the single heaviest thing on the page, and the most common reason a site fails its Core Web Vitals assessment.
Here is what actually matters, in order: pick the right format, resize before you compress, and only then worry about which compressor to use. Most guides skip the first two and jump straight to a tool list. That is backwards.
First, pick the right format
Choosing a modern format will save you more bytes than any amount of tuning inside a compressor.
| Format | Use it for | Trade-off |
|---|---|---|
| AVIF | Best compression available. Photos and hero images where file size matters most. | Widely supported in modern browsers, but not in every older app or tool. |
| WebP | The safe modern default. Good compression, near-universal browser support, handles transparency. | Slightly larger files than AVIF. |
| JPEG | Photos where maximum compatibility is required. | Larger files. No transparency. |
| PNG | Logos, screenshots, line art, anything needing transparency. | Very large for photographs — avoid for photos. |
| SVG | Logos and icons that must stay sharp at any size. | Vector only. No use for photographs. |
In testing published this year, AVIF produced the best compression ratio of any format tested, at around 71%, beating JPEG, PNG and WebP, though browser and software support means JPEG and WebP remain safer defaults for broad compatibility.
A practical rule: serve WebP as your default, add AVIF for large hero images, and keep PNG only where you genuinely need transparency or crisp text.
Second, resize before you compress
This is the most commonly skipped step and often the biggest single win. If an image displays at 800 pixels wide, there is no reason to upload it at 4000 pixels wide. No compressor can undo that — you are asking it to preserve detail nobody will ever see.
Check the actual display width in your browser’s inspector, resize to roughly twice that for retina screens, and compress after.
The tools
Squoosh: best for control and privacy
Built by the Google Chrome team, Squoosh lets you compare codecs side by side — MozJPEG, WebP, AVIF, OxiPNG and others, with a visual slider showing exactly what quality you are trading at each level. It processes images in your browser using WebAssembly.
The fact that nothing is uploaded matters more than it sounds. If you handle client images under NDA, or anything remotely sensitive, a browser-based tool is the only defensible choice.
The limitation is that it handles one image at a time, and the interface is awkward on mobile. Reach for it on hero images and anything where quality genuinely matters.
TinyPNG: best for quick batches
Still the fastest way to shrink a handful of images with no setup. Drag, drop, download. The free web app caps you at 20 images per batch with a 5 MB per-file limit, and does not output AVIF.
Its PNG results remain genuinely strong — it uses lossy palette quantisation rather than pure lossless compression, which is why it beats most tools on PNG specifically. Your files do get uploaded to its servers, so treat it as a tool for public web assets rather than sensitive material.
There is also a developer API and a WordPress plugin, which is where it earns its place in most production workflows.
Optimizilla and iLoveIMG: solid general-purpose options
Both handle JPEG and PNG in batches with a preview slider, no signup required. iLoveIMG bundles resizing, conversion and other tasks in one place, which is convenient when you need several operations. Neither outputs AVIF, and both upload your files to their servers.
ImageOptim: best on a Mac
Runs locally, unlimited, and combines several good encoders behind a single drag-and-drop window. If you are on macOS and compress images regularly, this is the lowest-friction option available. macOS only.
Command line: best for automation
If compression should be part of a build step rather than a task you remember to do, skip the web tools entirely. A common stack is cwebp for WebP, avifenc for AVIF, pngquant for paletted PNG and mozjpeg for optimised JPEG. No rate limits, no uploads, and reproducible results.
If you run WordPress, automate it
Manually compressing every image you upload is a habit almost nobody sustains. On a content-heavy WordPress site, a plugin that compresses on upload, such as ShortPixel, Imagify or EWWW Image Optimizer, will handle thumbnails and serve WebP or AVIF automatically.
The time saved is real, but the more important benefit is consistency: the images you upload in a hurry six months from now get optimised too.
Which should you use?
- One important image, quality matters: Squoosh.
- A quick batch of web assets: TinyPNG.
- Sensitive or client images: Squoosh or ImageOptim, nothing that uploads.
- Hundreds of images regularly: command line, or a WordPress plugin.
Image weight is one of the more mechanical parts of technical SEO. There is a right answer, and getting it right is mostly a matter of doing it consistently rather than doing it cleverly. For the wider picture on why page speed feeds into rankings, see our introduction to SEO.
Common questions
Should I use WebP or AVIF?
WebP is the safer default, with near-universal browser support and good compression. AVIF compresses better and is worth using for large hero images, but support is slightly less universal in older software. Serving WebP by default and AVIF where it matters is a sensible compromise.
Does compressing an image reduce its quality?
Lossy compression does remove data, but at moderate quality settings the difference is usually invisible. Lossless compression preserves every pixel and produces more modest savings. For web images, moderate lossy compression is almost always the right trade.
Is TinyPNG or Squoosh better?
They suit different jobs. Squoosh gives you codec-level control and runs entirely in your browser, which makes it the right choice for important images and anything confidential. TinyPNG is faster for batches of ordinary web assets, though it uploads your files to its servers.
How small should images on a website be?
There is no universal number, but most web images have no reason to exceed a few hundred kilobytes. More important than any target is resizing to the dimensions the image actually displays at before compressing.
Tabraiz Bukhari is a Digital Marketing Expert & Psychologist. He has experience in different areas of digital marketing from SEO and Google Adwords to Social Media Marketing and Ecommerce Management. He writes about his expertise and knowledge in digital marketing and sometimes about Psychology related topics. Currently, he is doing a job as an SEO Specialist/Team Leader at NewEraOS.