Представьте: вы платите по 80 рублей за клик из рекламы, человек нажимает на объявление — и три секунды смотрит на белый экран, пока грузится ваш красивый первый экран с анимацией. Часть этих людей не дождётся. Они вернутся назад в выдачу к конкуренту, а вы заплатили за клик, который не превратился даже в просмотр оффера. Вот так абстрактная «скорость загрузки» превращается во вполне конкретные слитые деньги.
Скорость — это не про техническое перфекционизм ради циферок в отчёте. Это про две вещи, которые касаются каждого: сколько посетителей вы теряете до того, как они увидели предложение, и насколько высоко вас ставит поиск. Я разберу, что такое Core Web Vitals человеческим языком, покажу шесть точек, где лендинг чаще всего тормозит, и научу замерять страницу бесплатно за минуту.
Материал из раздела «Разработка ПО» — полезен и заказчику, и исполнителю. Рядом — сравнение технологий и чек-лист приёмки.
Что вы узнаете из статьи
- Что такое Core Web Vitals и почему их три, а не одна
- Как именно скорость бьёт по конверсии — в цифрах
- Почему медленная страница проседает в поиске
- Шесть точек, где лендинг тормозит чаще всего
- Как замерить скорость бесплатно и что просить у разработчика
Core Web Vitals: три метрики по-человечески
За пугающим термином Core Web Vitals прячутся всего три показателя, которыми поисковики оценивают, удобно ли человеку на странице. Разберём без жаргона.
Первый — LCP, время до прорисовки основного контента. Грубо: за сколько секунд посетитель видит главное — заголовок, картинку, оффер, а не пустоту. Хорошо — до 2,5 секунды. Второй — INP, отзывчивость: насколько быстро страница реагирует, когда вы тыкаете в кнопку или открываете меню. Если после клика секунду ничего не происходит — это плохой INP, и человек думает, что всё зависло.
Третий — CLS, стабильность вёрстки. Знакомо ощущение, когда читаешь, а текст вдруг прыгает вниз, потому что сверху догрузилась картинка, и ты случайно жмёшь не туда? Вот это и есть высокий CLS, и он бесит. Все три метрики Google и Яндекс измеряют у реальных пользователей и учитывают в ранжировании. И вот что важно: чистая верстка обычно даёт их лучше, чем перегруженный конструктор — это один из доводов в споре конструктор или код, когда проект идёт на серьёзный трафик.
Как скорость превращается в деньги и позиции
Теперь к сути — зачем вообще на это смотреть. Две причины, обе про результат.
Первая — конверсия. Цифры тут безжалостные. По исследованиям Google, когда время загрузки растёт с 1 до 3 секунд, вероятность, что человек уйдёт, не дождавшись, поднимается примерно на 32 процента. К пяти секундам она почти удваивается. Переведите это на язык бюджета: вы льёте трафик, платите за каждого, а медленная страница отсекает часть людей ещё до оффера. Это не «недополученная прибыль» абстрактно — это конкретный процент рекламного бюджета в трубу.
Вторая причина — поиск. И Google, и Яндекс прямо учитывают скорость и Core Web Vitals при ранжировании. Из двух похожих по контенту лендингов выше встанет тот, что быстрее и стабильнее. Для платного трафика скорость влияет ещё и на стоимость клика: рекламные системы дают медленным страницам худший показатель качества, и клик обходится дороже. Получается двойной штраф — и людей теряете, и платите за них больше. Поэтому скорость стоит проверять не после запуска, а прямо при приёмке, пока есть рычаг попросить исправить.
Шесть точек, где лендинг тормозит
Хорошая новость: тормозят лендинги предсказуемо, и почти всё чинится без переделки. Вот шесть мест, куда смотреть в первую очередь.
| Точка | Проблема | Что делать |
|---|---|---|
| Картинки | тяжёлые, в старых форматах | сжать, перевести в WebP/AVIF |
| Загрузка фото | грузятся все сразу | отложенная загрузка (lazy load) |
| Скрипты | много чатов, пикселей, счётчиков | убрать лишнее, грузить асинхронно |
| Шрифты | тяжёлые, блокируют рендер | подгрузить только нужные начертания |
| Код | лишний CSS и JS | минификация, чистка неиспользуемого |
| Кэш | ничего не кэшируется | настроить кэширование и сжатие |
Самый жирный эффект обычно дают первые две строки — картинки. Лендинг с фоновым фото на 4 мегабайта в формате PNG будет тормозить на любом телефоне, и просто пересжав изображения в WebP, страницу часто ускоряют вдвое. Вторая по силе точка — сторонние скрипты: каждый виджет чата, пиксель и счётчик тянет свой код, и десяток таких добавок незаметно превращает быструю страницу в медленную.
Остальное — тонкая настройка, которую делает разработчик: ленивая загрузка, чтобы фото снизу страницы не грузились, пока до них не долистали; асинхронные скрипты, чтобы они не блокировали показ контента; кэширование, чтобы при повторном заходе страница открывалась мгновенно. По отдельности каждая мелочь даёт немного, вместе — заметный прирост.
Как замерить за минуту — бесплатно
Не надо быть разработчиком, чтобы понять, тормозит ваша страница или нет. Откройте PageSpeed Insights от Google, вставьте адрес лендинга — и через полминуты получите оценку отдельно для мобильной и десктопной версии, все три метрики Core Web Vitals и список конкретных проблем с рекомендациями. Для российского сегмента загляните ещё в раздел скорости в Яндекс.Вебмастере.
Как читать результат. Оценка по мобильной версии важнее десктопной — большая часть трафика с телефонов, и Google смотрит в первую очередь на мобайл. Зелёная зона (90+) — отлично, жёлтая (50–89) — терпимо, но есть куда расти, красная (ниже 50) — повод серьёзно поговорить с разработчиком. Ниже оценки идёт список «возможности» — это и есть готовый список задач: «сожмите изображения», «уберите неиспользуемый JS». Передайте его исполнителю — и просите не общих слов, а движения цифры вверх.
Важная оговорка для честности: гнаться за 100 из 100 любой ценой не нужно. Идеальный балл иногда требует жертвовать нужными эффектами или аналитикой, и разница между 85 и 100 для пользователя почти неощутима. Цель — уйти из красной зоны и закрепиться в зелёной по мобайлу, а не выбить максимум ради скриншота. Скорость — лишь одна из опор конверсии; что ещё влияет на конверсию, не менее важно, и об этом отдельный разговор.
Как платформа помогает с этим
На Где.Эксперт в портфолио разработчиков видно не только «красивые» лендинги, но и то, как они относятся к технической стороне. В описании задачи можно прямо указать требование: целевая оценка PageSpeed по мобайлу, форматы картинок, лимит на сторонние скрипты — и получить отклики от тех, кто такое умеет, а не только рисует.
Это снимает типичную беду, когда заказчик узнаёт про скорость уже после запуска. Требование к производительности становится частью ТЗ, проверяется при приёмке и фиксируется в чате заявки. А отзывы прошлых клиентов подсвечивают исполнителей, для которых скорость — не пустой звук. Оплата по факту, контроль на каждом этапе.
Часто задаваемые вопросы
Что такое Core Web Vitals простыми словами?
Три метрики удобства: LCP — за сколько грузится основной контент, INP — как быстро страница реагирует на клики, CLS — не прыгает ли вёрстка. Все три влияют и на удобство, и на позиции, и замеряются бесплатно.
Насколько скорость влияет на конверсию?
Сильно. По данным Google, при росте загрузки с 1 до 3 секунд вероятность ухода растёт примерно на 32%, к 5 секундам почти удваивается. На платном трафике это прямые потери бюджета.
Как бесплатно проверить скорость?
Через PageSpeed Insights: вставьте адрес, получите оценку для мобайла и десктопа, метрики и список проблем. Для рунета полезен раздел скорости в Яндекс.Вебмастере.
Что чаще всего тормозит лендинг?
Тяжёлые несжатые картинки, отсутствие ленивой загрузки, много сторонних скриптов, неоптимизированные шрифты и лишний код. Картинки и скрипты дают самый большой эффект.
Можно ускорить готовый лендинг без переделки?
Обычно да: сжатие картинок, современные форматы, ленивая загрузка, чистка скриптов и кэш дают ощутимый прирост. Полная пересборка нужна редко.
Заключение
Скорость загрузки лендинга — это не про технический перфекционизм, а про деньги и позиции. Медленная страница теряет посетителей ещё до оффера (а вы за них заплатили) и проседает в поиске. Core Web Vitals — три понятные метрики: грузится ли контент быстро, отзывчива ли страница, не прыгает ли вёрстка.
Запомните главное: замеряйте через PageSpeed по мобильной версии, начинайте оптимизацию с картинок и сторонних скриптов — там самый жирный эффект, проверяйте скорость при приёмке, а не после запуска, и не гонитесь за 100 из 100 в ущерб нужным функциям. Цель — уверенно сидеть в зелёной зоне на телефоне, и тогда трафик не утекает сквозь пальцы.
Найдите разработчика на Где.Эксперт — впишите требования к скорости в задачу, проверьте на приёмке и платите по факту выполнения.