Чому сайт повільно завантажується і як це виправити

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

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

Чому швидкість сайту впливає на гроші

Повільне завантаження б’є по бізнесу одразу з трьох боків, і кожен з них можна виміряти.

• Відмови. Відвідувач, який не дочекався завантаження, у статистиці називається відмовою. Він не побачив ні товарів, ні телефону, ні форми заявки. Гроші на рекламу за цей клік уже витрачені, а результату немає.
• Конверсія. Навіть ті, хто дочекався, поводяться інакше на повільному сайті. Кожна зайва секунда очікування на сторінці кошика чи форми зменшує кількість завершених замовлень. Людям просто некомфортно, і вони відкладають покупку «на потім».
• Позиції в пошуку. Google враховує швидкість сторінок під час ранжування, особливо на мобільних. Повільний сайт поступово опускається у видачі, а разом з позиціями падає і безкоштовний трафік.

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

Найчастіші причини повільного завантаження

За роки роботи з сайтами на WordPress, OpenCart та інших платформах ми помітили, що причини повторюються. Ось шість найпоширеніших, від найчастішої до менш очевидних.

Важкі неоптимізовані картинки

Лідер з великим відривом. Фото з телефону чи від фотографа важить 5-10 МБ, і його завантажують на сайт як є. Десять таких фото на сторінці, і відвідувачу треба викачати обсяг даних, як за короткий відеоролик. Правильно підготовлене зображення для сайту важить у десятки разів менше без помітної втрати якості. Його стискають, зменшують до потрібного розміру і конвертують у сучасні формати.

Дешевий перевантажений хостинг

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

Відсутність кешування

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

Зайві плагіни та скрипти

Ось типова історія. За роки на сайт додали онлайн-чат, який ніхто не відкриває, три лічильники статистики, слайдер, застарілий календар і кнопки соцмереж. Кожен такий елемент довантажує свої скрипти і стилі, навіть якщо ним ніхто не користується. Окрема історія з плагінами. На сайтах, які ми беремо на підтримку, регулярно знаходимо 30-40 встановлених плагінів, з яких реально потрібні менше половини.

Стара версія PHP

PHP — це мова програмування, на якій працюють WordPress, WooCommerce і OpenCart. Її версії оновлюються, і новіші зазвичай працюють помітно швидше. Сайт, який роками ніхто не обслуговував, часто працює на версії п’ятирічної давнини. Це і повільніше, і небезпечно, бо старі версії не отримують оновлень безпеки. Оновлення PHP іноді помітно прискорює сайт без жодних інших змін.

Занедбана база даних

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

Ще три важелі, які прискорюють сайт

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

• CDN. Це мережа серверів у різних країнах, яка віддає ваші картинки і файли з точки, найближчої до відвідувача. Людина умовно зі Львова отримує дані не з далекого сервера, а з сусіднього, тому сторінка вантажиться швидше.
• Серверне стиснення. Технології GZIP і Brotli стискають код сторінки перед відправкою в браузер, ніби архів. Файл долітає меншим і швидше розпаковується у відвідувача. Вмикається на рівні сервера і майже завжди дає безкоштовний приріст.
• Відкладене завантаження картинок (lazy load). Браузер підвантажує зображення не всі одразу, а лише коли відвідувач до них домотує. Верх сторінки показується миттєво, а важкі фото внизу чекають своєї черги.

Як перевірити швидкість самостійно

Для базової перевірки не потрібен програміст. Відкрийте безкоштовний сервіс PageSpeed Insights від Google, введіть адресу свого сайту і зачекайте на звіт. Сервіс покаже дві оцінки — для мобільних і для комп’ютерів.

На що дивитися насамперед:

• Мобільна оцінка. Саме вона найважливіша, бо більшість відвідувачів заходить з телефонів, і Google оцінює саме мобільну версію. Оцінка від 0 до 100. Зелена зона від 90, помаранчева 50-89, червона нижче 50.
• LCP. За абревіатурою ховається проста річ — час, коли відвідувач бачить головний контент сторінки, наприклад велике фото чи заголовок. До 2,5 секунди це добре, більше 4 секунд це проблема, яку відвідувачі відчувають фізично.

LCP не єдина метрика. Google також враховує INP, тобто наскільки швидко сторінка реагує на ваші натискання, і CLS, який показує, чи не стрибає верстка під час завантаження. Обидві впливають на зручність, але для першого кроку достатньо LCP.

