7 способів збільшити швидкість завантаження сайту у 2017 році
Часи, коли неквапливий та спокійний темп життя повністю влаштовував людей, давно позаду. У наші дні така риса характеру як терплячість означає дедалі менше. Наприклад, США середньостатистичний клієнт готовий простояти у черзі трохи більше 15 хвилин. Цей період скорочується до 6-10 секунд, коли він шукає товари та послуги онлайн. Якщо ви не зможете привернути увагу клієнтів за цей період, ваш онлайн-бізнес навряд чи буде успішним.
Чому швидкість – це справді важливо?
Швидкість завантаження сайту стає ще важливішою, коли йдеться про пошукові системи. Навіть сама копітка робота над SEO і AdWords марна, якщо ваш сайт повільно завантажується. Таким чином, ви програєте битву ще до її початку – на стадії ранжування. Швидкість сайту - один із обов'язкових факторів в алгоритмі ранжирування Google. Фахівці Google твердо впевнені, що "…чим швидше сайти, тим щасливіші користувачі".
Команда MotoCMS завжди стежила за ефективністю свого сайту. Ми вже працюємо над його оптимізацією і готові поділитися досвідом з вами.
Протестуйте швидкість сторінок
Який показник швидкості є достатнім? На це запитання немає відповіді. Наскільки швидкими не здавалися б сторінки вашого сайту, пам'ятайте — немає межі досконалості! Тому, перш ніж почати працювати над прискоренням завантаження сторінок, потрібно визначити, що спричинило уповільнення їх роботи.
PageSpeed Insights — інструмент, який допоможе вам упоратися з цією проблемою. Він не тільки оцінює продуктивність сторінки для комп'ютерів та мобільних пристроїв, але також пропонує способи її вдосконалення. Кожна пропозиція щодо оптимізації має свій пріоритет, що визначає її важливість. Дотримуючись зазначених порад, визможете покращити продуктивність сторінки.
Команда MotoCMS вже досліджувала та проаналізувала уповільнюючі фактори за допомогою PageSpeed Insights та знайшла кілька способів прискорити сторінки свого сайту.
Скористайтеся “лінивим завантаженням”
"Лінива завантаження" (або динамічна завантаження сторінки) - концепція, згідно з якою ми не дозволяємо завантажуватися об'єкту до того моменту, поки він нам не знадобиться. Так ви можете визначити, які компоненти не варто завантажувати за замовчуванням під час завантаження сторінки. Даний підхід - справжня знахідка для сайтів з довгими сторінками та безліччю зображень.
На сайті MotoCMS метод "лінивого завантаження" застосований на сторінках магазину шаблонів.
При “лінивому завантаженні” зображення не завантажуються, доки користувач не дійде до них. Контент, що відображається, оновлюється, як тільки користувачеві це необхідно. Переваги очевидні. “Лінива завантаження” істотно зменшує час завантаження сторінки, допомагає економити ресурси та покращує враження користувачів про ваш сайт.
Оптимізуйте зображення
У наш час зображення практично всюди. Це не дивно, адже 65% дорослих людей є візуалами — людьми, які краще сприймають інформацію за допомогою зору. Тому 90% сайтів містять широкий спектр графічних елементів. Однак зображення можуть значно зменшувати швидкість завантаження вашого сайту. Зрозуміло, ви не можете їх просто прибрати. Але ви можете оптимізувати їх, збільшивши таким чином швидкість завантаження сторінки на 80%. Все просто – перш ніж завантажувати зображення, зверніть увагу на їх розмір та формат.
Розмір зображення
Обріжте зображення до потрібного розміру та заберіть білий простір навколо них. Ніколине завантажуйте зображення з шириною 1000px, якщо ширина вашої сторінки становить 570px (атрибут width дорівнює ”570”). Змініть розмір кожного зображення відповідно до ширини вашої сторінки.
Формат зображення
Виберіть найкращий формат файлу зображення. Використовуйте зображення JPEG для всіх фотографій. Зображення формату PNG завжди перевершують GIF, коли справа стосується графіки. Зображення формату GIF краще використовувати для дуже маленьких або простих елементів графіки, а також зображень, що містять анімацію. Відмовтеся від використання зображень формату TIFF та BMP. Також можна використовувати відповідний плагін, запропонований вашою CMS для оптимізації вже завантажених зображень.
Зменште кількість інформації, необхідної для рендерингу вашої сторінки. Знищення непотрібних байтів (додаткових порожніх ділянок, розривів рядків та відступів) дозволяє зберегти безліч байтів інформації. Невеликий розмір файлів сприяє зменшенню затримки мережі, яка відбувається щоразу при завантаженні вашої сторінки. Чим менше файли, тим швидше вони завантажуються та виконуються браузерами.
Використовуйте кешування у браузері
Кеш браузера зберігає файли ресурсів веб-сторінок на комп'ютері користувача, коли він переглядає ваш сайт. Таким чином, при наступному відвідуванні користувачем вашого сайту браузер може завантажити сторінку без надсилання зайвих HTTP запитів на сервер, адже він вже запам'ятав цю інформацію.
Щоб увімкнути кешування, ви повинні відредагувати заголовки HTTP, встановивши час закінчення для конкретних типів файлів. Після цього файли будуть знову завантажені з сервера. HTTP-заголовки повідомляють браузеру, яким способом він повинен отримати той чи інший файл.надіславши запит на сервер або отримавши дані з кешу браузера.
Можливо, ваша CMS пропонує розширення або плагіни для кешування. Якщо ж розробниками CMS подібних інструментів не передбачено, ви повинні встановити параметри кешування у файлі .htaccess у кореневому каталогу домену, щоб повідомити браузеру, які саме файли варто кешувати. Ви можете встановити різний час закінчення різних файлів. Якщо деякі типи файлів оновлюються частіше, встановіть для них менший час закінчення. Потім збережіть зміни у файлі (уникайте поширеної помилки та не зберігайте цей файл із форматом .txt).
Кешування особливо ефективне для сайтів, де користувачі регулярно відвідують певні сторінки. Це зменшує навантаження на ваш сервер і, відповідно, дозволяє зменшити час завантаження сайту.
Увімкніть стиснення gzip
Великі веб-сторінки часто важать понад 100Кб. Тому вони громіздкі і повільно завантажуються. Коли користувач завантажує веб-сторінку, сервер отримує команду для надсилання запитаних файлів. Чим більше ці файли, тим більше часу займе їх завантаження браузером користувача та відображення на екрані. Вирішити цю проблему допомагає стиснути gzip.
Gzip – це проста техніка, згідно з якою перед завантаженням ваші файли розміщуються у zip-архівах. Після завантаження архівів браузер витягує з них файли та відображає контент.
Більшість веб-серверів можуть стискати файли у форматі gzip за допомогою інших модулів або вбудованих функцій. Якщо вам потрібно налаштувати сервер для стиснення gzip, використовуйте модуль mod deflate для Apache, HttpGzipModule для Nginx і дотримуйтесь цих інструкцій для IIS.
Ваша вигода очевидна. Стиснення gzip зменшує обсяг веб-сторінок до 70%, що неодміннодозволяє збільшити їхню швидкість.
Приєднайтесь до проекту AMP
Команда MotoCMS вже впоралася із цим завданням. Ми приєдналися до проекту AMP компанії Google. Прискорені мобільні сторінки (Accelerated Mobile Pages) були розроблені як відкритий стандарт для будь-якого розробника, який хоче збільшити швидкість завантаження сайту на мобільних пристроях. Опитування, проведене фахівцями Google, довело, що сторінки, створені з урахуванням стандартів AMP, завантажуються на 15-85% швидше, ніж звичайні сторінки.
Це лише деякі ефективні способи збільшення швидкості завантаження сторінок. Але вони можуть стати гарним початком для оптимізації вашого сайту під потреби користувачів, підвищення позицій у пошуковій видачі та збільшення вашого прибутку у 2017 році.