Core Web Vitals: как ускорить сайт под Яндекс и Google

Core Web Vitals: как ускорить сайт под Яндекс и Google

Пользователь кликнул по вашему объявлению в Директе, страница думает три секунды, потом картинка дёргается, и кнопка «Оставить заявку» уезжает вниз ровно в момент тапа. Палец попал в баннер. Человек закрыл вкладку. Вы за этот клик заплатили, а заявку не получили.

Core Web Vitals про такие моменты. Это три метрики Google, которые измеряют, насколько быстро и стабильно страница ведёт себя у реального посетителя, а не в идеальной лаборатории. Для B2B, где клик в платном канале стоит дорого, а цикл сделки длинный, потеря человека на первой секунде бьёт по экономике сильнее, чем кажется.

Ниже разберём, что именно меряют эти метрики, какие пороги считаются нормой, что с этим делать руками и почему под Яндекс и Google логика немного разная.

Что такое Core Web Vitals и из чего они состоят

Core Web Vitals (CWV) это набор из трёх показателей, которыми Google описывает качество загрузки страницы глазами посетителя. Каждый отвечает за свою сторону опыта.

  • LCP, Largest Contentful Paint. Время до отрисовки самого крупного видимого элемента: главной картинки, заголовка, баннера. Грубо говоря, через сколько секунд человек видит, что страница загрузилась.
  • INP, Interaction to Next Paint. Задержка отклика на действие: клик, тап, ввод в форму. Меряет, не подвисает ли интерфейс, когда с ним пытаются взаимодействовать. INP заменил старую метрику FID в марте 2024 года и спрашивает с сайта строже.
  • CLS, Cumulative Layout Shift. Визуальная стабильность. Считает, насколько элементы прыгают во время загрузки. Та самая ситуация, когда вы целитесь в кнопку, а подгрузившийся баннер сдвигает её под палец.

Важная деталь: Google смотрит не на ваш единичный замер, а на данные реальных пользователей за 28 дней, по 75-му перцентилю. Это значит, что хорошо должно быть у 75% посещений, а не в среднем. Один быстрый визит с вашего рабочего ноутбука картину не делает.

Какие значения считаются хорошими

Пороги Google делит на три зоны: «хорошо», «нужно улучшить» и «плохо». Ниже ориентиры на середину 2026 года, проверьте актуальные в PageSpeed Insights, потому что Google периодически ужесточает планку (по LCP в 2026 году обсуждалось смещение порога в сторону 2 секунд).

Пороги Core Web Vitals (ориентир на 2026 год)
Метрика Что меряет Хорошо Плохо
LCP Скорость отрисовки главного блока до 2,5 с больше 4 с
INP Отклик на клики и ввод до 200 мс больше 500 мс
CLS Стабильность вёрстки до 0,1 больше 0,25

Запоминать наизусть не нужно. PageSpeed Insights и Яндекс Вебмастер сами раскрасят метрики и подскажут, что в красной зоне.

Влияют ли Core Web Vitals на позиции под Яндекс и Google

Тут начинается главная развилка для российского рынка.

У Google всё прозрачно. Core Web Vitals официально входят в сигналы ранжирования с 2021 года. Это не главный фактор, контент и ссылки весят больше, но при прочих равных быстрый сайт обходит медленный, особенно в мобильной выдаче.

Яндекс отдельную метрику Core Web Vitals публично сигналом ранжирования не называет. При этом скорость загрузки и удобство он учитывает давно: через поведенческие факторы и косвенно через ИКС, индекс качества сайта. Логика простая. Медленный сайт растит отказы, люди уходят, не дождавшись загрузки, а рост отказов Яндекс видит и трактует не в вашу пользу. Так что оптимизировать под Яндекс стоит, просто измеряйте результат не баллами CWV, а поведением: глубина просмотра, время на странице, доля отказов в Метрике.

Вывод по обеим системам один. Гнаться за зелёными цифрами ради цифр смысла мало. Скорость нужна, чтобы посетитель дошёл до заявки, а не закрыл вкладку. Подробнее про различия алгоритмов мы писали в разборе SEO под Яндекс и Google, здесь же сосредоточимся на технике.

