Open the page of almost any slow website and the cause is the same: pictures that are far bigger than they need to be. A single phone photo can be four or five megabytes. Put six of them on a blog post and a visitor on a mobile connection is waiting for twenty megabytes before the page feels finished. Many people leave long before that. Search engines also notice slow pages. The good news is that images are the easiest part of a website to fix, and you can usually cut them by 80 to 95% without anyone noticing a difference.
Why image size matters
- Speed. Smaller images load faster, especially on mobile data.
- Visitors stay longer. A page that appears quickly feels better to use.
- Search visibility. Page speed is one of the things search engines consider, and slow, heavy pages are harder to rank.
- Cost. Smaller files use less data for you and for your visitors, and less storage on your host.
- Email and forms. Many forms and emails limit attachments to a few megabytes.
Two different kinds of "size"
People use "image size" for two things, and mixing them up is the most common mistake.
Dimensions are the width and height in pixels, for example 4000 by 3000. File size is how much storage it takes, for example 4.2 MB. Dimensions are the bigger lever. A photo that is 4000 pixels wide, shown on a page that is 800 pixels wide, carries about twenty-five times more pixels than the screen can use. Shrinking the dimensions first removes that waste. Compression then trims what is left.
Step 1: resize to the size you need
Look at how wide the picture is shown on your page. A blog post column is often 700 to 900 pixels wide. A full-width banner may be 1200 to 1600 pixels. Because high-density screens can show more detail, doubling those numbers is usually the most you will need. Use the Image Resizer to set an exact width or height. Keep the aspect-ratio lock on so the picture is not stretched.
Step 2: compress
The Image Compressor redraws your picture and saves it again at the quality you choose. The slider runs from 10 to 99 and starts at 80. After you press Compress, the tool shows the original size, the new size and the percentage saved.
For JPEG this is lossy compression. The picture is stored with slightly less detail, concentrated where the eye notices least. At 80 to 90 most people cannot tell the difference. Below 50, blockiness and blur appear on many images.
Step 3: choose the right format
- JPG is best for photographs. Good compression, no transparency.
- PNG is best for screenshots, logos, icons and anything with sharp text or transparency. It is lossless, so files are bigger.
- WebP often gives smaller files than JPG or PNG at the same quality and is supported by current browsers. You can convert with the Image Converter.
One thing to know about our compressor: when you give it a PNG, it saves the result as a JPEG unless the quality is above 95. JPEG cannot store transparency, so a PNG logo with a transparent background will get a solid background, and transparent areas may turn black. For images with transparency, keep the quality above 95 so that the file stays a PNG, or use a different approach.
A practical target
For ordinary blog and article images, many sites aim for well under 200 KB per picture, and often much less. If you land at 100 to 150 KB for an 800-pixel photo, that is a good result. Large hero banners may be a little heavier. After resizing, check the size under the tool's result line: if it is not smaller, the picture was probably already well compressed, and you should keep the original.
Check the result like a professional
- Open the original and the compressed file side by side at 100% zoom.
- Look at faces, text, thin lines and smooth gradients such as the sky. Compression damage appears there first.
- If you see blocky patches or colour banding, move the slider up by 5 to 10 points and try again.
- Always compress from the original, not from an already compressed copy. Each JPEG compression loses a little more.
Bonus: a privacy side effect
Re-saving a picture through the compressor drops hidden data such as GPS location and camera details. If you only want that and no compression, our Free Metadata Cleaner strips it without recompressing the image.
A simple workflow you can repeat
Once you have found settings that work, turn them into a habit. Decide on two or three standard widths for your site, for example 800 pixels for post images and 1400 pixels for banners. Resize every new picture to one of them, compress at your usual quality and check the file size. Because the settings are the same each time, your pages look consistent and you stop having to think about it. Keep a folder of originals and a folder of web-ready copies, so you can always go back and make a new version if your design changes. If you publish a lot of pictures, spend a few minutes each month looking at your heaviest pages and fixing the biggest offenders first.
Common mistakes
- Uploading the original camera file and letting the website shrink it with CSS. The visitor still downloads the full file.
- Compressing the same JPEG again and again.
- Saving screenshots as JPEG, which makes text look fuzzy. Use PNG for those.
- Using a very low quality number for a hero image that fills the screen.
- Forgetting to name files clearly.
blue-bicycle-front.jpghelps both people and search engines more thanIMG_4821.jpg.
Frequently asked questions
Will compression make my photo blurry?
At 80 to 90 quality, most people cannot tell the difference at normal viewing size. Very low settings cause visible blocks and blur.
Is my image uploaded?
No. The tools process the picture in your browser, so your images stay on your device.
Can I undo compression?
No, which is why you should keep your original files and share only the compressed copies.
Why did the new file not get smaller?
The image may already be heavily compressed, or you chose a very high quality. Try a lower setting, or keep the original.
Final thoughts
Resize first, compress second, choose the right format and check the result. It takes a minute per image and it is one of the cheapest improvements you can make to a website. Start with the Image Resizer and the Image Compressor, and see how much lighter your next post can be.