Як перевірити і збільшити швидкість завантаження сайту

Як перевірити і збільшити швидкість завантаження сайту

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

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

Отже, чим швидше буде завантажуватися ваш сайт - тим більше відвідувачів ви привернете. Але як перевірити цю швидкість?

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

Для перевірки швидкості завантаження сайту існує безліч онлайн-сервісів. Про них можна почитати в статті Хто швидше? 6 + інструментів для перевірки швидкості завантаження сайту. Але я хочу виділити тільки два, якими користуюся сам: це сервіси пошукових систем Google і Яндекс.

Google: PageSpeed ​​Insights

Як перевірити і збільшити швидкість завантаження сайту

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

Яндекс: Перевірка відповіді сервісу

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

Знаходиться він в Яндекс.Вебмастере під пунктом «Перевірити відповідь сервера» на сторінці «Мої сайти». Важливо: перевірити можна тільки ті сайти, за якими підтверджено право власності в Яндекс.Вебмастере.

Як перевірити і збільшити швидкість завантаження сайту

Звертайте увагу на час відгуку сайту - чим воно менше, тим краще. Якщо час відгуку перевищує 1000 мс, то варто задуматися про оптимізацію сайту або зміні хостингу.

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

Іноді досить змінити хостинг на дорожчий, щоб швидкість завантаження сайту зросла. Або движок. Як відомо, багато сайтів побудовані на популярних CMS - WordPress, Joomla, Drupal, DLE, а ці движки самі по собі можуть навантажувати сервер навіть без дизайну та інших примочок. Але давайте розберемо загальні моменти, які справедливі для всіх двигунів.

1. Використовуйте Gzip-стиснення

Популярні веб-сервери Apache і Nginx підтримують стиснення на льоту. Якщо у вас на сайті багато текстового контенту, то таке стиснення зможе значно прискорити роботу сайту.

Щоб визначити, чи включено стиснення для вашого сайту, зверніть увагу на заголовок у відповіді сервера Content-Encoding: gzip

2. Зменшіть кількість HTTP-запитів

Велику частину часу браузер витрачає на завантаження різних компонентів веб-сторінки: таблиць стилів, Java-скриптів, зображень і т.п. За специфікації HTTP / 1.1 більшість браузерів паралельно завантажують не більше двох елементів.

Для більш швидкого завантаження можна використовувати кілька способів:

  • об'єднання декількох HTML і CSS-файлів в один;
  • використання CSS-спрайтів;
  • мінімізація кількості картинок і об'єднання їх в один файл;
  • використання піддоменів для завантаження скриптів і зображень;
  • використання CDN-сервісів.

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

Новий стандарт HTML5 може значно спростити завантаження різних скриптів, що значно збільшує швидкість завантаження сайту. HTML влаштований так, що завантажує код сторінки рядок за рядком, тобто синхронно. Новий же стандарт дозволяє не чекати завантаження різних яваскрипт, а вантажити код сторінки паралельно (асинхронно). Можна взагалі призупинити завантаження скриптів до повного завантаження інших елементів сторінки, незалежно від того, де знаходиться рядок скрипта - на початку або в кінці файлу. Це значно прискорить швидкість роботи сайту.

6. Використовуйте кешування

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

Використовуйте кешування сторінок як на стороні сервера, так і на стороні браузера. Кешування на стороні сервера дозволить сформувати часто запитувані сторінки в простому, вже створеному HTML-коді (текстовому файлі). При запиті цієї сторінки, веб-сервер не буде генерувати заново сторінку, а просто віддасть вам раніше підготовлений файл. Так, сервер не буде витрачати час на підготовку сторінки.

Висновки: як я вже сказав, швидкість завантаження сайту впливає на ранжування в пошукових системах і безпосередньо на конверсію сайту. На тему залежності конверсії від швидкості сайту є окрема презентація. а в цій статті ми розглянули лише основні способи оптимізації швидкості сайту. Таких методів може бути дуже багато - вони індивідуальні для кожного сайту. Користуйтеся підказками від Google PageSpeed ​​Insights і інших онлайн-сервісів, що показують послідовність завантаження елементів сайту.