С чего начать: измерение перед оптимизацией

Чинить вслепую дорого. Сначала замеры.

  1. PageSpeed Insights. Вставляете URL, получаете оценку по мобайлу и десктопу плюс данные реальных пользователей, если трафика хватает. Смотрите сначала на блок полевых данных (CrUX), он ближе к правде, чем лабораторный.
  2. Яндекс Вебмастер. Раздел со скоростью загрузки показывает картину глазами Яндекса по вашему живому трафику. Для рунета это первый источник, потому что аудитория и устройства тут реальные ваши.
  3. Веб-архив отчётов в Search Console. Если сайт подключён, отчёт Core Web Vitals группирует страницы по типам, и видно, проблема на одном шаблоне или на всём сайте.

Дальше работает правило Парето. Чаще всего 2-3 причины дают 80% тормозов: тяжёлые картинки, лишние скрипты и медленный хостинг. С них и начинайте.

LCP: как ускорить отрисовку главного блока

LCP проседает почти всегда из-за веса того, что грузится первым. Порядок действий.

Сожмите и переведите картинки в современный формат. Hero-баннер на 1,5 мегабайта в PNG это классика B2B-лендингов. Переведите в WebP или AVIF, ужмите под реальный размер показа. Картинка шириной 600 пикселей не должна весить как фотобанк в 4К. По нашему опыту на сайтах услуг это снимает заметную долю задержки LCP, цифры условные и зависят от исходного бардака.

Не грузите всё сразу. Картинки ниже первого экрана отдавайте через ленивую загрузку (loading="lazy"), а вот главный LCP-элемент, наоборот, грузите в приоритете и не вешайте на него lazy.

Проверьте хостинг и ответ сервера. Если сервер думает над первым байтом дольше 0,6 секунды, никакая оптимизация картинок до зелёной зоны не дотянет. Кэширование, CDN для статики, нормальный тариф у хостера. Это скучно, но работает.

Уберите рендер-блокирующие ресурсы. Тяжёлые CSS и шрифты, которые грузятся до отрисовки, отодвигают появление контента. Критический CSS встройте, остальное отложите.

Тема скорости шире одной метрики, общий чеклист мы собрали в материале про скорость загрузки сайта, он хорошо дополняет этот раздел.

INP: как убрать подвисания интерфейса

INP портит тяжёлый JavaScript. Браузер занят выполнением скриптов и не успевает ответить на клик. На B2B-сайтах виновники обычно одни и те же.

  • Сторонние скрипты. Чаты, виджеты обратного звонка, коллтрекинг, пять систем аналитики, два пикселя ретаргетинга. Каждый что-то делает в основном потоке. Проведите ревизию: что реально приносит данные, а что висит с запуска прошлого подрядчика и просто грузит страницу.
  • Аналитику и пиксели грузите отложенно. Метрика, счётчики, рекламные теги почти всегда можно повесить на загрузку через диспетчер тегов с задержкой, а не в первой строке кода.
  • Разбивайте длинные задачи. Если на странице тяжёлая логика (фильтры каталога, калькулятор стоимости), дробите вычисления, чтобы между ними браузер успевал отвечать на действия пользователя.

Для большинства сайтов услуг INP лечится именно чисткой сторонних скриптов. Меньше виджетов, быстрее отклик, выше шанс, что человек дойдёт до формы.

CLS: как убрать прыжки вёрстки

CLS дешевле всего исправить, и обиднее всего терять из-за него заявки.

Главное правило: резервируйте место заранее. Браузер должен знать размеры элемента до того, как тот загрузится.

  • У картинок и видео прописывайте атрибуты width и height или задавайте размеры через CSS. Тогда блок не схлопнут, пока грузится файл.
  • Под рекламные блоки, баннеры и виджеты держите контейнер фиксированной высоты. Пусть лучше будет пустое место долю секунды, чем прыжок контента.
  • Шрифты подключайте с font-display: swap и заранее заданными метриками, чтобы текст не дёргался при подмене.
  • Формы захвата и кнопки не вставляйте динамически поверх уже отрисованного контента. Именно это чаще всего сдвигает целевую кнопку под палец.

