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

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

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

Що таке швидкість завантаження сайту та чому вона є важливою

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

Невблаганна статистика надає масу фактів для роздумів та аналізу:

  • до 79% покупців відмовляються від повторних замовлень на повільних веб-сайтах;

  • для 53% мобільних користувачів 3 секунди – межа очікування, після чого сесія переривається;

  • за умови затримки від 2 до 5 секунд показник відмов становить 90%, а у мобільної сторінки, швидкість якої падає з 1 до 10 секунд, цей показник зростає на 123%;

  • кожні 100 мс (одна десята секунди) затримки, за дослідженнями Google та Amazon, на 1% зменшують прибуток комерційних порталів;

  • завдяки Mobile First Index тривале завантаження мобільної версії сайту веде до втрати позицій у видачі для десктопної версії;

  • секундна затримка може зменшити конверсію на 17-20%;

  • алгоритм ранжування Speed Update від Google автоматично переміщує вниз сторінки з низькою швидкістю завантаження.

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

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

Перевірити швидкість завантаження вкладок можна за допомогою будь-якого з популярних спеціальних сервісів. Найчастіше достатньо вставити URL-сайту та оцінити результат.

Найкращі сервіси для перевірки швидкості

  • PageSpeed Insights. Мінімалістичний інструмент від Google для перевірки продуктивності сторінок дає загальну оцінку та рекомендації щодо покращення показника. Для мобільних сторінок краще використовувати Google Lighthouse, який працює навіть офлайн. Сервіс проведе порівняння з «ідеалом» за якістю верстки, використанням кешу, кількістю внутрішніх переходів тощо, вкаже швидкість, рівень оптимізації, доступність та дасть оцінку сайту.

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

  • GTmetrix. Багато в чому нагадує Pingdom Tools, але з більш зручними звітами. До того ж він продемонструє дані щодо розташування сервера, запитів, динаміки швидкості сайту (історія перевірок), тому буде зручно відслідковувати результативність дій з оптимізації.

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

Показники швидкості завантаження сторінки, які вважаються нормою

Нормальна швидкість – це той рівень швидкодії, який одночасно комфортний для відвідувачів ресурсу та прийнятний для пошукових систем.

Показник в 1-2 секунди – оптимальний варіант для будь-якого сайту, 7-8 секунд чи довше – критично поганий, потрібна негайна оптимізація. А ось у середині між зазначеними крайнощами ситуація дещо складніше. Якщо швидкість відображення контенту в 3-5 секунд для окремих проектів ще може вважатися прийнятною, то для великих комерційних ресурсів (наприклад, інтернет-магазинів або маркетплейсів із значною кількістю контенту) такий показник вже неприпустимий.

Вплив швидкості сайту на ранжування у пошукових системах

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

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

Вимоги Google до швидкості завантаження сайту

Класифікація Google виглядає досить просто.

Для комп'ютерних версій сайту:

  1. Хороша швидкість завантаження – до 1 сек.
  2. Середня – від 1 до 2,1 сек.
  3. Низька – довше 2,1 сек.

Для мобільних версій:

  1. Хороша швидкість завантаження – до 1,6 сек.
  2. Середня – від 1,6 до 3 сек.
  3. Низька – довше 3 сек.

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

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

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

Перевірка та зменшення часу відповіді сервера

На відміну від швидкості повного завантаження час відповіді сервера – це період від браузерного запиту до виведення на екран першого байта. В ідеалі він має становити до 100 мс, але прийнятним діапазоном вважається 100-200 мс.

Перевірити час відповіді можна через консоль DevTools, Google Analytics або інших інструментів (Netpeak Spider, Serpstat, GTmetrix). Слід спиратися на просте правило – хоч би яким був ваш результат, завжди потрібно прагнути його скорочувати. Зробити це можна за допомогою мереж доставки контенту CDN, що завантажують web-файли з найближчого сервера. Близькість локації дата-центру до ЦА забезпечить більш швидке завантаження.

Технічна оптимізація сайту

Одна з найпоширеніших причин проблеми повільних сайтів – недостатній рівень компетентності їхніх розробників, внаслідок чого не було враховано безліч помилок:

  • неправильне заповнення файлу robots.txt;

  • зайві редиректи;

  • некоректна HTML-мапа сайту;

  • наявність дзеркал (копій сайту з однаковим контентом);

  • биті посилання та дублі сторінок;

  • неправильно створена структура сайту;

  • неправильно побудована внутрішня перелінковка;

  • недотримання валідності верстки;

  • наявність вірусів та шкідливого коду;

  • наявність порожніх сторінок тощо.

Будь-яка з помилок у технічній оптимізації (або їх комплекс) буде негативно позначатися на pagespeed, заважатиме ефективному SEO та правильній індексації сайту, що веде до низького ранжування.

Оптимізація CSS та Javascript

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

  • виконати перевірку та чищення коду за допомогою відповідних сервісів (Minifier, Willpeavy, CSS Compressor);

  • використовувати правильну черговість завантаження ресурсів, здійснити правильне компонування CSS (на початку сторінки для поступового відображення);

  • мінімізувати кількість JavaScript коду для відображення першого екрана (перемістити його в кінець сторінки, щоб браузер завантажував скрипти після текстів та зображень);

  • підключити JavaScript та CSS за типами сторінок, щоб унеможливити витрати часу завантаження на файли, які не використовуються;

  • відмовитись від запитів @import url("style.css").

Робота з контентом на сайті

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

Стиснення зображень та відеофайлів

Не завжди доцільно використовувати фотографії з високою роздільною здатністю, особливо для мобільних версій. Заради економії місця їх слід стискати та конвертувати. Стандартні рекомендації такі:

  • до 7 Кбайт – для каталогів;

  • до 18 Кбайт – для товарних карток;

  • до 950 Кбайт – для збільшеного перегляду.

Має сенс використовувати GZIP компресію, завдяки чому без втрат у плані якості зображення можна вдвічі скоротити обсяг завантажуваного контенту, отже – збільшити швидкість завантаження.

Щоб «полегшити» зображення, можна зменшити їхні фізичні розміри, але є й інший спосіб – оптимізувати параметри збереження. Файли зображень зазвичай містять також надлишкові мета-дані, видалення яких не вплине на якість, але зменшить розмір картинки.

Значно уповільнює завантаження сторінок публікація відео файлів за допомогою протоколу FTP. Є просте вирішення проблеми – публікація відео на Youtube, наприклад, з подальшим вбудовуванням коду для розміщення на сторінці. Цей метод створює відразу дві переваги – економить місце на хостингу та скорочує період завантаження.

Оптимізація шрифтів

Веб-шрифти (попри їхню відносну незначність) можуть дуже негативно впливати на швидкість. Чинники впливу такі:

  1. Кількість шрифтів. Зайва різноманітність – однозначна надмірність. На швидких сайтах використовується максимум 1-3 шрифти з 3-4 накресленнями кожен.

  2. Вибір шрифтів. Некоректні набори шрифтів та завантаження варіантів, що не підтримують поточну мову сайту – поширена помилка розробників.

  3. Показ під час завантаження. Щоби відвідувачам не доводилося дивитися на порожній екран в очікуванні завантаження файлу шрифту, слід додати в стилі властивість "font-display: swap", завдяки чому текст буде до завантаження відображатися системним шрифтом.

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

Висновки та рекомендації

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

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

Замовити SEO-аудит сайту