Исправление Core Web Vitals на WordPress и WooCommerce

Google Search Console или PageSpeed Insights сообщают, что сайт не проходит оценку Core Web Vitals: LCP слишком долгий, страница «прыгает» при загрузке или кнопки реагируют с задержкой. Общее «ускорение» не всегда это решает, потому что у каждой метрики своя причина. Эта работа уже и диагностичнее, чем общая оптимизация скорости: мы берём именно эти три метрики и то, что им мешает.

Цель — чтобы данные Ваших реальных посетителей (CrUX) попали в зону «хорошо»: LCP до 2,5 с, INP до 200 мс и CLS до 0,1 на 75-м процентиле. Красивая лабораторная оценка сама по себе целью не является.

Что входит в работу

• Диагностика. Сравниваем полевые и лабораторные данные: PageSpeed Insights, CrUX, отчёт Core Web Vitals в Search Console, Lighthouse и панель Performance в Chrome DevTools. Разделяем мобильные и десктопные результаты и смотрим самые проблемные типы страниц (главная, карточка товара, категория, корзина).
• LCP: самый крупный элемент. Определяем LCP-элемент на каждом шаблоне и исправляем путь его загрузки: правильный размер и формат изображения, preload, fetchpriority="high", отключение lazy-load для первого изображения, а также время ответа сервера и кэширование.
• CSS и JS, блокирующие отрисовку. Выделение критического CSS, сокращение неиспользуемого CSS и отложенная загрузка скриптов (defer) там, где это не ломает функциональность.
• Шрифты. Загрузка без периода невидимого текста, font-display, предзагрузка шрифтов, при необходимости размещение на своём сервере и использование подмножества символов.
• CLS: смещение макета. Размеры у изображений и видео, зарезервированное место под баннеры, уведомление о cookie и рекламу, скачки из-за подмены шрифтов и поздно подгружаемые блоки.
• Сторонние скрипты. Пересматриваем счётчики, чаты и маркетинговые теги и откладываем некритичные до действия пользователя или до конца загрузки страницы.
• INP: отзывчивость. Находим длинные задачи (long tasks) и тяжёлые обработчики событий, блокирующие основной поток, и сокращаем объём JavaScript, например в меню, фильтрах и корзине.
• До и после. Замеряем одни и те же страницы до и после и документируем изменения, чтобы следующий разработчик их не откатил.

Что нам понадобится от Вас

• Доступ администратора WordPress и к хостингу, по возможности — право просмотра в Search Console.
• Информация о скриптах сайта: какие счётчики, чаты и реклама действительно нужны.
• Решение там, где плагин или тема требуют компромисса, например замены эффектного слайдера на более быстрое решение.

Что не входит в работу

• Общее ускорение сайта, смена сервера и очистка базы данных: для этого см. оптимизацию скорости WordPress.
• Гарантия оценки. Полевые данные в CrUX обновляются примерно за 28 дней, поэтому результат появляется в Search Console с задержкой.
• Пересборка темы или всего сайта. Если проблема в структуре темы, мы порекомендуем переход на новую тему.
• Настройка аналитики и менеджера тегов, см. GA4 и Tag Manager.

Кому это подходит

Подходит сайтам, у которых Search Console показывает URL со статусом «Плохо» или «Требуется улучшение», магазинам, где медленная карточка товара или корзина стоят продаж, и сайтам, которые уже пробовали плагин кэширования без заметного результата. Если медленен весь сайт целиком, начните с общей оптимизации скорости.