Unoptimized JPEG images that could be compressed further
This means that the URL in question is a JPEG image files that is unoptimized, and could be compressed further.
Why is this important?
Images often account for most of the downloaded bytes on a page. As a result, optimizing images can often yield some of the largest byte savings and performance improvements: the fewer bytes the browser has to download, the less competition there is for the client's bandwidth and the faster the browser can download and render content on the screen.
What does the Hint check?
This Hint will trigger for any internal or external JPEG image URL which could be compressed further.
Why is this Hint marked 'Opportunity'?
In Sitebulb, this Hint is an Opportunity, as it represents a situation where you could optimize the site further to improve performance.
Finding the optimal format and optimization strategy for your image assets requires careful analysis across many dimensions: type of data being encoded, image format capabilities, quality settings, resolution, and more. In addition, you need to consider whether some images are best served in a vector format, if the desired effects can be achieved via CSS, and how to deliver appropriately scaled assets for each type of device.
JPEG is a lossy format. The compression process removes visual details of the image, but the compression ratio can be 10x larger than GIF or PNG.
If you don't have access to image editing software, you could use and online tool such as TinyJPG. If you do, there are a number of other ways you can reduce JPEG file size without noticeably affecting the image:
- Reduce quality to 85 if it was higher. With quality larger than 85, the image becomes larger quickly, while the visual improvement is little.
- Reduce Chroma sampling to 4:2:0, because human visual system is less sensitive to colors as compared to luminance.
- Use progressive format for images over 10k bytes. Progressive JPEG usually has higher compression ratio than baseline JPEG for large image, and has the benefits of progressively rendering.
- Use grayscale color space if the image is black and white.
