Uploading images to websites may sound simple, but don’t underestimate the opportunity to be had if technology is leveraged to optimise your website.
One of the biggest complaints from users is how slow websites can be to load. In fact, it’s such an issue that it’s one of the top 10 reasons why people leave a website. One study says that nearly half (47%) of consumers expect a web page to load in two seconds or less, and 40% of people will abandon a site that takes more than three seconds to load.
Website administrators have a tough task on their hands to ensure websites run smoothly. Using a website optimisation tool can help improve page performance and often, it’s a simple case of compressing your images.
Lossy vs. lossless
Compression of images generally falls under either one of the following categories: lossy or lossless. There are pros and cons of using either method, so it totally depends on the website and the environment in which it is trying to perform.
Lossy
Lossy compression is where the file is reduced in size while degrading the quality of the image for the user. Typically, this is done through algorithms that reduce the number of colours in the image, which can lead to blurry quality down the line. JPEGs and GIFs are both lossy formats. The more an image is lossy compressed, the worse it will look.
Using lossy compression means that once the image is compressed, there is no going back to the original file. The quality has been trimmed and therefore so has the image size. Lossy compression allows for very small file sizes and can help toward a speedy website, but the balance must be made with quality loss.
Lossless
Lossless compression is compressing images without resulting in quality loss. This can be done with JPEG, PNG, RAW, BMP and GIF formats. Unnecessary meta data is stripped from images and the file can be decompressed back to original quality.
The main benefit of lossless compression is that the same high quality of image is presented to consumers without the bloat of a large, unoptimised image file. Typically, lossless compression is ideal on larger images, such as sliders where first impressions count.
In closing, there is no right or wrong way to use image compression to your advantage. Each of these technologies have their pros and cons, so the balance must be made between aesthetics and website performance. The more images a site must pull, the slower it will be. The more bits and bytes saved sending across the web and the better the optimisations in the back end, the more opportunity your site has to flourish.
- What videos should you post on your website? - February 17, 2021
- Google Core Web Vitals: What is Cumulative Layout Shift (CLS)? - February 10, 2021
- Google Core Web Vitals: What is First Input Delay (FID)? - February 3, 2021
