Mobile app version of vmapp.org
Login or Join
Berryessa370

: How to satisfy GSPI's "Losslessly compressing ..." image optimization criteria? When running a website through Google PageSpeed Insights I get the following response: Optimize images Properly

@Berryessa370

Posted in: #GooglePagespeed #Images #Optimization

When running a website through Google PageSpeed Insights I get the following response:


Optimize images

Properly formatting and compressing images can save many bytes of
data.

Optimize the following images to reduce their size by XX.XKiB (X%
reduction).

Losslessly compressing
www.website.com/path/to/image/image_file.jpg could save
XX.XKiB (XX% reduction).


What do the tool mean by "Losslessly compressing?" Sounds like I could reduce the filesize without sacrificing image quality; but how?

10.02% popularity Vote Up Vote Down


Login to follow query

More posts by @Berryessa370

2 Comments

Sorted by latest first Latest Oldest Best

 

@Ravi8258870

In short, this means stripping out parts of the file that aren't required to display the image. For example, JPEG files may include EXIF data that contains information such as the make of camera used to take the photo. For PNGs it can also mean using different compression parameters that will yield better results for that specific file.

Free tools such as Trimage or ImageOptim make all this easy for you. Just give it an image (or folder of images), and it will spit out a losslessly optimised version.

10% popularity Vote Up Vote Down


 

@Annie201

Its a way to say compress your images.

Easiest way is to use an art program and save the image at a quality lower than 100%. Usually 60% to 70% quality is acceptable to much of the world. Anything lower than 60% and you'll notice some blur in some spots of the image.

If you use PHP, what you can do is load the image within it, and then output the image but with a lower quality like this:

<?php
header("content-type: image/jpeg",true);
$i=imagecreatefromjpeg("/path/to/image/on/server");
imagejpeg($i,NULL,75);
imagedestroy($i);
$i=NULL;
?>


The above outputs takes an image from the server computer and displays it on the screen at 75% of the normal quality. Check the file size of the new image within your browser and you'll notice the download size is less compared to the original image.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme