Lazy loading помогает ускорить сайт, но при плохой схеме режет конверсию и CR

Lazy loading помогает ускорить сайт, но при плохой схеме режет конверсию и CR

Lazy loading нужен для картинок, видео и тяжёлых блоков ниже первого экрана. Он снижает вес initial load, но ломает сценарии, где элемент должен быть виден сразу: баннер с оффером, первый экран лендинга, меню, отзывы, CTA-кнопка.

Типовые ошибки:
— откладывают hero-image: LCP ухудшается, пользователю кажется, что сайт «тормозит»
— вешают lazy на все изображения подряд, включая те, что нужны above the fold
— подгружают контент только по scroll, а часть аудитории до него просто не доживает
— не задают размеры блоков: получаются прыжки layout и просадка по CLS

Рабочая схема простая:
— первый экран грузим eager
— всё ниже — lazy
— для изображений ставим width/height или aspect-ratio
— для важных картинок используем preload, если они влияют на LCP
— для лендингов с короткой страницей lazy часто даёт меньше пользы, чем хороший кеш и WebP

Проверка без гаданий: открой PageSpeed, посмотри LCP-элемент и проверь, не спрятан ли он за lazy. Если оффер, форма или CTA загружаются поздно, вы чините не скорость, а сами себе CR.