Блог · Web

Core Web Vitals для SEO: LCP, INP и CLS простыми словами

Рассмотрим три метрики Google, касающиеся скорости и пользовательского опыта: что они измеряют, где сравнивать полевые и лабораторные данные и с чего начать оптимизацию на реальном сайте.

~3 мин чтения Web

Core Web Vitals для SEO: LCP, INP и CLS простыми словами

Три показателя, которые стоит знать

LCP, INP и CLS на схеме

Core Web Vitals — это набор показателей, которые характеризуют скорость загрузки, отзывчивость и стабильность верстки с точки зрения пользователя, а не только «сухое» время отклика сервера.

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

  • LCP показывает, как быстро пользователь видит самый большой осмысленный фрагмент контента в зоне просмотра — часто это херо, изображение или большой блок текста.
  • INP заменяет прежнюю логику FID и отражает, насколько плавно страница реагирует на клики, ввод данных и другие интерактивные действия на протяжении всего цикла посещения.
  • CLS измеряет непредвиденные сдвиги макета: когда реклама, шрифт или изображение «подскакивают» над контентом и мешают нажать нужную кнопку.
  • Показатели собираются у реальных пользователей (поле) и могут отличаться от результатов однократного теста в PageSpeed Insights.
  • Плохой показатель LCP часто связан с изображениями без отложенной загрузки в нижней части страницы, но не стоит откладывать загрузку hero-блока без четкого плана.
  • Высокий показатель INP обычно указывает на сложные скрипты плагинов, трекеров или некорректно разбитые длинные задачи в JavaScript.
  • CLS часто нарушают баннеры, встроенные виджеты и асинхронные шрифты без резерва места под глифы.
  • Показатели необходимо соотносить с бизнес-метриками: отказы, продолжительность сеанса и конверсия часто коррелируют с низким показателем CWV.
  • Не путайте «лабораторные показатели» и реальную ситуацию: для Search Console важны именно реальные пользователи.
  • Начинайте план по улучшению с наиболее посещаемых шаблонов страниц, а не со случайных URL-адресов с низким трафиком.

Наряду со скоростью следите за индексацией: проверка индексации и XML-карта сайта.

Где смотреть цифры

Отчеты PageSpeed Insights и GSC

PageSpeed Insights предоставляет краткий обзор результатов тестирования и рекомендации, но не заменяет долгосрочный мониторинг в реальных условиях.

Google Search Console агрегирует данные CrUX для страниц с достаточным количеством сеансов и отображает тенденции «хорошо / требует улучшения / плохо».

  • Сравнивайте одинаковые URL-адреса в PSI и GSC, чтобы не перепутать мобильную и настольную версии.
  • Проверяйте раскладку по шаблонам: иногда проблема возникает только на страницах типа «товар» или «категория».
  • Обращайте внимание на версию Chrome в лаборатории — она влияет на оценку INP.
  • Для SPA-приложений дополнительно анализируйте собственные отчеты RUM, так как данные CrUX могут быть неполными.
  • Отслеживайте ухудшения показателей после релиза: сравните неделю до и после изменений в интерфейсе.
  • Не оптимизируйте только главную, если 80% сессий приходятся на внутренние страницы.
  • Убедитесь, что CDN не нарушает кэширование HTML там, где требуются свежие заголовки.
  • Согласуйте KPI с отделом маркетинга: иногда незначительное повышение CWV не сказывается на выручке без параллельной работы над UX.
  • Используйте видеозаписи сеансов или тепловые карты, чтобы связать показатель CLS с реальными ошибками при нажатии.
  • Документируйте изменения в тегах и плагинах, чтобы быстро откатить подозрительный релиз.

Что касается стека WordPress, см. практическое руководство WordPress и Web Vitals.

С чего начать улучшение

План работ по Core Web Vitals

Начните с анализа: составьте список шаблонов с наихудшими показателями в этой области и сосредоточьтесь на тех, которые приносят наибольший трафик или маржу.

Затем разделите задачи на «быстрые победы» (сжатие изображений, предварительная загрузка критически важных ресурсов) и «инфраструктурные» (рефакторинг JS, перенос трекеров в GTM с отложенным запуском).

  • Оптимизируйте LCP: современные форматы изображений, чёткие значения width/height, критический CSS, кэш на CDN.
  • Сокращайте INP: разбивайте длинные задачи, откладывайте ненужные обработчики событий, ограничивайте количество сторонних скриптов на первом экране.
  • Боритесь с CLS: резервируйте место под баннеры, задавайте размеры медиафайлов, избегайте вставки контента сверху без предупреждения.
  • Проверьте шрифты: font-display, замена метрик, локальный хостинг глифов для кириллицы.
  • Согласуйте с разработчиками бюджет на рефакторинг, если проблема заключается в архитектуре темы или конструктора.
  • После каждого изменения фиксируйте показатели в той же панели, чтобы не смешивать разные выборки.
  • Не забывайте о мобильной сети 3G/4G — проверяйте ограничение скорости в DevTools.
  • Одновременно следите за временем ответа сервера: иногда TTFB «съедает» весь LCP.
  • Используйте дизайн: иногда самый дешевый способ снизить CLS — изменить порядок блоков, а не код.
  • Согласуйте с юридическим отделом CMP-баннеры, чтобы они не перекрывали нижнюю часть страницы.

Комплексная техническая поддержка — разработка и сопровождение сайтов в SEO-Studio.

Заключение

Core Web Vitals — это общий язык для маркетинга, продукта и разработки. Он показывает, насколько удобно пользователю работать с сайтом в реальных условиях, а не только на демо-ноутбуке инженера. Начните с измерения показателей, сузьте фокус до шаблонов с наибольшим влиянием на бизнес и внедряйте изменения небольшими релизами с контролем регрессий. Если требуется сопровождение и приоритизация технического бэклога — обращайтесь в SEO-Studio: мы объединяем SEO, аналитику и веб-разработку в одном цикле обратной связи с метриками.