Core Web Vitals и SEO: LCP, INP, CLS

Core Web Vitals для SEO: что означают LCP, INP и CLS, как измерить и улучшить без поломки дизайна сайта.

Core Web Vitals — метрики опыта загрузки и отклика. Google использует их как фактор; Яндекс учитывает скорость косвенно. Улучшение LCP и CLS часто поднимает и конверсию.

Три метрики

  • LCP — скорость основного контента
  • INP — отклик на действия
  • CLS — стабильность вёрстки

LCP

Оптимизируйте hero: шрифты, изображения, отложите тяжёлые скрипты.

Preload критического CSS.

CLS

Резервируйте место под картинки width/height.

Не вставляйте баннеры над контентом после загрузки.

INP

Разбивайте длинные задачи JS. Меньше main thread блокировок.

Баланс

Можно сохранить визуал и улучшить метрики точечно.

Скорость сайта.

Шрифты

font-display: swap, подмножество начертаний.

Сторонние виджеты

Чаты и карты грузить после взаимодействия.

Красный PageSpeed — паника?

Смотрите полевые данные (CrUX), не только лабораторию.

Шрифты Google тормозят?

Могут. Preconnect, display=swap, или локальные woff2.

Убрать анимации?

На mobile можно упростить без потери бренда.