Повільний сайт: як швидкість забирає продажі і що виправити першим (Core Web Vitals простою мовою)

Коротко: повільний сайт втрачає відвідувачів ще до того, як вони побачать вашу пропозицію, а з ними — заявки й продажі. Найчастіше швидкість з’їдають три речі: важкі зображення, повільна відповідь сервера без кешу і сторонні скрипти (чати, пікселі, віджети). Почніть з вимірювання в PageSpeed Insights і виправляйте те, що гальмує перший екран на телефоні.

Власник зазвичай відкриває свій сайт на робочому комп’ютері з хорошим інтернетом — і все здається нормальним. Клієнт відкриває його з телефона в маршрутці, клікнувши по рекламі, і бачить білий екран кілька секунд. Частина людей закриває вкладку і йде до конкурента, а реклама за цей клік уже оплачена. Нижче — як оцінити швидкість без технічних знань і що виправляти в першу чергу.

Core Web Vitals простою мовою

Core Web Vitals — три показники Google, які описують, як сайт відчувається для людини. Google рахує їх за реальними відвідувачами з браузером Chrome і бере 75-й перцентиль: показник має бути добрим щонайменше для трьох із чотирьох візитів. Пороги опубліковано на web.dev.

Показник	Що вимірює простими словами	Добре	Типові причини поганого результату
LCP — Largest Contentful Paint	Коли з’явився головний елемент першого екрана: банер, фото, заголовок	до 2,5 с	Важке фото чи слайдер, повільний хостинг, немає кешу, блокуючі CSS і JS
INP — Interaction to Next Paint	Як швидко сайт реагує на натискання: кнопка, меню, фільтр, «в кошик»	до 200 мс	Забагато JavaScript, сторонні скрипти, важкі конструктори сторінок
CLS — Cumulative Layout Shift	Чи «стрибає» сторінка під час завантаження, і людина натискає не туди	до 0,1	Фото без розмірів, банери й cookie-панелі, що вставляються зверху, шрифти, що підміняються

Різниця між польовими і лабораторними даними важлива. Польові — це реальні відвідувачі на їхніх телефонах і з їхнім інтернетом, саме їх враховує Google. Лабораторні — одна перевірка в однакових умовах; вони корисні, щоб знайти причину і швидко перевірити виправлення, але не показують, як сайт відчувають люди.

INP замінив старий показник FID у березні 2024 року. Якщо підрядник досі звітує про FID, звіт застарів.

Як швидкість забирає продажі

• Відвідувач не дочекався. Ви заплатили за клік, а людина пішла раніше, ніж побачила пропозицію.
• Відвідувач дочекався, але дратується. Фільтр каталогу думає кілька секунд, кнопка «Купити» реагує із затримкою — і кошик лишається незавершеним. Інші причини незавершених замовлень — у статті кинуті кошики: чому покупці не завершують замовлення.
• Сторінка стрибає. Людина натискає «Зателефонувати», а під пальцем уже інший елемент.
• Дорожча реклама. Google враховує досвід на цільовій сторінці в показнику якості, а повільна сторінка гірше конвертує — обидва ефекти підвищують ціну заявки. Детально — у статті чому реклама дорожчає, а заявок менше.

Перевір сам за 10 хвилин

1. Відкрийте PageSpeed Insights і вставте адресу головної, сторінки послуги або товару, кошика.
2. Дивіться спершу на верхній блок — «Дізнайтеся, що відчувають ваші реальні користувачі». Це польові дані з Chrome за останні 28 днів. Якщо там написано, що даних недостатньо, — у сайту мало відвідувачів з Chrome, орієнтуйтеся на лабораторний тест нижче.
3. Перемкніть на «Мобільний пристрій» — більшість трафіку малого бізнесу саме з телефонів.
4. У розділі діагностики знайдіть, який елемент є LCP, і подивіться його розмір. Фото на кілька мегабайт у першому екрані — найчастіша знахідка.
5. У Google Search Console відкрийте звіт «Основні веб-показники»: він показує, які групи сторінок повільні. Якщо сайт ще не підтверджений у Search Console або сторінок там майже немає, спершу розберіться з індексацією — див. сайту немає в Google.
6. Відкрийте сайт з телефона через мобільний інтернет у режимі інкогніто і порахуйте, скільки секунд до моменту, коли можна читати й натискати.

Що виправити першим: порядок, який дає найбільше

1. Зображення

Найчастіша й найдешевша у виправленні причина. Фото з телефона чи фотостоку на 3–5 МБ, вставлене як банер, — уже повільний сайт. Що робити: формат WebP або AVIF, розмір під реальну ширину показу, стиснення, ліниве завантаження для зображень нижче першого екрана — але не для головного банера, йому навпаки дають пріоритет завантаження.

2. Кеш і відповідь сервера

Якщо сервер довго «думає» перед тим, як віддати сторінку, решта оптимізацій мало допоможе. Для WordPress — кешування сторінок плагіном або на рівні хостингу, актуальна версія PHP, нормальний хостинг замість найдешевшого спільного тарифу. CDN допомагає, якщо відвідувачі з різних країн.

3. Сторонні скрипти

Онлайн-чат, кілька пікселів реклами, віджет відгуків, карта, відео з YouTube, попап зі знижкою — кожен скрипт додає вагу і забирає час браузера. Перевірте, що з цього реально використовується. Решту — прибрати або відкласти завантаження до взаємодії. Дублі тегів аналітики — окрема проблема, яку ми часто знаходимо під час аудитів.

