Core Web Vitals: что реально тормозит сайт и сколько это стоит в трафике

Core Web Vitals — это три метрики, которыми Google измеряет реальную скорость и удобство сайта: LCP (как быстро грузится главный контент), INP (как быстро сайт отвечает на клик) и CLS (насколько прыгает вёрстка при загрузке). В красной зоне они стоят денег: сайт теряет и позиции, и посетителей, которые уходят, не дождавшись загрузки. Ниже — что это за метрики простыми словами, что их топит и как ускорить сайт без переписывания всего подряд.

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

Что такое LCP, INP и CLS — простыми словами

Три метрики измеряют три разные грани «быстро и удобно». Пороги Google на 2026 год:

LCP — про загрузку. Это момент, когда отрисовался главный видимый элемент: большое изображение, заголовок, hero-блок. Пользователь видит, что страница «появилась». Дольше 2,5 секунд — он уже нервничает.

INP — про отзывчивость. Нажал на кнопку, начал листать, ввёл текст — и сколько браузер думает, прежде чем отреагировать. Это самая свежая из трёх метрик: в марте 2024 года Google окончательно заменил ею старый FID. И самая проблемная — по данным на 2026 год, около 43% сайтов в мире её не проходят.

CLS — про стабильность. Когда страница грузится, а блоки внезапно прыгают: ты целишься в кнопку, а на её место подгрузилась картинка, и ты жмёшь не туда. Раздражает и роняет конверсию.

Важный нюанс: оценка идёт по реальным пользователям, на 75-м перцентиле, и отдельно по мобильным. Проходной балл — все три метрики в зелёной зоне. Хотя бы одна в жёлтой или красной — страница проверку не прошла.

Почему скорость — это деньги, а не «технический показатель»

Связь простая и измеримая. Медленный сайт → растут отказы → падает конверсия → поисковик фиксирует, что людям неудобно, и понижает позиции. Каждое звено цепочки тянет за собой следующее.

В 2026 году LCP — это уже психологический порог: не показал контент почти мгновенно — пользователь ушёл к конкуренту, и поисковик засчитал это как негативный сигнал. INP стала «королевой» метрик ровно потому, что современные сайты перегружены скриптами: аналитика, чаты, попапы, виджеты — каждый добавляет задержку отклика, и сайт начинает «тупить» на каждый клик.

Сюда же — нейропоиск. ИИ-краулерам, которые собирают данные для ответов нейросетей, с быстрым и чистым сайтом работать проще, как и обычным роботам. А медленная загрузка — ещё и одна из причин, почему сайт плохо индексируется: на тормозящем сайте робот успевает обойти меньше страниц за визит.

Что реально тормозит сайт — по метрикам

У каждой метрики свои типичные убийцы. Если знаешь, где искать, диагностика быстрее.

LCP топят:

• Тяжёлые картинки — несжатые, не в современных форматах WebP/AVIF, без приоритета загрузки для hero.
• Медленный хостинг и долгий ответ сервера (TTFB) — иногда сервер «съедает» весь бюджет времени ещё до отрисовки.
• Блокирующие CSS и JS, которые тормозят рендер.
• Неоптимизированные шрифты, особенно с кириллицей.

INP топит одно — тяжёлый JavaScript:

• Сторонние скрипты: чаты, попапы, трекеры, виджеты отзывов, счётчики. Каждый висит на главном потоке.
• Громоздкие обработчики событий и общая перегруженность фронтенда.
• Универсальной кнопки «починить INP» не существует — это всегда работа со скриптами и кодом.

CLS топят:

• Картинки и видео без заданных размеров width и height — браузер не резервирует под них место.
• Реклама и баннеры, которые подгружаются асинхронно в незарезервированный контейнер.
• Шрифты и контент, догружающиеся после первой отрисовки и сдвигающие всё вниз.

Оверхед конструкторов — почему сайты на них часто в красной зоне

Скажу честно и без снобизма: дело не в том, что конструкторы и популярные CMS плохие. Tilda, WordPress и подобные — рабочие инструменты, и для многих задач их скорости хватает. Проблема в накладных расходах: универсальный движок тащит много кода «на все случаи жизни», чужих скриптов и тяжёлых тем, которые ты не контролируешь.

