Чому сайт повільно завантажується і як його прискорити
Через що гальмує сайт: важкі фото, плагіни, хостинг, віджети. Як перевірити швидкість за хвилину, що виправити самому, а що доручити розробнику.
Найчастіше сайт гальмує через три речі: величезні фото без стиснення, надлишок плагінів і сторонніх скриптів та слабкий хостинг. Перевірити, що саме заважає вашому сайту, можна за хвилину безкоштовно, а більшість проблем виправляється за кілька годин роботи — без переробки сайту з нуля.
Чому швидкість — це гроші, а не дрібниця
Більшість ваших відвідувачів відкриває сайт з телефона: у черзі, в транспорті, на ходу, часто через мобільний інтернет. Якщо сторінка кілька секунд показує білий екран, людина не чекає — вона повертається в пошук і відкриває сусідній сайт. Ви заплатили за рекламу чи SEO, а клієнт пішов ще до того, як побачив ваш товар.
Друга причина — пошук. Google враховує швидкість і зручність сторінки, коли вирішує, кого показати вище. Повільний сайт не обов'язково вилетить з видачі, але програватиме конкурентам з подібним вмістом.
Повільний сайт втрачає клієнтів тихо: ніхто не напише вам, що пішов, — просто заявок стане менше.
Як перевірити швидкість самому за хвилину
Не треба бути програмістом. Є два прості способи, і обидва безкоштовні.
- Відкрийте нашу безкоштовну перевірку сайту, вставте адресу й зачекайте близько 10 секунд. Ви отримаєте 36 перевірок: швидкість, SEO, доступність, безпеку — з поясненнями, що не так.
- Відкрийте PageSpeed Insights від Google, вставте ту саму адресу й подивіться вкладку «Мобільний пристрій». Саме мобільний результат важливіший, бо з телефонів заходить більшість людей.
- Перевірте не лише головну, а й сторінку товару чи послуги — часто гальмує саме вона.
- Відкрийте сайт зі свого телефона через мобільний інтернет, а не через домашній Wi-Fi. Так ви побачите те, що бачить клієнт.
Якщо оцінки червоні або жовті — є що покращувати. Якщо зелені, а сайт усе одно здається повільним, проблема може бути в окремих сторінках чи формах.
Що означають показники простими словами
PageSpeed показує багато цифр, але для власника бізнесу важливі три основні. Їх ще називають Core Web Vitals — ключові показники якості сторінки.
- LCP — коли з'явився головний вміст: велике фото, банер чи заголовок першого екрана. Це момент, коли людина бачить, що сайт працює. Добрим вважається результат до 2,5 секунди.
- CLS — стрибки макета. Ви хочете натиснути кнопку, а вона раптом з'їжджає вниз, бо зверху довантажився банер. Чим менше таких стрибків, тим краще.
- INP — реакція на натискання. Скільки минає від того, як людина торкнулася кнопки чи меню, до того, як сайт відреагував. Якщо сайт «думає» після кожного дотику, це дратує.
Загальна оцінка від 0 до 100 — це зведення цих та інших показників. Гнатися за ідеальними 100 не обов'язково, головне — вийти в зелену зону за трьома основними.
Врахуйте, що результат PageSpeed трохи змінюється від запуску до запуску: різниця в кілька балів — це норма. Дивіться на загальну картину і на те, які саме пункти сервіс позначає червоним, — там і підказки, що виправляти в першу чергу.
Типові причини повільного сайту
За нашими спостереженнями, причини повторюються від сайту до сайту. Ось вони — приблизно в порядку того, як часто ми їх зустрічаємо.
- Величезні фото без стиснення. Знімок з телефона чи фотоапарата важить кілька мегабайт, а на сайті він показується розміром з долоню. Браузер усе одно завантажує весь файл.
- Десятки плагінів WordPress. Кожен плагін додає свої скрипти й стилі на всі сторінки, навіть там, де він не потрібен. Слайдер, форма, соцкнопки, ще один слайдер — і сторінка тягне за собою купу зайвого коду.
- Дешевий хостинг. Сервер за кілька доларів на місяць ділить ресурси з сотнями інших сайтів. Навіть легкий сайт на ньому може довго «думати» перед відповіддю.
- Сторонні віджети й лічильники. Онлайн-чати, кілька систем аналітики, пікселі реклами, віджети відгуків — кожен завантажується з чужого сервера й гальмує сторінку.
- Шрифти. Кілька фірмових шрифтів у різних варіантах накреслення — це ще кілька файлів, без яких текст може не з'являтися або «стрибати».
- Відсутність кешу. Без кешування сервер щоразу заново збирає сторінку для кожного відвідувача, замість того щоб віддати готову копію.
- Застаріла версія PHP. Багато сайтів на WordPress досі працюють на старій версії мови, на якій вони написані. Нові версії помітно швидші й безпечніші.
Що можна зробити самому
Частину роботи власник сайту може виконати без розробника, якщо має доступ до адмінки. Це не дасть ідеального результату, але часто помітно покращує ситуацію.
- Перед завантаженням стискайте фото: безкоштовні онлайн-сервіси зменшують вагу в рази без помітної втрати якості. Для сайту зазвичай достатньо ширини 1600–2000 пікселів.
- Пройдіться списком плагінів і вимкніть ті, якими ніхто не користується. Перед цим зробіть резервну копію.
- Приберіть зайві віджети й лічильники: якщо на сайті три системи аналітики, а дивитеся ви одну, дві інші лише гальмують.
- Перевірте в панелі хостингу версію PHP — часто її можна змінити одним перемикачем. Але після зміни обов'язково пройдіться сайтом і перевірте форми та кошик.
Якщо щось пішло не так після зміни — відкотіть її. Експериментувати на живому сайті без резервної копії не варто.
Що краще доручити розробнику
Глибші речі потребують доступу до коду й сервера та розуміння, як усе пов'язано. Сюди належать налаштування кешування й стиснення на сервері, автоматичне перетворення фото в сучасні формати, відкладене завантаження скриптів і зображень, підключення шрифтів без стрибків, прибирання зайвого коду з теми, переїзд на кращий хостинг.
Ці правки легко зробити неправильно: зламати форму замовлення, кошик чи аналітику. Тому ми спершу перевіряємо сайт, складаємо список конкретних причин і лише потім беремося за виправлення — від найвідчутніших до дрібних.
Після роботи ми повторюємо ту саму перевірку і показуємо вам результат до і після. Окремо проходимо ключові сценарії: оформлення замовлення, відправку форми, пошук, роботу на телефоні. Прискорення не має сенсу, якщо по дорозі зламалася кнопка «Купити».
Скільки це коштує в нас. Якщо проблема локальна — стиснути фото, налаштувати кеш, прибрати кілька важких скриптів, — це задача на кілька годин за 2 200 ₴. Якщо ж потрібне комплексне прискорення до зелених показників PageSpeed, з переглядом теми, плагінів і хостингу, — це велике доопрацювання від 9 900 ₴. Детальніше — на сторінці доопрацювання сайтів. Предоплата 50 %, решта — після того, як ви перевірите результат.
Як ми робимо швидкі сайти з самого початку
Прискорювати готовий сайт — це завжди компроміс: щось можна виправити, а щось закладено в самій основі. Тому нові проєкти ми одразу будуємо так, щоб вони були легкими.
Буває, що сайт повільний у самій основі: стара тема з десятками вбудованих функцій, конструктор, який не дає змінити код, або нашарування правок від кількох різних виконавців. Тоді латання дає лише частковий результат, і чесніше сказати про це одразу. У таких випадках ми порівнюємо вартість доопрацювання з вартістю нового легкого сайту — і ви обираєте, що вигідніше саме вам.
Приклад — наш каталог Peony Collection на 124 сорти півоній. Він зібраний статикою: сторінки готуються заздалегідь, і сервер просто віддає готовий файл, нічого не обчислюючи на льоту. Фото стискаються автоматично, зайвих скриптів немає. У результаті каталог відкривається практично миттєво навіть з телефона. Інші наші роботи можна переглянути в портфоліо.
Підсумок: з чого почати
Почніть з простої перевірки: запустіть безкоштовну перевірку сайту і PageSpeed для мобільної версії. Подивіться на три показники — LCP, CLS та INP — і на список зауважень. Найчастіше винні важкі фото, зайві плагіни, віджети й слабкий хостинг, і частину з цього ви можете прибрати самі.
Якщо не хочеться розбиратися самому або після простих кроків оцінка все одно червона — напишіть нам у Telegram чи Viber і надішліть адресу сайту. Ми подивимося, що саме гальмує, і скажемо, чи вистачить задачі на кілька годин, чи потрібне більше доопрацювання.
Потрібна така сама система?
Розкажіть про задачу — відповімо, скільки це коштує і скільки часу займе.