The False Dilemma
The most common way I see creators think about image quality vs. file size is as a direct trade-off: bigger file = better quality, smaller file = worse quality. This framing is understandable but wrong, and it leads to two equally bad outcomes: unnecessarily large files that slow down load times and compress poorly on platforms, or over-compressed images that look obviously degraded.
The reality is more nuanced. File size and perceived quality are related, but the relationship is non-linear, and it changes significantly depending on the type of image, the compression method, and the output format. Understanding the actual relationship — rather than the assumed one — allows you to achieve excellent visual quality at dramatically smaller file sizes than most people think is possible.
The 80% Rule
My starting point for any image destined for digital use is what I call the 80% Rule: export as JPEG at 80% quality and check whether the result is visually acceptable. In the vast majority of cases, it is. The file will be roughly 40–50% the size of a 100% quality export with no perceptible difference in a normal viewing context.
Human vision is not a pixel counter. We perceive images holistically, and we are far less sensitive to subtle compression artifacts than we are to obvious ones. The threshold at which JPEG compression becomes visible to most people is around 70% quality for photographic content — which means 80% gives you a comfortable margin above the visible threshold while still providing substantial file size savings.
I've tested this extensively with user panels. Show someone a 100% quality JPEG and an 80% quality JPEG of the same image at normal viewing size and distance. Under normal conditions — not a forensic, zoomed-in comparison — most people cannot reliably tell the difference. Show them the same pair zoomed in at 400%, and they can. Social media images are not viewed at 400% zoom.
The Loading Penalty Is Real
For websites and platforms where file size affects load time, the stakes are higher than most creators appreciate. Google's Core Web Vitals — the metrics that directly influence search ranking — include Largest Contentful Paint (LCP), which measures how long it takes for the main image on a page to load. A 2 MB hero image on a 3G mobile connection can cause an LCP of 8+ seconds. An optimally compressed 300 KB version of the same image loads in under 1.5 seconds.
The difference between 8 seconds and 1.5 seconds is not just a user experience issue. It's a bounce rate issue (users who leave before the page loads), a conversion rate issue (users who stay but are frustrated), and a search ranking issue (Google explicitly deprioritizes slow-loading pages). A single unoptimized image can undermine an entire SEO strategy.
Social media platforms mitigate this by caching and serving images from their own CDNs. But the upload experience — the moment when your 5 MB PNG is being sent to Instagram's servers — can fail silently if the file is too large, resulting in Instagram's emergency compression being applied at much lower quality than your intentional compression would have been.
Content-Specific Thresholds
Different image types have different optimal compression thresholds:
- Photographs with natural texture (people, food, nature): 75–85% JPEG quality. Natural texture hides compression artifacts effectively. These images compress very well without visible degradation.
- Graphics with flat colors and text (infographics, slides, screenshots): Use PNG for lossless compression, or JPEG at 90%+ if PNG would be too large. Flat colors and sharp edges expose JPEG artifacts immediately at lower quality settings.
- Photographs with very smooth gradients (skies, minimalist studio shots): 80–90% JPEG. Smooth gradients are more susceptible to banding at lower quality settings.
- Thumbnails and small images (under 300 × 300 px display): 70–75% JPEG quality. At small sizes, the artifacts are invisible but the file size savings are significant for performance.
The Second Pass: Secondary Optimization
After exporting from your design tool, running the image through a secondary optimizer typically achieves an additional 10–20% file size reduction. Tools like TinyPNG, Squoosh, or ImageOptim use more sophisticated entropy encoding than most design app exporters, finding redundancies in the compressed data that the first pass missed.
For most content creators, this step is optional — the savings from the first-pass quality setting are already substantial. For web developers where every kilobyte matters, the second pass is worth automating into the build pipeline.
My Practical Workflow
For each image I create for social media:
- Design at the correct platform dimensions (1080 × 1350 for Instagram, etc.)
- Export as JPEG at 80–85% quality, sRGB color profile
- Check file size — if under 500 KB, done; if over 1 MB, run through TinyPNG
- Quick visual check for artifacts, especially in gradient areas
This workflow takes less than 30 seconds per image and produces files that look excellent across all platforms. The total additional time investment compared to just exporting at 100% quality is minimal. The difference in output quality — measured by how Instagram, Facebook, and LinkedIn's encoders treat the file — is meaningful.
Quality and performance are not opposites. They are complementary goals that a thoughtful compression workflow achieves simultaneously.