Особенно это бьёт по INP. Плагины «ускорения» для WordPress обычно чинят только LCP — кэш, сжатие картинок — и почти не трогают INP. Чтобы поправить отзывчивость, надо выкидывать тяжёлые сторонние скрипты и дорабатывать тему, а это уже не «поставил плагин». Граница простая: пока хватает кэша и сжатия — оставайся на конструкторе. Когда упёрся в INP и архитектуру темы — инструмент перестал справляться, и дальше дешевле другой подход.

Как Next.js закрывает Core Web Vitals из коробки

Вот тут разница в стеке перестаёт быть вопросом вкуса разработчика и становится SEO-решением. На кастомном сайте зелёная зона — это состояние по умолчанию, а не подвиг. Что даёт Next.js конкретно:

• Оптимизация изображений. Встроенный next/image сам отдаёт картинки в WebP/AVIF, в нужном размере, с ленивой загрузкой и приоритетом для hero. Это закрывает большую часть LCP и часть CLS.
• Оптимизация шрифтов. next/font хостит шрифты локально, задаёт font-display и резервирует метрики, чтобы текст не прыгал. Меньше CLS, быстрее LCP.
• Готовый HTML (SSG/SSR). Страница приходит уже отрисованной, клиентского JavaScript меньше — а значит, меньше нагрузка на главный поток и лучше INP.
• Контроль над каждым скриптом. Ты сам решаешь, что и когда грузится. Никаких навязанных движком виджетов, которые топят отзывчивость.

Это и есть «скорость, встроенная в архитектуру». Её, как и SEO в целом, закладывают на этапе разработки, а не докручивают плагинами к готовому медленному сайту.

Как проверить и ускорить — по шагам

Инструменты, которые нужны:

• PageSpeed Insights — быстрая сводка с оценкой и конкретными узкими местами, и лабораторные, и полевые данные.
• Search Console, отчёт Core Web Vitals — показывает метрики по реальным пользователям. Именно это учитывает Google.
• Расширение Web Vitals для Chrome — смотреть LCP, INP, CLS в реальном времени на любой странице.

Порядок действий:

• Замерь ключевые шаблоны — главную, страницу услуги, статью. Смотри в первую очередь мобильные значения: по ним чаще всего проседают позиции.
• Начни с самых посещаемых страниц, а не со случайных URL с нулевым трафиком.
• По LCP — сожми картинки в WebP/AVIF, задай приоритет hero-изображению, разберись с хостингом, если медленно отвечает сервер.
• По INP — вычисти лишние сторонние скрипты. Каждый чат, попап и трекер должен оправдывать своё место.
• По CLS — проставь width и height всем картинкам, зарезервируй место под рекламу и догружаемые блоки.
• Перемеряй после каждого релиза и проверяй ключевые страницы раз в две–четыре недели — метрики плывут от изменений.

Скорость — лишь один из сигналов здоровья сайта; какие ещё метрики показывают, работает ли сайт, разберу отдельно.

Как выглядит «до и после»

Покажу на типовом примере, без привязки к конкретному проекту, чтобы было видно, какая правка какую метрику двигает. Частая стартовая картина у сайта на тяжёлом шаблоне:

Мобильный балл PageSpeed в таком сценарии уезжает из красной зоны (где-то 30–40) в зелёную (90+). Но главное тут не сам балл, а то, что за ним: меньше отказов, выше конверсия, лучше поведенческие сигналы для поиска.

Частые ошибки

• Гонятся за лабораторной оценкой. PageSpeed показал 98 — а Google смотрит на реальных пользователей в Search Console, и там может быть красная зона.
• Ставят плагин и считают, что INP починен. Плагины ускорения почти не влияют на отзывчивость.
• Грузят hero-картинку на несколько мегабайт без сжатия и удивляются LCP.
• Вешают пять виджетов сразу — чат, попап, два трекера, отзывы — и ловят INP в красной зоне.
• Ради скорости отказываются резервировать место под картинки — и получают скачущую вёрстку и плохой CLS.

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

Если коротко — Core Web Vitals это перевод «сайт быстрый и удобный» на язык цифр: LCP, INP, CLS. Картинки и шрифты чаще всего лечатся, INP бывает упирается в стек и архитектуру. И самое дешёвое в долгую — не разгонять медленный сайт плагинами, а собрать быстрый сразу.

Хочешь сайт, у которого зелёная зона по умолчанию, а не после месяца оптимизаций, — посмотри, как устроены корпоративные сайты и SEO-сопровождение, где скорость заложена в стек с первого дня.