SEO-Studio
Блог · Web

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

Пояснює три метрики Core Web Vitals, показує де їх міряти і дає короткий план покращення для SEO-команди.

~2 хв читання Web

Три метрики Core Web Vitals LCP INP CLS на дашборді швидкості сайту

LCP INP і CLS що саме вимірюють

Шкала good needs improvement poor для LCP INP і CLS
LCP до 2,5 с, INP до 200 мс, CLS до 0,1 — ціль для більшості комерційних сторінок.

Core Web Vitals — три метрики досвіду користувача, які Google використовує як сигнал якості сторінки. Для SEO вони не «магічна кнопка в топ», але погані показники часто корелюють із відтіком і нижчою конверсією.

  • LCP (Largest Contentful Paint) — як швидко з’являється головний контент. Ціль до 2,5 с.
  • INP (Interaction to Next Paint) — наскільки швидко сторінка реагує на клік, тап або введення. Ціль до 200 мс.
  • CLS (Cumulative Layout Shift) — наскільки контент «стрибає» під час завантаження. Ціль до 0,1.

Офіційні пороги й пояснення метрик — у документації Google про Core Web Vitals.

Де вимірювати CrUX PSI і GSC

Порівняння звітів PageSpeed Insights CrUX і Core Web Vitals у Search Console
CrUX показує реальних користувачів, PSI — лабораторний тест. GSC збирає обидва шари для SEO-рішень.

Не змішуйте лабораторні і польові дані в одному висновку.

  • CrUX (Chrome User Experience Report) — агреговані дані реальних користувачів Chrome. База для оцінки в Search Console. Деталі в довідці CrUX.
  • PageSpeed Insights — швидкий лабораторний тест плюс CrUX, якщо є трафік. Запускайте PSI для конкретного URL до і після правок.
  • Search Console → Core Web Vitals — групи URL з проблемами LCP, INP або CLS. Починайте SEO-пріоритизацію звідси, а не з випадкових сторінок блогу.

Якщо LCP поганий через важкий JS-рендер, паралельно перевірте індексацію JavaScript-сайтів — іноді проблема і в SEO, і в швидкості однакова.

Як покращити LCP INP і CLS на практиці

Чекліст оптимізації зображень JS і layout shift на сторінці
Спочатку LCP-hero і критичний CSS, потім відкладений JS і фіксовані розміри блоків для CLS.

LCP

  • Оптимізуйте hero-зображення (WebP/AVIF, правильний розмір, fetchpriority="high" для LCP-елемента).
  • Приберіть render-blocking CSS/JS з верхньої частини сторінки; критичний CSS inline.
  • Перевірте TTFB і кеш на сервері/CDN — повільний HTML тягне LCP вниз.

INP

  • Розбийте довгі JS-задачі; відкладіть аналітику, чати й віджети після взаємодії.
  • Не вішайте важкі обробники на кожен scroll/input без debounce.
  • На мобільних тестуйте реальний пристрій, не лише десктоп у PSI.

CLS

  • Задайте width/height для зображень і embed-блоків.
  • Не вставляйте банери/куки-бар над уже відмальованим контентом без резерву місця.
  • Шрифти — font-display: swap плюс preload для ключових гарнітур.

Висновок

Core Web Vitals для SEO — це пріоритет сторінок із трафіком і грошима, вимірювання через CrUX/GSC і точкові правки LCP, INP, CLS. Зафіксуйте базовий звіт у Search Console, виправте топ-URL і повторіть цикл через 28 днів. Якщо потрібен аудит швидкості разом із технічним SEO, команда SEO-Studio допоможе розставити пріоритети без зайвих переписувань сайту.