Lazy loading makes the browser request an image or a video only when it is about to appear on screen, instead of downloading them all at the door. It saves data and speeds up the start, but only when applied to what is below the fold. Applied to the image at the top, it makes the page slower.
What to defer and what not
| Element |
Defer? |
Why |
| The main image at the top of the page |
Never |
It is nearly always the LCP element. Deferring it makes the browser wait before asking for it. See how to fix LCP. |
| Logo and header images |
No |
They show up at once. |
| Images further down the text, galleries, footer |
Yes |
The visitor may never get there. |
| Embedded videos and maps (iframes) |
Yes |
Each one pulls in many files and scripts. This is where deferral saves most. |
| Images inside closed tabs and accordions |
Careful |
Some solutions fail to find them when the tab opens. Test. |
How to switch it on
| 1 |
The native attribute. loading="lazy" on the <img> or <iframe> is all it takes. WordPress adds it by itself to images and iframes in the content, so it is often already on. Check the page’s code.
|
|
| 2 |
In LiteSpeed Cache, the page optimisation tab has deferral options for images and iframes. The names change between plugin versions. If you already use WordPress’s native loading, do not switch both on: one of them is redundant.
|
|
| 3 |
For a YouTube video or a map, the best saving is to show a picture with a button and load the video only on click. Plugins exist for that. Check that the button works on a phone.
|
|
| 4 |
Test the page by scrolling on a phone: images must appear without a blank “hole”, and the content must not jump. See how to fix CLS.
|
|
|
Without a size, deferral causes jumps. A deferred image with no width and height reserves no space: when it arrives, it pushes the text. Always declare the dimensions.
|
|
Script-based deferral can hide images from Google. The native attribute is the one search engines understand best. Solutions that only load the image after a scroll gesture can leave it unindexed. If you use one, confirm in Search Console’s URL Inspection.
|
|
The heavy ones first. Deferring huge images is putting a plaster on the problem. Reduce dimensions and weight first (see image optimisation and WebP) and leave deferral for what remains.
|
For someone visiting on a phone with mobile data the gain is concrete: fewer megabytes downloaded before they have even scrolled, and less data spent on images they never get to see.
|
Switched deferral on and some images do not show, or the page jumps? Send us the address and the plugin you use.
Open a support ticket
|
RECOMMENDED PRODUCT Web hosting with cPanel Domain and SSL included, daily backups and the panel you already know. from $6.59/mo (3-year plan, with coupon) See plans |
Português
English
