Core Web Vitals

Автор

Что такое Core Web Vitals?

Core Web Vitals — это набор стандартизированных метрик Google, которые количественно оценивают пользовательский опыт (UX) на веб-странице с точки зрения скорости загрузки, отзывчивости и визуальной стабильности.

Ключевой индустриальный бенчмарк на 2026 год: для попадания в «зелёную зону» и получения положительного сигнала ранжирования время Largest Contentful Paint (LCP) не должно превышать 2,5 секунды, задержка взаимодействия (Interaction to Next Paint, INP) — 200 миллисекунд, а совокупное смещение макета (Cumulative Layout Shift, CLS) — 0,1 для 75-го процентиля загрузок страниц. INP официально заменил устаревший FID как метрику отзывчивости.

Как это работает?

Core Web Vitals измеряют реальный пользовательский опыт (Real User Monitoring, RUM) через Chrome User Experience Report. LCP фиксирует момент отрисовки самого крупного элемента в области просмотра, сигнализируя о воспринимаемой скорости загрузки основного контента. INP отслеживает задержку всех кликов, касаний и нажатий клавиш на протяжении всего жизненного цикла страницы, выделяя максимальную задержку. CLS вычисляет сумму неожиданных сдвигов видимых элементов, исключая изменения, вызванные действиями пользователя.

Метрики и стандарты

Оценка выставляется на уровне всей страницы или группы страниц по 75-му процентилю данных из поля за последние 28 дней. Пороговые значения для оценки «Хорошо» строго фиксированы: LCP ≤ 2500 мс, INP ≤ 200 мс, CLS ≤ 0,1. Значения «Требует улучшения» лежат в диапазоне LCP до 4000 мс, INP до 500 мс и CLS до 0,25; всё, что хуже, — «Плохо». На 2026 год Google использует эту оценку как прямое подтверждение фактора Page Experience в поисковом ранжировании, что критически важно для SEO.

Почему это важно для бизнеса?

Плохие показатели Core Web Vitals напрямую снижают конверсию: по данным индустрии, задержка загрузки на 1 секунду уменьшает конверсию мобильной коммерции на 10–20%. Низкая оценка Page Experience ослабляет позиции в выдаче против конкурентов с аналогичным контентом, но лучшим UX. Оптимизация INP и CLS снижает фрустрацию пользователей, увеличивая глубину просмотра и процент завершения целевых действий, будь то оформление заказа или отправка лид-формы.

Пример применения

Интернет-магазин одежды обнаружил, что его мобильный LCP составляет 4,8 с, а CLS — 0,35 из-за баннера подписки, внедряющегося без резервирования места. После переноса баннера ниже линии сгиба и активации отложенной загрузки изображений товаров с предустановленными пропорциями контейнеров LCP снизился до 2,1 с, а CLS — до 0,05. В результате через два месяца видимость по коммерческим запросам выросла на 12%, а мобильная конверсия увеличилась на 8%.

Как это реализуется в WordPress?

Контроль достигается комбинацией кэширования, оптимизации критического пути рендеринга и управления ресурсами. Профильные плагины типа FlyingPress, WP Rocket или Perfmatters устраняют render-blocking ресурсы, откладывают JavaScript и удаляют неиспользуемый CSS. Для ускорения LCP необходимо настроить ленивую загрузку с исключением LCP-элемента, а также сжимать изображения в WebP/AVIF через конвертеры Imagify или ShortPixel. Визуальную стабильность (CLS) обеспечивают темы, корректно задающие атрибуты width/height для изображений, iframe и шрифтов. Серверный уровень (LiteSpeed Enterprise или Nginx с FastCGI Cache) с включением модуля Page Optimization позволяет обрабатывать критический CSS и минификацию без нагрузки на PHP. Итоговый мониторинг ведется через отчеты Google Search Console и PageSpeed Insights, а детальную аналитику INP предоставляет Web Vitals library или Microsoft Clarity.

Распространённые ошибки

Наиболее частая ошибка — оптимизация только под синтетические тесты (Lighthouse) вместо работы с полевыми данными, где INP может быть разрушен сторонними скриптами (чаты, трекеры, Cookie-баннеры). Другая ошибка — загрузка дизайн-макетов без системы контейнеров с фиксированными соотношениями сторон, что провоцирует CLS при динамической подгрузке контента. Использование тяжёлых конструкторов страниц без чистого кэша на сервере также создаёт избыточный HTML, замедляющий отрисовку LCP выше допустимого порога.

Связанные понятия

Largest Contentful Paint (LCP) — отрисовка самого крупного элемента контента.
Interaction to Next Paint (INP) — задержка реакции на взаимодействие до следующей отрисовки.
Cumulative Layout Shift (CLS) — совокупное смещение макета.
First Contentful Paint (FCP) — отрисовка первого контента.
Time to First Byte (TTFB) — время до получения первого байта с сервера.
Page Experience Signal — сигнал качества страницы в ранжировании.