Adaptive Image Loading

We deployed the image processing technology that scales images to the size of the layout container and converts them to a next-gen format — WebP.
Adaptive Image Loading is already active on all Tilda websites by default, you don't need to enable it. We tested the technology for several months, and are excited to tell you about it.
Learn more
Let's take a look at all the technologies used to optimize image loading on Tilda websites:
Lazy Load and CDN
Lazy Load has been active on Tilda for a long time now. The images are loaded gradually as the viewer scrolls down the page, not all at once.

CDN, or Content Delivery Network, is a network of servers deployed around the world. It picks the closest server to a visitor’s location and helps deliver images faster. For example, if a viewer is located in Berlin, he or she will receive an image directly from Germany, not from the US.

WebP support

Tilda automatically converts all website images to WebP. This next-gen format allows compression that reduces image size up to 35% compared to JPEG with no quality loss. You don’t need to upload images to your website in WebP format, Tilda will convert it for you.
Most modern browsers such as Chrome, Opera, Firefox and others support WebP. While the website is loading, the script checks if the browser supports the format and, if supported, requests WebP images from the server. If not supported, it will deliver original images as they were uploaded – JPEG or PNG. Conversion to AVIF, another new image format offering even better file size reduction, is on the pipeline.
Adaptive image resizing
The technology detects the dimensions of the browser and the layout container, then requests optimized images from the server.

Imagine you have uploaded a 1680 px wide photo into a block with multiple images. The size of each image container is 450x300 px. Therefore, a visitor will not receive an original photo but a scaled one according to the container dimensions.
Suppose a visitor accesses a website from a phone. To load a website cover on this device, the script will request a cropped image at correct resolution adapted to the screen.
The intelligent system is constantly analyzing website traffic on Tilda. The script prepares images optimized for the most used devices and browsers in advance. This method is more flexible than resizing on the fly: sometimes it is faster to download an original image than to resize and download an optimized one.
Retina displays and slow Internet connection
If a visitor uses a display with increased pixel density, the script will recognize it and request a high resolution image from the server. This way, images will appear crisp on Retina devices.

Although, in case the connection is slow (if a visitor is browsing from the countryside, for example), the system will request a smaller image. This will prevent page load speed from slowing down.
In some cases, Adaptive Image Loading may not work. There are several reasons for this:

1. You disabled Lazy Load in your website settings.
2. You disabled Lazy Load for an element in Zero Block.
3. An optimized version of an image has not been prepared yet. This happens if you have just uploaded a new picture on your website or if you are logging in from a device or a browser for the first time.
4. Your browser does not support WebP. Find the list of browsers that support the format here.
5. The difference between the original image size and its optimized version is insignificant; in this case, the system won’t compress nor crop the image.
Adaptive Image Loading is one of the most significant optimization technologies we have implemented in Tilda. We keep working hard to speed up the websites created on the platform. Stay tuned for more updates on Tilda blog, your personal account and social networks
You subscribed to the Tilda Newsletter because you agreed to receive our monthly news shot when you registered your email on https://tilda.cc.
To unsubscribe, click UNSUBSCRIBE