Дві поради до результатів. Перевіряйте не лише головну, а й сторінки товарів чи послуг, куди веде реклама. І не панікуйте через помаранчеві цифри — порівняйте свій результат з сайтами конкурентів. Якщо у вас 60, а в них 30, ситуація не критична, хоча простір для покращення є.

Що можна виправити самостійно

Частину проблем власник може вирішити без розробника, якщо діяти акуратно.

• Стискайте нові картинки перед завантаженням. Безкоштовних онлайн-сервісів для стискання достатньо. Завантажили фото, отримали файл у кілька разів легший, поставили на сайт.
• Видаліть плагіни, якими не користуєтеся. Пройдіться списком і чесно дайте відповідь, що з цього реально працює на бізнес. Деактивували, перевірили, що все працює, тоді видалили.
• Приберіть зайві віджети. Чат, у якому ніхто не відповідає, шкодить двічі — гальмує сайт і дратує клієнтів без відповіді.
• Перегляньте тариф хостингу. Якщо сайт живе на мінімальному тарифі ще з часів запуску, а бізнес виріс, перехід на тариф вище часто дає ефект одразу.

Одне застереження. Перед будь-якими змінами зробіть резервну копію сайту або попросіть хостинг-провайдера підтвердити, що вона є і свіжа.

Що краще довірити спеціалісту

Інша частина робіт вимагає досвіду, бо помилка може покласти сайт повністю.

• Оновлення версії PHP. Старі теми і плагіни можуть бути несумісні з новою версією. Спеціаліст спочатку перевіряє сумісність на копії сайту і лише потім оновлює робочий.
• Налаштування кешування. Неправильно налаштований кеш показує відвідувачам застарілі ціни або ламає кошик в інтернет-магазині.
• Оптимізація бази даних. Чищення бази без розуміння структури може знищити дані, які виглядали як сміття, а були потрібні.
• Масове стискання наявних картинок. Якщо на сайті тисячі зображень, їх обробляють пакетно на сервері, і тут легко зіпсувати оригінали без резервної копії.
• Переїзд на інший хостинг. Перенесення сайту з базою, поштою і сертифікатами безпеки має пройти без простою, а це питання досвіду.

Усе це ми робимо в межах підтримки проєктів. Спочатку діагностика на копії сайту, потім акуратні зміни на робочому, зі свіжим бекапом на випадок відкату.

Обережно з «прискорювачами однієї кнопки»

Окреме попередження. Існують плагіни, які обіцяють прискорити сайт одним натисканням. Увімкнули, і оцінка нібито виросла. На практиці ми регулярно розгрібаємо наслідки таких експериментів:

• зникли стилі, і сайт «розсипався»;
• перестала працювати форма заявки;
• кошик показує видалені товари;
• покращення в оцінці виявилося тимчасовим.

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

Висновки

Швидкість сайту напряму впливає на відмови, конверсію і позиції в пошуку, тобто на гроші. Найчастіше гальмують сайт важкі картинки, слабкий хостинг, відсутність кешування, зайві плагіни, стара версія PHP і захаращена база даних. Перевірити свій сайт можна безкоштовно через PageSpeed Insights. Дивіться на мобільну оцінку і показник LCP. Прості речі на кшталт стискання нових картинок робіть самостійно, а втручання в PHP, кеш і базу даних довірте спеціалістам. І не вірте обіцянкам прискорити все однією кнопкою, бо без діагностики це лотерея.

Якщо розбиратися з цим самостійно не хочеться, передайте це завдання нам. Amidcode, веб-студія з Києва, працює з 2012 року і за цей час реалізувала понад 300 проєктів. У межах підтримки проєктів ми проводимо аудит швидкості, знаходимо причини і виправляємо їх без ризику для робочого сайту. Наприклад, робота над проєктом інтернет-магазину 911 Balsam допомогла йому вийти на 4-кратне зростання онлайн-продажів, а побачити інші наші роботи можна в портфоліо. Якщо ж сайт застарів настільки, що простіше зробити новий, подивіться наші послуги зі створення корпоративних сайтів та інтернет-магазинів. Для нестандартних завдань є кастомна розробка, а деталі та формати співпраці описані на сторінках послуг. Перший крок простий: надішліть нам посилання на свій сайт, і ми повернемося з переліком причин та планом виправлення.