Welcome back for another video. My name is Larry Snow, and in this video, I am showing you a couple of online image optimization tools to reduce the file size of images before I upload them to my website and why image compression is a huge factor to a faster loading website.
So, let’s get started…
Image Optimization Increases Page Speed
Images often account for most of the downloaded bytes on a web page and also often occupy a significant amount of visual space. As a result, optimizing images can often yield some of the largest byte savings and performance improvements for your website: 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 useful content on the screen.
If you have ever waited on a site with large image files to load, you have seen why image compression is necessary. To compress images means you take away or regroup parts of an image so that it takes up less space.
Long load times will cause more of your customers to abandon your page in search of another one. Long load times may affect your website’s Google search results rank.
Lossy vs. Lossless
There are two basic algorithms used for compression – lossy and lossless. Lossy compression makes changes that create lower quality images. The smaller you make the file, the more noticeable your differences between the original and the compressed file become.
Lossless compression algorithms don’t discard any information, so they result in larger files than lossy compression generates. Lossless compression finds better ways to store the information, and the picture does not lose any quality.
An example of a lossy type of image is JPG or JPEG. A GIF image is another example. Lossless image types are PNG and TIFF.
There are many different tools available to compress images
In this video, I show you the Google Chrome Labs web app Squoosh and Optimizilla. Others I have tried are Compressor.io, tinyPNG, and Compress Now.
Squoosh (https://squoosh.app) is a progressive web app (PWA) that works with any browser on desktop and
Since it is a PWA, ChromeOS users and Windows 10 users with the latest version of Chrome will be able to use Squoosh like a native app.
Users can drag and drop an image onto the interface or select a file and then pick the optimal image format, resize the image, set a certain browser quality, and reduce the palette.
The idea is to help developers pick an optimal image format and make edits to minimize the size of the image file used for the web without sacrificing image quality too much.
Optimizilla online image optimizer (https://imagecompressor.com/) uses a smart combination of the best optimization and lossy compression algorithms to shrink JPEG and PNG images to the minimum possible size while keeping the required level of quality. So unlike Squoosh where there is a lossless option, Optimizilla only provides lossy compression.
One of the great features of Optimizilla is the ability to upload up to 20 images at once. Optimizilla also has much simpler controls. Just a lever to control quality to your liking. Also, notice that you can’t change image type. If you upload a JPG to compress, you download a compress JPG. Squoosh enables you to change the image type from JPG to PNG or vice versa. Once finished,