Core Web Vitals простыми словами: почему скорость сайта = деньги

Core Web Vitals простыми словами: почему скорость сайта = деньги

Человек кликнул на ваш сайт из поиска, увидел пустой белый экран и через две секунды вернулся к конкурентам. Вы об этом даже не узнаете - в аналитике это просто «не сконвертился». А причина была не в цене и не в товаре. Сайт грузился слишком долго, и клиент не дождался.

Google видит такие истории миллионами. И давно научился их измерять - набором метрик под названием Core Web Vitals.

Что такое Core Web Vitals

Core Web Vitals - это три показателя, которыми Google оценивает реальный опыт человека на странице. Не «как выглядит дизайн» и не «сколько ключевых слов в тексте», а ощущения от взаимодействия: быстро ли загрузилось, откликается ли на клики, не прыгает ли всё под пальцами.

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

Метрики три:

  • LCP - как быстро загружается главный видимый блок.
  • INP - как быстро страница реагирует на действие.
  • CLS - насколько сильно дёргается вёрстка при загрузке.

Разберём каждую по очереди: что измеряет, какой порог считается хорошим и что с этим делать.

LCP - скорость загрузки главного элемента

LCP (Largest Contentful Paint) отвечает на простой вопрос: за сколько секунд человек видит основной контент? Обычно это самый крупный элемент в верхней части экрана - большая картинка товара, фоновое фото или заголовок.

Хороший показатель - до 2,5 секунды. Уложились в это окно - посетитель почти не замечает загрузки. Не уложились - он сидит и смотрит на пустой или наполовину собранный экран. А дальше срабатывает рефлекс: назад, к следующему результату в поиске.

Что обычно тормозит LCP и как лечить:

  • Тяжёлая главная картинка. Сожмите её и переведите в современный формат WebP - вес падает в разы без потери качества. Картинку из первого экрана грузите приоритетно, чтобы браузер занялся ей первой.
  • Медленный хостинг. Дешёвый перегруженный сервер отвечает по полсекунды на каждый запрос. Помогает нормальный хостинг и CDN - сеть, которая раздаёт сайт с ближайшего к посетителю сервера.
  • Блокирующие скрипты. Лишние библиотеки и виджеты грузятся до того, как покажется контент. Их нужно убрать или отложить.

INP - скорость отклика на действия

INP (Interaction to Next Paint) измеряет, за сколько страница отвечает на действие человека: клик по кнопке, тап по меню, ввод в поле. В 2024 году эта метрика заменила старую FID и стала строже - теперь учитываются все взаимодействия, а не только первое.

Хороший показатель - до 200 миллисекунд. Это та грань, за которой отклик ощущается мгновенным. Когда INP большой, получается знакомая боль: нажал «Купить», а ничего не происходит. Человек жмёт ещё раз, ещё раз, начинает злиться - и закрывает вкладку.

Чаще всего INP портит перегруженный JavaScript. Браузер пытается прожевать тяжёлый код и в этот момент не успевает реагировать на клики. Что делать:

  • Уменьшить и разбить JavaScript. Большие куски кода дробят на части, чтобы браузер обрабатывал их порциями и оставался отзывчивым.
  • Убрать лишние сторонние скрипты. Каждый чат-виджет, пиксель аналитики и счётчик добавляет нагрузку. Оставьте только то, что реально работает на бизнес.

CLS - стабильность вёрстки

CLS (Cumulative Layout Shift) показывает, насколько прыгает вёрстка во время загрузки. Знакомая ситуация: вы читаете текст, подгрузилась картинка или баннер сверху - и всё содержимое скачком уезжает вниз. Или вы целитесь в кнопку, в последний момент над ней появляется реклама, и палец попадает не туда.

Хороший показатель - до 0,1. Чем ближе к нулю, тем спокойнее ведёт себя страница. Высокий CLS - это промахи по кнопкам, случайные клики по рекламе и общее ощущение, что сайт сделан кое-как.

Лечится это аккуратностью при вёрстке:

  • Задавать размеры заранее. Для каждой картинки и видео пропишите ширину и высоту. Тогда браузер сразу резервирует место, и контент не прыгает, когда медиа догрузится.
  • Бронировать место под баннеры и рекламу. Если на странице будет реклама, под неё заранее выделяют пустой блок нужного размера.
  • Аккуратно подключать шрифты. Неправильно подгруженный шрифт перерисовывает текст на лету и сдвигает соседние блоки. Это настраивается на уровне загрузки.

Почему это про деньги, а не только про SEO

Легко решить, что Core Web Vitals - забота сеошников. На самом деле эти цифры бьют по выручке с двух сторон сразу.

Первая сторона - позиции. Медленный и дёрганый сайт Google ранжирует ниже. Ниже позиция - меньше переходов из поиска, меньше переходов - меньше заявок. Эта арифметика работает каждый день, даже если вы её не видите.

Вторая сторона - конверсия. Допустим, человек всё-таки дошёл до сайта. Но если LCP большой, он уходит, не дождавшись загрузки. Если INP большой, не может нормально нажать на кнопку. Если CLS высокий, промахивается и злится. На каждом из этих шагов часть людей отваливается - и это уже не про поиск, а про то, сколько из пришедших реально оставят заявку.

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

Как измерить и с чего начать

Хорошая новость: проверить свои цифры можно бесплатно и за пару минут.

  • PageSpeed Insights от Google - вставляете адрес страницы и получаете оценку всех трёх метрик. Инструмент показывает и лабораторные данные (тест в идеальных условиях), и полевые - реальную статистику от живых пользователей Chrome.
  • Search Console - в личном кабинете сайта есть отдельный отчёт Core Web Vitals. Он группирует страницы по проблемам и показывает динамику во времени.
  • Аудит на seonerve.com - секция Performance на базе Lighthouse даёт оценку скорости вместе с остальным SEO-чеклистом, в одном понятном отчёте.

С чего начать на практике: прогоните главную и пару ключевых страниц через PageSpeed Insights. Красные и жёлтые метрики - это ваш список задач. Обычно самый быстрый выигрыш даёт работа с картинками первого экрана: одна тяжёлая фотография часто и есть причина медленного LCP.

Проверьте скорость своего сайта на seonerve.com - аудит покажет, какие из трёх метрик в зоне риска и что чинить первым. А если разбираться с оптимизацией некогда или непонятно, с чего подступиться - мы ускорим сайт за вас. Приведём Core Web Vitals в зелёную зону, чтобы посетители не уходили с пустого экрана, а становились клиентами.


Читайте также