Хоча, безперечно, існує кілька факторів, що впливають на дохід, більшість експертів стверджують, що завантаження бізнес-сайтів протягом 5 секунд заробляє майже вдвічі більше, ніж у 19, середній час завантаження сайту.
Дослідження також показало, що сайти завантаження протягом 5 секунд мають:
- Видимість оголошення на 25% вища,
- На 35% нижчий показник відмов;
- 70% довші сесії користувачів.
Саме тому ми повинні бути зосереджені на мобільних рішеннях, які допоможуть нашому бізнесу досягти успіху. Зрештою, мобільна швидкість ніколи не була більш важливою.
$config[code] not foundПовільна швидкість завантаження дійсно може бути проблемою
Відповідно до Google,
- 1 з 2 людей очікують, що сторінка завантажиться менше ніж за 2 секунди.
- 53% візитів, швидше за все, будуть залишені, якщо сторінка займає більше 3 секунд для завантаження на мобільний пристрій.
- 46% людей виявили невдоволення в очікуванні завантаження сторінок під час перегляду веб-сторінок на мобільному пристрої.
Три основні фактори, що сповільнюють сайти в мобільному інтернеті, - це кількість запитів сервера, розмір файлу та послідовний порядок елементів завантаження сторінок. Отже, зараз ми виділили причини; перейдемо до рішення.
Як збільшити швидкість мобільного сайту
Виміряйте і мінімізуйте час відгуку сервера
Швидкість вашої мобільної сторінки залежить не тільки від вашого коду, але й залежить від важливого технологічного інструменту, який називається сервером.
Чим довше ваш сервер чекає на відповідь на запит браузера, тим повільніше завантажується сторінка на пристрої. Більшість експертів Google рекомендують, щоб ваш сервер розпочав передачу 1вул байт ресурсів в межах двохсот мілісекунд запиту на більш оптимальний результат.
Як правило, існує 3 основних методу, які задіяні у підвищенні часу відповіді вашого сервера:
- Покращення конфігурації веб-сервера або програмного забезпечення.
- Підвищення масштабу та якості вашого хостингового сервісу, зокрема забезпечення достатньої кількості пам'яті та ресурсів процесора.
- Зменшення кількості ресурсів, необхідних для веб-сторінок.
Використовуйте CSS для завантаження зображень
Якщо ви хочете приховати зображення вмісту для мобільних користувачів, завантажуйте їх як фонові зображення через CSS і використовуйте медіазаписи, щоб приховати їх умовно.
Варіант цієї техніки використовується Amazon для умовного завантаження зображень, специфічних для пристрою.
Зменшіть кількість переадресацій, щоб збільшити швидкість мобільної сторінки
Переадресації - це не що інше, як інструкції, здатні автоматично приймати відвідувачів веб-сайту з однієї сторінки на іншу.
Кожне перенаправлення може з'їсти цінні мілісекунди, що призводить до уповільнення завантаження сторінки. Це особливо проблематично для мобільних пристроїв, оскільки вони часто залежать від ненадійних мереж, ніж користувачів настільних ПК.
Першим кроком до виправлення цієї проблеми є обстеження кількості переадресацій на вашому сайті за допомогою інструментів, таких як перенаправлення. Якщо номер занадто великий, мінімізуйте його, або в ідеалі, приведіть його до нуля для досягнення найкращих результатів.
Зменшити файли JS і CSS
Більше даних означає надлишкову вагу сторінки. Це дозволить завантажувати ваші сторінки на мобільному пристрої довше.
Ось чому більшість веб-розробників варті своєї чутливості знають необхідність оптимізації та мінімізації активів для збільшення швидкості завантаження сторінки.
"Minification" усуває надмірність, не впливаючи на відображення сторінки. Широкий спектр інструментів Google може допомогти вам усунути такі скорочення, включаючи такі:
- CSSNano (для CSS)
- UglifyJS (для JS)
Замість зображень використовуйте CSS3
Тіні, закруглені кути і градієнтні заливки - всі ці функції можна виконати за допомогою CSS, а не зображень.
Це може значно допомогти у зменшенні кількості запитів HTTP, тим самим прискорюючи час завантаження в один і той же час.
Використовуйте вбудовані SVG замість JPEG
Подібно URI даних, SVG (масштабована векторна графіка) може бути вбудована на сторінку для зменшення кількості запитів
Ці файли можна створювати у редакторі векторної графіки, наприклад Inkscape, Adobe Illustrator, і т. Д. Після створення можна відкрити його в текстовому редакторі і скинути до коду.
Примітка: Щоб вставити SVG у таблицю стилів, спочатку потрібно перетворити його в URI даних, а потім перейти до наступного кроку.
Так що більш-менш підводить підсумки. Сподіваюся, у вас було хороше і просвітницьке читання.
Фото через Shutterstock
1
