5 ідей для поліпшення швидкості завантаження сайту

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

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

Сила швидкості

Щоб не бути голослівними, ось вам трохи статистики:

  • Спираючись на дані, опубліковані Kinsta, зі сторінки, яка вантажиться більше ніж 5 с, підуть на інший сайт 74% користувачів зі своїх мобільних пристроїв.
  • А згідно з маркетинговими дослідженнями Think with Google, показники відмови можуть вирости до 113%, при збільшенні швидкості завантаження на 6 секунд;


Останні дослідження компанії Google показали, що сторінки, які почали завантажуватися всього на 0,5 с довше втратили 20% трафіку. Особливо це стосується мобільної версії сайту, оскільки переважна кількість користувачів заходять на сайти в основному з мобільних пристроїв.

Вплив показника швидкості завантаження на сайт

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

Але не варто засмучуватися – вихід є з будь-якої ситуації. Далі ми розглянемо 5 ефективних способів, які допоможуть вашому сайту досягти кращих показників.

Якими інструментами вимірювати швидкість завантаження?

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

  • PageSpeed ​​Insights від Google. Даний інструмент показує швидкість завантаження мобільної версії сайту і ПК, оцінка ставиться за 100-бальною шкалою, також даються рекомендації щодо покращення завантаження.

  • WebPageTest. Цей інструмент дозволяє вибрати пристрій, браузер, місце розташування. Наприклад, тут можна подивитися як швидко буде завантажуватися сайт на Iphone 6 в Індії або в браузері Chrome в Америці.

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

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

Як же збільшити швидкість сайту?

1. Почніть з картинок

Найголовніше – використовувати зображення відповідного розміру, можливо навіть різні варіанти картинок для різних пристроїв. Для цього можна скористатися вбудованими в багатьох сучасних CMS засобами ресемплингу картинок (наприклад, у WordPress).

Зменшити вагу зображень також можна стискаючи їх. Про це часто забувають: тільки 45% інтернет магазинів використовують на своєму сайті стислі картинки. Допомогти з цим можуть такі сервіси, як Photoshop – вибравши опцію “Зберегти для WEB” і вибрати якість картинки не більше 80% (при цьому вага картинки може знизитися у 10 разів). Якщо даними інструментами ви не володієте, тоді можна скористатися безкоштовними сервісами https://tinyjpg.com/ або https://compressor.io/. Там все досить просто і зрозуміло.

Також, можна видалити непотрібні картинки.

2. Почистьте вихідний код

Зменшення розміру front-end файлів сайту може допомогти добре знизити швидкість завантаження. Просто займіться видаленням порожніх рядків, зайвих пробілів і непотрібних тегів.

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

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

3. Зменште розміри сторінок сайту

Легка сторінка буде швидше завантажуватися. Для цього включіть стиснення даних протоколу htttp технологіями GZIP або ZIP. Це допоможе мінімізувати запити до сервера з боку браузера, зменшивши розміри файлів.

4. Мінімізуйте редиректи

Використання 301- або 302-редиректів – стандартна практика: з їх допомогою пошукові боти дізнаються, що дана сторінка була переміщена на інший url. Це дозволяє уникнути на сайті неіснуючих сторінок і 404-помилок, але вони гальмують завантаження сайту. Сам Google рекомендує, за можливістю, мінімізувати їх використання, тому що це призводить до додаткових переходів за мережею.

Подивитися всі редиректи ви можете за допомогою програми Screaming Frog.

5. Переїхати на виділений сервер

Часто виходить, що на одному сервері знаходяться багато сайтів і їм доводиться ділити між собою його серверну потужність. Сайти з величезною відвідуваністю, такі як інтернет-магазини або портали часто не витримують таке навантаження і починають гальмувати і повільно завантажуватися.

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

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

Додаткові поради

  • Видаліть непотрібні плагіни з вашої CMS, якими вже давно не користуєтеся, або видаліть їх, попросивши розробити власні рішення вашого розробника.
  • Надішліть важкі файли на сторонні сервіси, такі як Wistia або Imgur. Також, краще завантажити відео на YouTube і вставити на сайт код, ніж завантажувати його безпосередньо на сторінку.
  • Використовуйте технологію AMP від ​​Google – прискорені мобільні сторінки. З їх допомогою на таких сторінках завантажується тільки контент без красивого дизайну, реклами, динамічних блоків і т.д. Швидкість таких сторінок в межах 3 секунд. В основному цю технологію застосовують інформаційні сайти, блоги або новинні портали.


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

Висновки

  1. Ефективність просування сайту безпосередньо залежить від швидкості його завантаження. Ідеально, коли він вантажиться у межах 3 с.
  2. Намагайтеся оптимізувати все, що тільки можна (розмір зображень, відео, CSS і html коди). Приберіть все непотрібне і мінімізуйте використання об’ємних графічних елементів.
  3. Візьміть собі за правило регулярно перевіряти швидкість сайту, щоб у разі її збільшення, як можна швидше знайти причину і усунути її.