Определение простыми словами
Core Web Vitals — это три цифры, по которым Google решает, насколько сайт удобен для пользователя. LCP — за какое время отрисовался самый крупный элемент на экране, обычно баннер или заголовок. INP — насколько быстро страница реагирует на клик или нажатие. CLS — насколько сильно «прыгает» вёрстка во время загрузки, когда поздно подгружается шрифт или картинка без размеров.
Метрики измеряются на реальных пользователях через Chrome User Experience Report (CrUX) и складываются в отчёт PageSpeed Insights, Search Console и Looker Studio. С 2021 года Core Web Vitals — фактор ранжирования в Google. Улучшать показатели проще всего через кэширование и подключение CDN.
Сравнение пороговых значений
| Метрика | Хорошо | Требует улучшения | Плохо |
|---|---|---|---|
| LCP — Largest Contentful Paint | ≤ 2,5 с | 2,5-4 с | > 4 с |
| INP — Interaction to Next Paint | ≤ 200 мс | 200-500 мс | > 500 мс |
| CLS — Cumulative Layout Shift | ≤ 0,1 | 0,1-0,25 | > 0,25 |
Кейсы использования
- Аудит интернет-магазина перед сезоном продаж — найти страницы с LCP больше 4 секунд и оптимизировать первый экран.
- Контроль регрессий после релиза: новый JS-скрипт повысил INP — откатываем или дорабатываем.
- Сравнение хостингов: переезд с виртуального хостинга на VPS с быстрым диском часто улучшает LCP на 30-50%.
- Оптимизация шрифтов и картинок: атрибуты width/height и font-display: swap снижают CLS почти до нуля.
- SEO-проекты: рост Core Web Vitals коррелирует с позициями по ВЧ-запросам в Google.
Негативный сценарий: оптимизировать только лабораторные тесты Lighthouse, игнорируя данные CrUX. Lighthouse запускается на эмуляции, а Google ранжирует по реальным пользователям. Сайт может показывать «зелёный» PageSpeed и при этом проваливать Web Vitals в Search Console — потому что у пользователей слабые телефоны и нестабильный мобильный интернет.
Технические детали
npm install -g lighthouse
lighthouse https://example.com --output=html --output-path=./report.html
npx unlighthouse --site https://example.com
curl -X POST 'https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=https://example.com&strategy=mobile'
npm install web-vitals
node -e "console.log(require('web-vitals'))"🔥 Где это применяется
Частые вопросы
Чем INP отличается от старого FID?
FID мерил задержку только первого взаимодействия на странице. INP заменил его в марте 2024 года и считает максимальную задержку среди всех кликов и нажатий за визит. Это честнее отражает реальный опыт.
Влияют ли Core Web Vitals на Яндекс?
Прямого фактора у Яндекса нет, но скорость и стабильность вёрстки влияют на поведенческие метрики, которые Яндекс учитывает. Оптимизация под Web Vitals улучшает позиции и в Яндексе.
Как быстро Google обновляет данные?
Метрики в Search Console и CrUX обновляются по 28-дневному скользящему окну. После реальных улучшений на сайте «зелёный» статус появляется через 2-4 недели — раньше изменения просто не накапливаются в выборке.