Швидкість сайту: як перевірити й що виправляти першим

Точкові шлейфи, що витягуються вправо — обкладинка статті про швидкість сайту

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

Три показники, які дивиться Google

Набір метрик називається Core Web Vitals. Їх три, і кожна відповідає за свій бік відчуття «швидко чи повільно»:

Метрика Що вимірює Норма
LCP коли з’явився головний елемент екрана — зазвичай велика картинка чи заголовок до 2,5 с
INP наскільки швидко сторінка відповідає на дії: натискання, введення до 200 мс
CLS чи стрибає верстка під час завантаження до 0,1

INP замінив попередню метрику FID у 2024 році: вимірюють уже не першу реакцію, а всі взаємодії за візит.

Як перевірити

PageSpeed Insights

Найпростіший спосіб: вставте адресу на pagespeed.web.dev. Дивіться вкладку «Мобільні» — саме звідти приходить більшість відвідувачів, і саме там цифри гірші.

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

Search Console

Розділ «Основні інтернет-показники» показує ситуацію по всьому сайту, а не по одній сторінці, і групує адреси за проблемами. Якщо сторінок мало, дані можуть не назбиратися — це нормально.

Найпростіша перевірка

Відкрийте сайт з телефона на мобільному інтернеті, не на Wi-Fi. Порахуйте секунди до моменту, коли можна щось натиснути. Ця перевірка чесніша за будь-який бал.

Що виправляти в першу чергу

Картинки — джерело 80% зайвої ваги

Типова ситуація: фото з камери на 4000 пікселів і 8 МБ, яке показується в блоці шириною 800. Браузер завантажить його повністю.

  • Зменшуйте до реального розміру відображення.
  • Переводьте у WebP — при тій самій якості файл на 25–35% менший.
  • Ставте width і height в коді: без них сторінка стрибає, коли картинка підвантажилася, і псує CLS.
  • Вмикайте відкладене завантаження для всього, що нижче першого екрана. Але не для головної картинки вгорі — її, навпаки, треба завантажити першою.

Підготувати картинки можна прямо зараз: стиснути й конвертувати у WebP — до 30 файлів за раз, без завантаження на сервер.

Чужі скрипти

Кожен віджет — чат, карта, віджет відгуків, піксель реклами — це запит до чужого сервера. Ваш хостинг може бути швидким, а сторінка все одно чекатиме.

Перевірте, чи всі вони потрібні, і чи вантажаться там, де справді використовуються. Віджет відгуків, підключений на всіх сторінках заради однієї, — типова знахідка.

Шрифти

Тримайте шрифти на своєму сервері, а не підвантажуйте зі сторонніх сервісів, і додавайте font-display: swap — тоді текст покажеться одразу системним шрифтом, а не після завантаження файлу.

Хостинг і кеш

Якщо сервер думає над відповіддю більше 0,5 секунди, оптимізація картинок мало допоможе. Увімкніть кешування сторінок, перевірте версію PHP: на старих гілках сайт працює помітно повільніше, ніж на 8.2–8.3.

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

Ганятися за сотнею балів. PageSpeed — діагностичний інструмент, а не мета. Різниця між 85 і 100 балами користувачеві непомітна, а зусиль на неї йде більше, ніж на шлях від 40 до 85.

Ставити п’ять плагінів оптимізації одразу. Вони конфліктують між собою, і потім неможливо зрозуміти, що саме зламало верстку.

Вимикати все підряд. Якщо прибрати аналітику заради балів, ви перестанете бачити, звідки приходять клієнти. Швидкість — засіб, а не самоціль.

Скільки це дає насправді

Швидкість — один із багатьох факторів ранжування, і сама по собі вона не виведе сайт у топ. Але вона впливає на поведінку: скільки людей дочекалися завантаження й дійшли до форми. Тому ефект найпомітніший там, де є платний трафік — ви платите за кожен перехід і втрачаєте частину ще до показу пропозиції.

Інші причини, чому відвідувачі не залишають заявок, ми розібрали окремо: сім місць, де протікає воронка.

Коротко

Почніть з картинок і чужих скриптів — це 80% результату за 20% зусиль. Перевіряйте на мобільному й дивіться на дані реальних користувачів, а не на лабораторний бал.

Не хочете розбиратися самі — ми беремо сайти на підтримку, зокрема чужі, і починаємо з аудиту: ви отримуєте перелік проблем із поясненням, що критично, а що почекає.

Потрібен сайт, який працює на результат?

ORDER A SITE