Core Web Vitals: як покращити LCP, INP і CLS на сайті

Коротко: Core Web Vitals — три метрики досвіду користувача: LCP (швидкість основного вмісту), INP (відгук на дії), CLS (стабільність макета). Хороші значення: LCP до 2,5 с, INP до 200 мс, CLS до 0,1 для 75% відвідувань.

Що таке Core Web Vitals?

Це набір метрик Google, які вимірюють реальний досвід відвідувачів на сторінці. Вони входять до сигналів page experience. Хороша швидкість сама не виведе слабкий контент у топ, але повільний сайт втрачає і позиції, і заявки.

Які значення вважаються хорошими?

INP замінив метрику FID у 2024 році. Оцінюють за 75-м перцентилем реальних даних (CrUX), а не лише за лабораторним тестом.

Як покращити LCP?

• Стисніть головне зображення, віддавайте WebP/AVIF у правильному розмірі.
• Додайте fetchpriority="high" для hero-зображення й не вмикайте для нього lazy-load.
• Скоротіть час відповіді сервера: кеш сторінок, актуальна версія PHP, CDN.
• Приберіть CSS і JS, що блокують рендеринг; критичний CSS вбудуйте.

Як покращити INP?

• Розбийте довгі JavaScript-задачі, відкладіть сторонні скрипти (чати, віджети, піксели).
• Приберіть зайві плагіни та бібліотеки.
• Не запускайте важкі обробники на кожен клік чи прокрутку.

Як покращити CLS?

• Задавайте width і height для зображень і відео.
• Резервуйте місце під банери, cookie-панелі та рекламу.
• Використовуйте font-display: swap і підвантажуйте шрифти заздалегідь.

Як перевірити свої показники?

PageSpeed Insights показує і польові дані, і лабораторні. Звіт Core Web Vitals у Search Console групує проблемні URL за типами сторінок, тож виправляйте шаблон, а не окрему сторінку. Після правок дані оновлюються приблизно за 28 днів.

Що специфічно для MODX, WordPress і Laravel?

• MODX: кешування чанків і сніппетів, мінімізація та об'єднання ресурсів, оптимізація зображень на стороні сервера.
• WordPress: прибрати зайві плагіни, кеш-плагін, ліниве завантаження, легка тема.
• Laravel: кеш відповідей, черги, сучасні формати зображень, Vite для збірки.

FAQ

Чи впливає швидкість сайту на позиції?

Так, як один із багатьох сигналів. Ще більше вона впливає на конверсію: повільна сторінка втрачає відвідувачів.

Який бал PageSpeed вважати достатнім?

Орієнтуйтеся не на бал, а на пройдені пороги LCP, INP і CLS у реальних даних.

Що виправляти першим?

Те, що найгірше за метриками на найтрафікових шаблонах: головна, категорії, картка товару чи послуги.

Сайт повільний і ви не знаєте чому? Отримайте безкоштовний аудит Kyivan — розробник знайде вузькі місця та назве конкретні правки.