Decrease the size of your web images for all browsers using Google's WebP image format that is supported on all major browsers. They report that you can gain savings of roughly a quarter of a PNG file. PNG files are typically tiny therefore to save even more is very attractive. Google have taken the trouble of providing the required tools given that you won't find them on your typical image editor.
WebP uses a predictive algorithm to determine the amount of information required for subsequent pixels. You can read more about how it works here. Pre-compiled binaries are available for your respective platform from: https://developers.google.com/speed/webp/docs/precompiled
Once you download the binaries you will need to place them in an appropriate folder and edit your `PATH` variable.
~$ sudo cp -rvf ~/Downloads/libwebp-1.1.0-rc2-mac-10.15 /opt
Check that everything works fine:
~$ /opt/libwebp-1.1.0-rc2-mac-10.15/bin/cwebp -h
Now add this to your bash config (~/.bashrc or ~/.bash_profile, depending on your platform).
~$ vi ~/.bash_profile
I've added the following:
# webp
export PATH="${PATH}:/opt/libwebp-1.1.0-rc2-mac-10.15/bin"
Then open a fresh terminal window/tab.
Now the following should work:
~$ cwebp --h Usage: cwebp [options] -q quality input.png -o output.webp where quality is between 0 (poor) to 100 (very good). Typical value is around 80. Try -longhelp for an exhaustive list of advanced options.
And perform a conversion like so:
~$ cwebp empiar-10070-thumbnail.png -v -o empiar-10070-thumbnail.webp Time to read input: 0.003s Saving file 'empiar-10070-thumbnail.webp' Time to encode picture: 0.008s File: empiar-10070-thumbnail.png Dimension: 200 x 200 Output: 12344 bytes Y-U-V-All-PSNR 36.22 35.00 38.13 36.24 dB (2.47 bpp) block count: intra4: 167 (98.82%) intra16: 2 (1.18%) skipped: 0 (0.00%) bytes used: header: 214 (1.7%) mode-partition: 960 (7.8%) Residuals bytes |segment 1|segment 2|segment 3|segment 4| total macroblocks: | 46%| 20%| 21%| 14%| 169 quantizer: | 33 | 25 | 18 | 15 | filter level: | 10 | 5 | 3 | 2 |
You can set the quality of the output using the -q flag with takes a value from 0 to 99: