Як прискорити сайт

1. Що таке швидкість завантаження сайту
2. Чому швидкодію сайту важливо
3. Типи оптимізації завантаження сайту
4. Як дізнатися показники швидкодії сайту
5. Що ще варто перевірити
6. Другорядні і непотрібні елементи сторінки
7. Витрата системних ресурсів сервера

Швидкий сайт - це необхідна умова попадання сайту в ТОП пошукових систем, високі конверсії і задоволений відвідувач (якщо, звичайно, все в порядку з контентом, юзабіліті і цінами). Що зробити, щоб сайт був швидким? Ми підготували керівництво для маркетологів, власників інтернет-магазинів, веб-майстрів.

Що таке швидкість завантаження сайту

Швидкість завантаження сторінки сайту визначає проміжок часу, за який веб-сторінка або медіа-контент скачується з віддаленого сервера і відображається в браузері клієнта. Говорячи про швидкодію, ми маємо на увазі час, протягом якого після кліка по посиланню всі запитані вашим браузером ресурси викачуються до вас на комп'ютер і відображаються на дисплеї.

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

• Час отримання першого відгуку з віддаленого сервера (TTFB, Time To First Byte). За цей час браузер тільки отримує відповідь від віддаленого сервера і починає завантажувати контент сторінки, користувач взаємодіяти з сайтом поки не може.
• Час, необхідний для першої відтворення екрану (час першого взаємодії користувача з сайтом). З цього моменту користувач бачить отримані дані першого екрану, але завантаження всього контенту сторінки ще не завершена, і ще не всі можливості сторінки користувачеві доступні (контент другого екрану, застосування фільтрів, внутрішнього пошуку по сайту і т.п.).
• Час, коли відвідувач вже може взаємодіяти з сайтом. З цього моменту відвідувач може виконувати якісь дії на сторінці, хоча завантаження ще не завершена.
• Час повного завантаження сторінки, необхідне, щоб стали доступні всі ресурси, які використовує сторінка (текстовий контент, графіка, оформлення, javascript, файли шрифтів, відео з зовнішніх ресурсів, скрипти аналітики).

Чому швидкодію сайту важливо

Повільно завантажується сайт прямо впливає на місце в пошуковій видачі. Якщо ви збираєтеся просувати сайт в пошукових системах , Питання швидкодії стає пріоритетним. Навіть у досвідчених SEO-оптимізаторів можна зустріти сентенції на кшталт «Google все одно, скільки там часу потрібно вашому сайту для завантаження. 10, 15 seconds - різниці немає. Чи не все одно відвідувачам, і бачачи високий відсоток відмови, ПС знизить вас у видачі ». - Це лише частина правди. Швидкодія безпосередньо впливає на результати ранжирування, і є рекомендовані пошуковими системами параметри, на які треба орієнтуватися.

Швидкодію сайту - важливий фактор ранжування. Повільний сайт неконкурентоспроможний.

Ще одна важлива причина зайнятися оптимізацією швидкості завантаження - це відвідувачі. Кожна секунда часу завантаження сайту збільшує відсоток відмов (відвідувачі просто йдуть, не дочекавшись завантаження), а також знижує шанс конвертувати відвідувача в покупця. І з кожним роком допустимий час завантаження знижується. Якщо в 90-і роки Інтернет називали не інакше як World Wide Wait, і довге очікування завантаження сторінки нікого не бентежило, то зараз 40% відвідувачів йдуть з сайту, якщо час завантаження сторінки займає більше 2 секунд. За цей час навіть система аналітики не встигає завантажитися, а ви не дізнаєтеся, що втратили потенційного клієнта. 74% відвідувачів із мобільних пристроїв підуть, якщо сайт вантажиться довше 5 секунд. І це цифри 2014 року !

Причини «нетерплячості» користувачів полягають в фізіології мозку людини. 100 мс зберігається візуальна інформація в сенсорної пам'яті. Сховище такої пам'яті очищається через 0,1 с, а через 10 секунд увага розсіюється - і не отримав очікуваного відвідувач відчуває фрустрацію, розчарування і навіть злість. Це вже не ваш клієнт, ви його втратили.

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

Типи оптимізації завантаження сайту

Оптимізація завантаження сайту може бути двох типів:

• Об'єктивна оптимізація, при якій фізично скорочується час відгуку сервера, знижується кількість запитів до нього, зменшується кількість інформації, що передається за рахунок кешування і архівації файлів, стиснення або скорочення непотрібного коду;
• Суб'єктивне прискорення, коли користувачеві здається, що завантаження вже сталася просто рахунок того, що доступ до важливої ​​контенту він вже отримав до повного завантаження сторінки. Другий спосіб - маніпулятівен, це в більшій мірі психологічний трюк, але він теж працює.

