Image Compression Quality Explained
Understand lossy and lossless compression, quality controls, artifacts and how to choose an acceptable image export.
Published
An image quality setting controls how an encoder trades visual information for file size. It is not a universal percentage of quality retained, and a value of 80 in one format or tool is not guaranteed to match 80 somewhere else. The only reliable decision combines the real output image, its intended display size and its measured file weight.
What the slider really means
Higher settings usually preserve more detail and create larger files.
Lower settings usually remove more information and make artifacts more likely.
The numeric scale belongs to the encoder; it is not an objective cross-format score.
Different images react differently to the same setting.
Review important details at normal size and at a closer inspection view.
One photograph, three WebP settings
Conservative. 241.0 KiB. WebP. 1536 × 1024. Quality 85. Detailed café photograph encoded as WebP at quality 85
Lighter. 125.3 KiB. WebP. 1536 × 1024. Quality 60. Same detailed café photograph encoded as WebP at quality 60
Aggressive. 79.9 KiB. WebP. 1536 × 1024. Quality 30. Same detailed café photograph encoded as WebP at quality 30
OptimizePixels encoded its 2,593,719-byte PNG master to WebP at unchanged 1536 × 1024 dimensions. Quality 85 produced 246,744 bytes, quality 60 produced 128,350 bytes and quality 30 produced 81,810 bytes. Open each image at full size and inspect hair, foliage, woven textures, glass and the sky gradient. This shows the trade-off for this source and encoder—not universal safe settings.
Lossy and lossless compression
Question. Lossy. Lossless
What happens to image data?. Some information is discarded to reduce size. Decoded pixel data is preserved
Typical file-size potential. Often much smaller for photographs. Often larger, especially for complex photographs
Common web use. Photos, hero images and product imagery. Screenshots, diagrams, transparency and exact raster detail
Main risk. Artifacts or lost detail. Unnecessarily heavy delivery files
Where compression damage appears
Look for block-like patterns, ringing around sharp edges, smearing in fine texture, colour banding in smooth gradients and loss of subtle detail in hair, fabric or foliage. Small text and interface captures may become fuzzy even when a photograph at the same setting looks acceptable.
Dark gradients and low-contrast textures deserve special attention because damage can be difficult to notice in a bright editor and much clearer on another display. Transparency edges can also reveal halos when the wrong format or matte treatment is used.
Why file-size savings slow down
At high settings, reducing quality may remove data that has little visible effect and produce a worthwhile saving. As settings fall further, each additional saving can require discarding increasingly noticeable information. The useful point is often near that bend: before visible damage accelerates relative to the bytes saved.
Quality and dimensions interact
A smaller image can sometimes tolerate a different compression setting because fine detail is less visible at its rendered size. Conversely, a prominent full-width image may expose artifacts that disappear in a thumbnail. Always establish realistic delivery dimensions before final quality tuning.
Find an acceptable quality setting
Create a high-quality baseline
Export at a conservative setting and confirm that format, dimensions, colour and transparency are correct before reducing quality.
Move downward in visible steps
Test several values rather than changing one point at a time. When you find the range where damage becomes noticeable, compare more closely within that range.
Inspect vulnerable areas
Check faces, text, gradients, edges and repeated texture. Compare at normal display size and use a closer view to identify what the encoder changed.
Weigh the saving against the damage
Prefer the lighter output only when its saving is meaningful in the page context and its visual compromises are acceptable.
Do not compare quality numbers across formats
A WebP quality value, an AVIF quality value and a JPEG quality value do not form a shared measurement scale. Compare rendered outputs at similar perceived quality and use their actual file sizes for the decision.
Quality-setting questions
Does quality 100 mean lossless?
Not necessarily. In a lossy format or mode, the highest quality setting can still involve lossy encoding. Select a genuine lossless mode when exact decoded pixels are required.
Is quality 80 always safe?
No. It is a common starting region for some photographic encoders, but screenshots, gradients and detailed images may need different treatment. Inspect the output.
Should I reject any visible difference?
That depends on the asset. A small difference visible only under extreme zoom may not matter in delivery, while damage to text, branding or a product feature can be unacceptable.
Can an automated score replace visual review?
Metrics can help compare experiments, but they do not understand the business importance of a face, label, logo or interface detail. Use them alongside contextual review.
Compare quality settings directly
Process an image locally, inspect the result and choose the trade-off yourself.