4. Перший екран

Слайдер на п’ять банерів чи відео на фоні в першому екрані — дорого для швидкості й рідко дорого для продажів. Одне якісне зображення і чіткий заголовок з кнопкою часто працюють краще.

5. Плагіни, конструктори, застосунки

Кожен плагін WordPress чи застосунок Shopify може додавати свої стилі й скрипти на всі сторінки, навіть там, де він не потрібен. Аудит плагінів і застосунків нерідко дає більше, ніж будь-який «плагін для швидкості».

6. Стабільність макета (CLS)

Вказати розміри зображень і відео, зарезервувати місце під банери й cookie-панель, підключити шрифти так, щоб текст не «перестрибував» після їх завантаження.

Особливості платформ

• WordPress і WooCommerce: найбільше впливають хостинг, кеш сторінок, кількість плагінів і важкі конструктори. У WooCommerce окремо перевірте сторінки каталогу з фільтрами й кошик: вони не кешуються так само, як звичайні сторінки, і на великих каталогах гальмують першими.
• Shopify: серверну частину і CDN забезпечує платформа, тож основні резерви — у темі й застосунках. Кожен встановлений застосунок може додавати скрипти навіть після видалення, якщо його код лишився в темі.
• Webflow і Squarespace: хостинг теж на боці платформи. Швидкість найчастіше з’їдають великі зображення й відео, анімації та вбудовані сторонні віджети.
• Сайти на React чи Next.js: важливо, щоб перший екран рендерився на сервері, а обсяг JavaScript, який браузер має виконати до першої взаємодії, був мінімальним.

Чого не робити

• Не ставте три плагіни оптимізації одночасно. Вони конфліктують, і сайт може зламатися або стати повільнішим.
• Не женіться за 100 балами в лабораторному тесті. Мета — добрі Core Web Vitals для реальних відвідувачів і зручний сайт, а не цифра на скриншоті.
• Не міняйте все одразу на живому сайті. Робіть зміни поетапно на копії і заміряйте результат після кожної.
• Не чекайте миттєвих змін у польових даних. Лабораторний тест покаже покращення одразу, а дані реальних користувачів оновлюються протягом 28 днів.

Приклад з нашої практики

У магазині будматеріалів на WooCommerce каталог налічує тисячі позицій, і без роботи над швидкістю такий магазин неминуче гальмує. Ми налаштували кешування й оптимізацію швидкості (WP Rocket) і технічне SEO, а каталог з 1С потрапляє на сайт без ручного введення.

Для зображень на WordPress-сайтах клієнтів ми використовуємо власний плагін Complete Image Optimizer: він конвертує нові й наявні зображення у WebP прямо на сервері, без підписок на сторонні сервіси. Це один із перших кроків, які ми робимо в межах оптимізації швидкості та підтримки.

Коли варто звернутися до фахівця

• Core Web Vitals у Search Console «погані» або «потребують покращення», а що саме гальмує — незрозуміло;
• сайт повільний навіть після плагінів кешу й оптимізації зображень;
• сайт зроблено на важкому конструкторі або застарілій темі, і кожна правка ламає щось інше;
• магазин з великим каталогом гальмує на фільтрах, пошуку чи в кошику;
• ви плануєте рекламу і хочете, щоб бюджет не згорів на повільній сторінці.

Симптоми й причини детально — на сторінці «Сайт повільно завантажується». Почніть з технічного аудиту (від 300 €): Lighthouse по ключових сторінках, перевірка теми, плагінів і хостингу, звіт з пріоритетами й кошторисом. Якщо сайт треба тримати у формі постійно — підтримка WordPress (від 100 € на місяць). Якщо причина в застарілій основі — редизайн на швидкій основі; щоб переїзд не коштував вам трафіку, тримайте під рукою чекліст редизайну без втрати позицій у Google. Надішліть адресу сайту — підкажемо, що гальмує найбільше.

Часті питання

Яка оцінка PageSpeed вважається нормальною?

Орієнтуйтеся не на бал, а на Core Web Vitals з реальних даних користувачів: LCP до 2,5 с, INP до 200 мс, CLS до 0,1. Бал у лабораторному тесті коливається від запуску до запуску і залежить від умов перевірки.

Чому PageSpeed показує погано, а в мене сайт відкривається швидко?

Ви відкриваєте сайт на потужному комп’ютері зі швидким інтернетом і часто вже з кешем. PageSpeed імітує середній телефон і повільніше з’єднання, а польові дані показують досвід реальних відвідувачів.

Чи допоможе плагін кешування?

Для WordPress кешування сторінок — один із перших кроків і часто помітно зменшує час відповіді сервера. Але воно не виправить важкі зображення, слайдер у першому екрані чи десяток сторонніх скриптів.

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

Core Web Vitals входять у сигнали досвіду сторінки, які Google враховує, але релевантність змісту важливіша. На практиці швидкість сильніше впливає на те, чи відвідувач дочекається сторінки й залишить заявку.

Скільки коштує прискорити сайт?

Технічний аудит з переліком причин і кошторисом — від 300 €. Часто основне прискорення дають зображення, кеш і прибирання зайвих скриптів. Якщо проблема в застарілій темі чи конструкторі, іноді вигідніше редизайн — від 1 200 €.