Скорость — единственный параметр дизайна, который одновременно влияет на конверсию, позиции в поиске и стоимость рекламы. И единственный, который легко измерить объективно.
При этом «сайт быстрый» — не про ощущение разработчика на офисном интернете. Это про измеримые метрики на реальных устройствах пользователей.
Три метрики, которые имеют значение
LCP — когда появился главный элемент
Largest Contentful Paint измеряет момент, когда отрисовался самый крупный видимый элемент — обычно это картинка первого экрана или заголовок. Хорошим считается результат до 2,5 секунды.
Главные виновники плохого LCP: тяжёлые неоптимизированные изображения, медленный сервер, шрифты, блокирующие отрисовку, и скрипты сторонних сервисов в самом верху страницы.
INP — насколько отзывчив интерфейс
Interaction to Next Paint показывает, как быстро страница реагирует на действия: клик по кнопке, открытие меню, ввод в поле. Цель — до 200 миллисекунд.
Плохой INP почти всегда означает избыток JavaScript: тяжёлые библиотеки ради одного эффекта, аналитика в несколько систем сразу, чаты и виджеты, загружаемые синхронно.
CLS — прыгает ли вёрстка
Cumulative Layout Shift измеряет, насколько содержимое «дергается» во время загрузки. Знакомая ситуация: вы целитесь в кнопку, сверху догружается баннер, и вы попадаете не туда. Цель — меньше 0,1.
Лечится просто: у всех изображений и видео указаны размеры, для баннеров и рекламы зарезервировано место, шрифты подключены так, чтобы подмена не меняла высоту блоков.
Как измерять правильно
- PageSpeed Insights — быстрый чек конкретной страницы. Смотрите вкладку с полевыми данными реальных пользователей, а не только лабораторный тест.
- Search Console — отчет Core Web Vitals по всему сайту, сгруппированный по типам страниц. Именно он показывает системные проблемы.
- Lighthouse в браузере — для проверки после каждой правки.
- Реальные устройства — недорогой Android на мобильном интернете покажет правду лучше любого эмулятора.
Проверяйте не главную, а типовые страницы: карточку товара, статью, страницу услуги. Проблемы обычно живут там, где больше всего трафика, а не там, где красивее всего.
Что чинить в первую очередь
По нашему опыту, порядок эффективности такой:
- Изображения — современные форматы, правильные размеры, ленивая загрузка всего, что ниже первого экрана. Обычно это половина проблемы.
- Шрифты — только нужные начертания, подключение через display: swap, предзагрузка основного.
- Сторонние скрипты — аудит: что реально используется. Часто на сайте висят три системы аналитики и два чата, из которых работает один.
- Кэширование и сжатие на сервере — быстро настраивается, даёт заметный эффект.
- Только потом — оптимизация собственного кода.
Сколько это стоит в деньгах
Простая арифметика: если сайт получает тысячу визитов в месяц при конверсии 2%, это 20 заявок. Ускорение, которое поднимает конверсию всего на четверть процентного пункта, даёт еще две-три заявки в месяц бесплатно, без увеличения рекламного бюджета. На больших объёмах разница считается уже сотнями тысяч.
Поэтому в наших проектах PageSpeed 90+ — не бонус, а условие приёмки. Медленный сайт мы просто не сдаем.