How to compress images
How to make your image files smaller before uploading them to your website, with free tools and a step-by-step process.
A compressed image is a smaller file that downloads faster — without looking noticeably different to the human eye. Compressing your images before uploading them is one of the single most effective things you can do to speed up your website.
This guide shows you exactly how to do it, using free tools.
Quick summary
Use Squoosh (squoosh.app) to compress images in your browser for free. Target file sizes of under 200 KB for most images, under 300 KB for hero banners. You can usually reduce file size by 60–80% with no visible quality loss.
What you'll need
Beginner 2–5 minutes per image- An internet connection
- Your original image file(s)
The easiest free tool: Squoosh
Squoosh (squoosh.app) is a free, browser-based image compression tool made by Google. No download, no sign-up required.
Open Squoosh. Go to squoosh.app in your browser.
Drop your image onto the page. Drag and drop an image file from your computer, or click to browse for it.
Choose your output format. For photographs, choose WebP or MozJPEG. For images with transparency, choose WebP or OxiPNG. A slider lets you move between the original and compressed version to compare.
Adjust the quality slider. Start at around 80–85% quality. Look at both sides of the comparison. If you can't see a difference, reduce quality a little more. Stop when you'd notice the difference.
Check the file size. The compressed file size appears at the bottom. Aim for under 200 KB for most images, under 300 KB for full-width hero images.
Download the compressed image. Click the download button (the arrow icon at the bottom right). Save the compressed file with a clear name.
Other free tools
If you prefer alternatives:
- TinyPNG / TinyJPG (tinypng.com) — drag and drop, handles JPG and PNG, automatic compression
- ImageOptim (imageoptim.com) — Mac desktop app, drag and drop to compress in place
- Canva — if you're exporting images from Canva, use the "Compress file" option on download
- Preview on Mac — open the image, go to Tools → Adjust Size, then File → Export and choose quality
How much to compress
A good guide:
| Image use | Target file size |
|---|---|
| Hero banner (full-width) | Under 300 KB |
| Blog post / article image | Under 150 KB |
| Team photo or headshot | Under 80 KB |
| Product image | Under 200 KB |
| Logo (PNG) | Under 50 KB |
These are targets, not hard limits. A 350 KB hero image is fine. A 4 MB hero image is not.
Batch compression
If you have many images to compress at once:
- TinyPNG accepts up to 20 images at a time in the free version
- ImageOptim (Mac) lets you drag an entire folder and compresses all images in it
- Squoosh CLI — a command-line version for developers who process large batches
If you're uploading a large number of images to a website, contact us and we can help set up an automated optimization process.
What about WordPress?
WordPress has built-in image scaling, but it doesn't optimize for the best file size. Plugins like Imagify, ShortPixel, or Smush can automatically compress images when you upload them. We can recommend and set one up for your site if needed.
Compress before uploading
Even with an optimization plugin on your site, it's still good practice to resize images before uploading. A properly sized image compressed at source is faster to upload and takes less server storage.
Common questions
Related guides
Need a hand?