How to reduce image size for a website without losing quality
A photo straight from a phone is 3 to 8 MB and 4,000 pixels wide. A web page needs a fraction of that. Oversized images slow down every visitor, cost mobile data and hurt search rankings. The fix is three decisions: dimensions, format and quality.
Last updated November 2, 2026 · 5 min read
Decide the dimensions first
Resolution is the biggest lever. An image displayed 800 pixels wide gains nothing from being 4,000 pixels wide; it only costs bytes. As a rule of thumb, export at twice the width the image is shown at, so it stays crisp on high-density screens, and never wider than about 2,000 pixels for full-width banners.
The Resize image tool changes dimensions exactly, by pixels or percentage, and keeps the aspect ratio. Do this before compressing: a smaller image compresses better and faster.
Pick the format
- JPG for photographs and anything with gradients. Smallest files, no transparency.
- WebP for photos and graphics when every browser you care about supports it, which today is all of them. Typically 25 to 35% smaller than JPG at the same quality.
- PNG for screenshots, logos, text and images that need transparency. Compress PNG reduces colors to shrink them without visible loss.
- SVG for icons and simple illustrations, which stay sharp at any size and are tiny.
Choose the quality
For JPG and WebP, a quality setting of 70 to 80% is the sweet spot: the file is a fraction of the original and no viewer can tell the difference at normal size. Below 60% you start to see blockiness in smooth areas and halos around edges.
Targets that work for most sites: under 200 KB for a full-width hero image, under 100 KB for in-content images, and under 30 KB for thumbnails.
Do it in bulk
- Open Compress image and drop in a whole folder of photos, up to 100 at a time.
- Set the quality to 75% and, if the originals are huge, limit the longest side to 1920 pixels.
- Choose WebP or JPG as the output, click Compress images, and download the ZIP.
- Upload the compressed versions to your site and keep the originals in your own archive.