Стабильная вёрстка особенно важна на мобильных, где экран маленький и любой сдвиг сразу по кнопке. Про мобильную специфику есть отдельный разбор мобильной версии сайта.

Где остановиться: разумный предел оптимизации

Доводить все три метрики до идеальной зелёной зоны на сложном сайте бывает дорого и не всегда окупается. Ориентир такой.

Сначала вытащите всё из красной зоны в жёлтую и зелёную, это даёт основной эффект для людей и поиска. Дальше смотрите на экономику: если ради последних долей секунды нужно переписывать половину фронтенда, посчитайте, сколько заявок это реально добавит. Часто выгоднее вложить те же часы в офферы, формы или семантику. Скорость это гигиена, а не отдельный канал продаж. Технический фундамент мы подробнее разбирали в материале про техническое SEO.

Частые вопросы

Сколько весит скорость по сравнению с контентом для позиций? Меньше, чем контент и ссылки, но при прочих равных решает. Если две страницы одинаково релевантны запросу, быстрая получит преимущество, особенно в мобильной выдаче Google. В Яндексе скорость работает через поведение: медленный сайт растит отказы, и это бьёт по позициям косвенно.

Я улучшил сайт, а PageSpeed показывает старые цифры. Почему? Полевые данные (CrUX) копятся за 28 дней по реальным пользователям. После исправлений нужно подождать, пока накопится новая статистика. Лабораторный замер обновляется сразу, полевой с задержкой в несколько недель.

Можно ли ускорить сайт на конструкторе вроде Тильды? Частично. Картинки, отложенную загрузку скриптов и чистку лишних виджетов сделать реально. Но в коде платформы вы ограничены, и до идеальных значений конструктор не всегда дотягивает. Для большинства B2B-сайтов услуг этого хватает, чтобы выйти из красной зоны.

Что важнее для B2B: LCP, INP или CLS? Зависит от того, что у вас в красном. Универсального ответа нет. Начните с метрики, которая в худшей зоне по вашим данным. На лендингах услуг чаще всего проседает LCP из-за тяжёлого hero-баннера, а CLS из-за прыгающих форм.

Нужно ли вообще заниматься CWV, если основной трафик из Яндекса? Да, но измеряйте результат поведением, а не баллами Google. Скорость и стабильность снижают отказы, а отказы Яндекс учитывает через поведенческие факторы и ИКС. Цель та же: довести посетителя до заявки.

Хватит ли просто поставить плагин кэширования? Кэширование помогает с ответом сервера и LCP, но INP и CLS оно не лечит. Подвисания от скриптов и прыжки вёрстки правятся отдельно. Плагин это первый шаг, а не вся работа.

Коротко: чеклист перед запуском

  • Замерьте сайт в PageSpeed Insights и Яндекс Вебмастере, найдите красные зоны.
  • LCP: сожмите картинки, переведите в WebP или AVIF, проверьте ответ сервера.
  • INP: проведите ревизию сторонних скриптов, отложите аналитику и пиксели.
  • CLS: задайте размеры картинкам, зарезервируйте место под баннеры и виджеты.
  • Вытащите метрики из красной зоны, дальше считайте окупаемость каждой доли секунды.
  • Проверьте результат через 2-4 недели по полевым данным и по отказам в Метрике.

Скорость сайта это не разовая задача, а гигиена, к которой возвращаются после каждой большой правки. Если хочется не разбираться в формате картинок и тегах самому, а получить сайт, который реально приводит заявки, мы в Lead The Way разбираем техническую часть вместе с аналитикой и трафиком. Расскажите про свой проект, посмотрим, где у вас утекают деньги на медленных страницах.

Источники по метрикам и порогам: corewebvitals.io, web.dev / Google.