Skip to content

Guide · Images

How to Compress an Image Online Without Losing Quality

Shrink a JPG, PNG or WebP in your browser: pick the right format and quality, hit a target size for uploads, and avoid the mistakes that make images blurry.

Author
VoltKit
Published
Reading time
3 min read

Most images people upload are far bigger than they need to be. A phone photo is often 3–6 MB, yet a 300 KB version looks identical on a screen. Compressing images makes pages load faster, emails send, and upload forms accept your file. Here is how to do it well, entirely in your browser.

Step 1: Decide what the image is for

  • A website or app: aim for the smallest file that still looks sharp at the size it will be displayed. Usually 100–300 KB for a full-width photo.
  • An upload with a size limit: you need a target size, for example "under 200 KB" or "under 1 MB".
  • Archiving originals: don't compress. Keep the original and compress copies.

Step 2: Resize first if the image is oversized

Compression can only do so much for a 4000-pixel-wide photo that will be shown at 800 pixels. Resizing removes the wasted pixels and cuts the file far more than any quality setting. If your image is much larger than it will ever be displayed, run it through the Image Resizer first.

Step 3: Choose the output format

FormatBest forTransparency
JPGPhotos, anything with gradientsNo
WebPPhotos and graphics on the web; 25–35% smaller than JPGYes
PNGLogos, icons, screenshots with sharp textYes

For the web, WebP is usually the best choice. Keep PNG only for graphics that must stay pixel-perfect.

Step 4: Set the quality or a target size

  1. Open the Image Compressor and drop in your files (up to 50 at once).
  2. Choose Quality and move the slider. 80% is the sweet spot for photos; the before/after preview shows exactly what you get.
  3. Or choose Target size, type the limit in KB, and the tool lowers quality, then dimensions, until each file fits.
  4. For PNG files, leave Smart PNG compression on to reduce the colour palette, or turn it off for a lossless result.
Do it now withImage Compressor

Step 5: Check and download

Look at the before/after preview at 100% zoom. If you see blockiness around edges or banding in skies, raise the quality a little. Then download the file, or download everything as a zip.

Common problems

  • The compressed file is larger than the original. The original was already well compressed, or you converted a JPG to PNG. The tool keeps the original when it cannot do better; try WebP instead.
  • Colours look slightly different. Some images carry a colour profile that the browser converts to sRGB on re-encoding. The difference is usually invisible; if it matters, keep the original.
  • Transparent areas turned white. JPG has no transparency. Use WebP or PNG, or pick a background colour in the PNG to JPG converter.
  • WebP is greyed out. Your browser cannot encode WebP (older Safari). Chrome, Edge and Firefox can.

Frequently asked questions

What quality setting should I use for photos?

80% is a safe default for JPG and WebP: files shrink by half or more with no visible change. Drop to 70% for thumbnails and stay at 85–90% for large hero images.

Why won't my PNG get smaller?

PNG is lossless, so re-saving it cannot remove information. Turn on smart PNG compression (which reduces the colour palette) or convert photos to WebP or JPG instead.

Does compressing remove the photo's location data?

Yes. Re-encoding through the browser drops EXIF metadata, including GPS coordinates. Orientation is applied first so the photo stays upright.

← Back to Guides

You might also like

Something useful from another corner of VoltKit.