Core Web Vitals простыми словами: LCP, CLS и INP
Что значат три метрики Google для посетителя, какие цифры считаются нормой, где смотреть и почему это важно даже тем, кому не важно SEO.
Google оценивает сайты по трём метрикам с неприятными аббревиатурами. Разбираем, что они значат для посетителя, какие цифры считаются нормой и почему за ними стоит следить даже тем, кому не важно SEO.
LCP: когда появилось главное
Largest Contentful Paint. Время, за которое на экране появляется самый крупный элемент, обычно заголовок или главная картинка. Это момент, когда посетитель понимает: «сайт открылся». Норма до 2,5 секунды, хорошо до 1,5. Главные враги: тяжёлая картинка на первом экране, шрифты с внешнего сервера и CSS на мегабайт, который блокирует отрисовку.
CLS: прыгает ли макет
Cumulative Layout Shift. Насколько элементы сдвигаются, пока страница грузится. Вы хотели нажать «Позвонить», а в этот момент сверху подгрузился баннер и кнопка уехала. Это и есть CLS. Норма до 0,1, хорошо около 0. Причины: картинки без указанных размеров, подмена шрифта, баннеры и виджеты, которые вставляются в вёрстку после загрузки.
INP: как быстро сайт реагирует
Interaction to Next Paint. Задержка между нажатием и видимой реакцией. Нажали на меню, а оно открылось через полсекунды, потому что браузер занят чужим скриптом. Норма до 200 мс. Причина почти всегда одна: слишком много JavaScript, который выполняется в главном потоке.
| Метрика | Хорошо | Плохо | Обычно виноват |
|---|---|---|---|
| LCP | ≤ 2,5 с | > 4 с | картинка, шрифт, CSS |
| CLS | ≤ 0,1 | > 0,25 | размеры картинок, шрифты, баннеры |
| INP | ≤ 200 мс | > 500 мс | JavaScript |
Где смотреть
PageSpeed Insights показывает две вещи: «лабораторные» данные (симуляция) и «полевые» (реальные пользователи Chrome за 28 дней). Google ранжирует по полевым. Лабораторная сотня приятна, но важнее, чтобы у реальных посетителей LCP был зелёным. В Search Console раздел «Основные интернет-показатели» показывает то же самое по всем страницам сразу.
Почему это важно не только для SEO
Потому что метрики описывают раздражение. Долго открывается, прыгает, не реагирует: посетитель уходит, и никакая оптимизация текстов это не компенсирует. Мы проверяем Core Web Vitals при сдаче, а не в отчёте через месяц: сайт сразу делается лёгким, а не «оптимизируется» потом. Почему сайты тормозят и что с этим делать, написано в статье про причины медленного WordPress.