← Back to CROtricks
🚀 UX

Lazy load everything below the fold

Your landing page loads everything at once. Every image, every script, every font. Including the stuff at the bottom that nobody sees for another 5 seconds of scrolling. That's wasted time the visitor pays for upfront.

Lazy loading means: don't load it until the user is about to see it. Images, videos, testimonial sections, chat widgets. If it's below the fold, it can wait.

The impact is immediate. Pages that lazy load below-the-fold content see 30-40% faster initial load times. The user gets the above-the-fold content instantly. Everything else loads as they scroll.

The implementation is almost trivial now. Adding loading="lazy" to image tags handles most of it. For scripts, use the defer or async attribute. For heavy sections, use Intersection Observer to load them when they enter the viewport.

The biggest offenders are usually hero section background videos, image carousels with 10+ slides loaded at once, and third-party widgets like chat, analytics, and social embeds. Defer all of them. Your visitors get a faster page. Your conversion rate goes up.

Try this

Add loading="lazy" to every image below the fold. Defer non-critical scripts. Run Lighthouse before and after to measure the improvement.

Get ideas like this every week. Free.