Lazy-Load Images Below the Fold

Lazy-Load Images Below the Fold

Below the fold means everything a visitor has to scroll to see. Loading those images immediately wastes bandwidth and slows your LCP. Lazy-loading delays them until the visitor scrolls near — like only turning on lights in rooms you actually walk into.

The checklist:
—
1. Identify images NOT visible when the page first opens.
—
2. Add loading="lazy" to each of those image tags.
—
3. Crucial: do NOT lazy-load your hero or LCP image — that delays your most important pixel.
—
4. Reload and scroll slowly to watch them appear.
—
5. Re-test in PageSpeed Insights.

That one exception — never lazy-load the top image — trips up a lot of people, so remember it.

Try this: Add loading lazy to your footer and sidebar images, but leave the hero untouched.