Швидкодія - абсолютний показник ефективності сайту (на відміну від відвідуваності, конверсії і т.д.). Швидкість завантаження можна виміряти і порівняти зі швидкістю завантаження будь-якого іншого сайту. На жаль, власники сайтів і розробники приділяють цьому питанню дуже мало уваги вже на стадії проектування. Це істотно обмежує можливості оптимізації сайту, в тому числі - і пошукової. Але все ж багато чого можна поліпшити і після запуску сайту. Щоб зрозуміти, що оптимізувати в першу чергу, треба провести вимірювання. Як? - Про це далі.

Як дізнатися показники швидкодії сайту

Повний технічний аудит сайту - завдання для професіоналів. Але навіть не володіючи глибокими знаннями в цій області, ви можна зібрати інформацію про стан свого сайту за допомогою веб-сервісів. Один з рекомендованих - https://www.webpagetest.org/ .

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

• Навіщо визначати фізичне розташування сервера? - Ваш хостинг повинен фізично ближче розташовуватися до місця, де живе цільова аудиторія вашого сайту. Якщо ваша ЦА живе в Москві, але сервер розташований у Владивостоці, варто задуматися про перенесення сайту на інший майданчик.
• Навіщо визначати браузер? - Якщо ваші клієнти використовують переважно Chrome, а тести використовують, наприклад, Internet Explorer - ви отримаєте нерелевантні результати тестів. Знаючи дані по конкретним браузерам, ви будете розуміти, які проблеми треба вирішувати, і можете визначити пріоритетність цих проблем.
• Навіщо визначати тип пристрою? - Різниця між взаємодією сайту зі смартфона і ПК може бути значною, а ви повинні розуміти, з якими труднощами стикаються ваші відвідувачі.

Після проходження серії тестів сервіс покаже розгорнутий графік, що показує:

• Кількість запитів, що визначають послідовність завантаження;
• Час завантаження контенту по кожному запиту;
• Фізичний розмір контенту, що завантажується по кожному запиту.

Уважно вивчіть цей список. Це - основа для плану майбутньої оптимізації. Наприклад, ви бачите, що завантаження уповільнюють підкачуємі з вашого сервера файли шрифтів. Чи настільки вони важливі для дизайну вашого сайту і чи можна їх замінити на стандартні системні шрифти, встановлені за замовчуванням у кожного відвідувача? Або, можливо, варто використовувати web-шрифти з серверів Google, обмеживши шрифтову гарнітуру тільки необхідними знаками (наприклад, використовувати лише кириличні літери і цифри).

Крім подробиць щодо послідовності запитів, сервіс покаже, які рекомендовані настройки варто включити на сервері. На них відносяться: кешування даних, підтримка keep-alive, архівування переданих по мережі даних для зменшення їх розміру, використання зовнішнього сховища файлів (CDN) і т.д. Ці дані можна використовувати як основу для постановки технічного завдання вашому веб-майстру або системного адміністратора.

Що ще варто перевірити

Первинний відгук сервера (TTFB)

Перевірте TTFB (первинний відгук сайту). Google Speed ​​Insights рекомендує утримувати цей час до 200 мс ( https://developers.google.com/speed/docs/insights/Server ). З чого складається цей час?

• Пошук DNS сайту, до якого ви звертаєтеся
• Обробка сервером запиту користувача
• Відповідь клієнту на запит.

Висновок 1. Занадто великий час отримання першого байта - повільний сервер, недолік системних ресурсів, настройки брандмауера, географічна віддаленість сервера, погано оптимізований код сайту, велика кількість запитів сторонніх сервісів до зовнішніх ресурсів (віджети соцмереж, коди аналітик, скрипти коллтрекінга, чати). Подумайте, від чого можна відмовитися, а що потрібно оптимізувати.

Другорядні і непотрібні елементи сторінки

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

Присутність на сторінці непотрібних елементів уповільнює доступ до основних ресурсів, негативно впливаючи на конверсію.

Висновок 2. Додайте найважливішу інформацію на першому екрані. Видаліть зайві або необов'язкові елементи, що уповільнюють завантаження. Другорядні дані зробіть доступними за запитом користувача, або змістите їх вниз. Особливо це стосується важкого медіа-контенту (картинки, відео).

Витрата системних ресурсів сервера

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

Ще один спосіб знизити навантаження на сервер - відключити непотрібні сервіси, плагіни, служби в CMS і інтерфейсі сайту. Наприклад, модуль веб-аналітики 1С-Бітрікс на багатьох сайтах включений за замовчуванням. Ресурсів він з'їдає багато, при тому, що його даними користуються далеко не всі власники і адміністратори сайтів.

Висновок 3. Складіть технічне завдання вебмайстру на перевірку витрати ресурсів сайту. Можливо, варто змінити тариф на хостингу, або з віртуального хостингу перейти на виділений віртуальний сервер (VPS), або досить відключити частину непотрібних модулів і плагінів.

Детально про оптимізації завантаження і швидкодії сайту ми розповімо в наступній статті. Підпишіться на нашу сторінку в Facebook, щоб не пропустити новий матеріал!