GOOGLE CORE WEB VITALS

Minimising the time it takes visitors to view and interact with webpages is an over-arching goal of web design. They should be stable as well - i.e. not jump around all over the page particularly when there are images in the page.

Google recognises three key performance metrics that a webpage should optimise in order to offer its visitors the best possible experience -

how long it takes to load
how long it takes to become interactive
how visually stable it is

An ever-increasing volume of webpages are consumed on mobile devices. Moreover, in most cases images form a majority of webpage content in terms of download size. Together, this leads to the obvious conclusion that optimising images for download shortens load times. The smaller the images, the quicker they transfer and load in the browser.

And the quicker they load, the faster the webpage is presented to the user, According to Google's current recommendation, this translates to loading the largest content in the viewport within 2.5 seconds. Google calls this metric Largest Contentful Paint.

In many cases, it will be images that cause LCP to go beyond 2.5 seconds.

Two major factors in optimising image delivery are:

deliver them as small as possible
deliver them through a Content Delivery Network

The simplest and most effective way to achieve both these goals is to use a Digital Media management service that offers on-the-fly media transformation delivered through a comprehensive CDN network. Our website builder uses Cloudinary - a bit expensive maybe but unmatched in terms of functionality and service.

The Web Almanac for 2024 tells us that the median size of images contributing to LCP is 124KB on desktop and 94KB on mobile devices.

Let's see how we can do better.

The same photo scaled down to 25% of its original size delivered in WEBP format at 80% of the original quality is 11 times smaller.

While the smaller image admittedly isn't as sharp, it still manages to convey the same message, i.e a field of red poppies.

The original 126K JPEG image was uploaded to Cloudinary who automatically delivers it through its CDN and converts it to WEBP on the webpage.

Our website builder prefers that you