A single unoptimised image can be larger than an entire webpage used to be. Whether you're uploading to a website, sending via email, or sharing on social media, reducing image file size is one of the highest-impact steps you can take — and modern tools let you do it with no visible quality difference.
Why file size matters
On websites, large images are the single most common cause of slow load times. Google's Core Web Vitals metrics — particularly Largest Contentful Paint (LCP) — are directly affected by how quickly your main image loads. A 3 MB hero image can push your LCP past 4 seconds; the same image optimised to 200 KB loads in under a second on a typical connection.
On devices, storage and mobile data are finite. A collection of 24-megapixel photos from a modern smartphone can fill gigabytes in hours. Compressing before archiving saves significant space without sacrificing visual quality at screen resolutions.
The three main techniques
1. Compression — reduce quality slightly
JPEG and WebP use lossy compression, which means they discard some image data to achieve smaller files. The key insight is that human vision is far more sensitive to brightness changes than colour changes, so codecs exploit this by storing colour at lower resolution. At 80–85% quality, the naked eye cannot distinguish a compressed JPEG from the original in most photographs. A typical 3 MB photo compressed to 80% quality lands around 300–500 KB.
2. Format conversion — switch to a more efficient codec
WebP, developed by Google, achieves 25–35% smaller files than JPEG at equivalent visual quality. Every modern browser supports it. If your images are in JPEG or PNG, converting to WebP is the single easiest size reduction you can make. PNG to WebP is even more dramatic for photographs — often 50–70% smaller — because PNG uses lossless compression which is inherently large for photographic content.
3. Resizing — match dimensions to display size
A 4000×3000 px image displayed at 800×600 px on a webpage is wasting over 80% of its pixels. Scaling the image down to the actual display dimensions before uploading eliminates that waste entirely. For retina/HiDPI displays, 2× the CSS size is sufficient — a 1600×1200 px image for a 800×600 px slot looks sharp on any screen and is a fraction of the original file size.
Recommended quality settings
- Web images (general): 75–80% — good balance of quality and size
- Web images (hero / featured): 80–85% — slightly higher for important visuals
- Email attachments: 70–75% — prioritise small file size for inbox delivery
- Social media: 80–85% — platforms will re-compress anyway, so don't over-optimise
- Print: 90–95% or lossless — quality matters, size is secondary
What about PNG?
PNG uses lossless compression, which means the quality slider has little impact on PNG file sizes. If you have a large PNG that needs to be smaller, the best strategy is to convert it to WebP (which supports both lossless and lossy compression) or to JPEG if transparency isn't needed. The Format Converter on FreeImgKit handles this in one click.
Quick checklist
- Use JPEG or WebP for photographs — never PNG
- Use PNG or WebP for images that need transparent backgrounds
- Set quality to 80% for web use and check the result visually
- Resize to the actual display dimensions before compressing
- Convert existing JPEGs to WebP for websites to get a further 30% reduction