How to Compress Images Without Losing Quality

Large images are the most common reason a web page loads slowly. A photo straight from a phone can be 4 MB or more, while the same picture on a web page rarely needs to be over 200 KB. You can usually get there without anyone noticing a difference.

Step 1: Resize before you compress

A phone photo is often 4000 pixels wide, but most web layouts show it at 800 to 1600 pixels. Every extra pixel is wasted data. Shrinking the dimensions first is the biggest saving you can make, often cutting the file to a tenth of its size before any compression happens. Use the Image Resizer and keep the aspect ratio locked so nothing looks stretched.

Step 2: Pick the right format

• JPG is best for photos. It is lossy, which means it throws away detail the eye barely notices.
• PNG is best for logos, screenshots and anything with sharp edges or transparency. It is lossless, so files are larger.
• WebP handles both photos and graphics and is usually noticeably smaller than JPG or PNG at the same look. All current browsers support it.

If a photo is saved as PNG, converting it to JPG or WebP with the Image Converter often shrinks it dramatically.

Step 3: Choose a quality setting

Quality settings run from 0 to 100. Going from 100 to about 80 cuts the size a lot while looking almost identical. Below about 60, blocky patches and fuzzy edges start to appear, especially around text and in flat colors. A good starting point for photos is 75 to 85. Compare the before and after in the Image Compressor before you download.

Things to avoid

• Don't compress the same JPG again and again. Each save loses a little more detail. Keep the original and compress from that.
• Don't enlarge a small image to make it look bigger. It will only look soft.
• Don't use PNG for photographs unless you need transparency.

All three tools work inside your browser. Your images are never uploaded, so it is safe to use them on private photos.