Как ускорить интернет-магазин в мобайле: статистика и рекомендации
Специалист по ускорению сайтов Николай Мациевский рассказывает, как и зачем оптимизировать сайт под мобайл.
Исследование Google
Google провела исследование скорости загрузки страниц на мобильных устройствах в различных секторах бизнеса. Оказалось, что среднее время полной загрузки мобильных страниц составляет 22 секунды. При этом 53% посетителей закрывают сайт, если он загружается дольше трёх секунд. Это серьёзная проблема.
Если что-то тормозит или требует дополнительных действий, потенциальный покупатель просто уходит. Поэтому разработчики сайтов стараются ускорять сайты. Посетители хотят быстро совершать транзакции на финансовых сайтах, быстро получать список свободных мест при покупке билетов, видеть текст статьи сразу после нажатия на ссылку.
Эффективная и выгодная реклама с сервисом от МегаФона
Широкий выбор рекламных каналов, более 100 параметров по интересам, подробная аналитика и другие возможности уже ждут в Личном кабинете. А еще кешбэк 100% за запуск рекламы в первый месяц и еще 10% — каждый месяц.
Несмотря на то, что сегодня больше половины трафика идёт через мобильные сети, конверсия у пользователей мобильных устройств ниже, чем у пользователей настольных компьютеров.
Если кратко, скорость сайта напрямую влияет на продажи.
В прошлом месяце, чтобы лучше понять действия партнеров Google, компания проанализировала около 900 000 мобильных рекламных страниц и лендингов из 136 стран. Исследование подтвердило предположения — большинство мобильных страницы слишком «тяжёлые», на них много лишних элементов, и они грузятся медленно.
Google изучил сайты из разных отраслей бизнеса: от туристических до финансовых услуг. Оказалось, что страницы автомобильной тематики в среднем грузятся дольше всех.
Более 70% страниц грузит видимый контент примерно за 7 секунд. А весь контент, и видимый и скрытый, на них загружается за 10 секунд.
Совсем недавно в Google применили новую нейронную сеть на большом массиве данных о времени загрузки страниц и поведении посетителей.
С 90% точностью сеть определила, что рост времени загрузки с одной до семи секунд повышает вероятность отказа посетителя на 113%. А рост числа элементов (текст, картинки, заголовки) с 400 до 6000 увеличивает показатель отказов на 95%.
Очевидно, что чем страница быстрее и легче — тем лучше для бизнеса.
Размер страницы тоже имеет значение. 70% страниц весят более 1 МБ, 36% — более 2 МБ, и 12% — более 4 МБ. Это ненормально для мобильных страниц. Страница размером 1,49 МБ грузится через сеть 3G около 7 секунд. А на одной из исследованных страниц было изображение с чудовищным размером 16 МБ.
Есть и хорошие новости. Например, сжатие страниц может серьёзно помочь. Около 30% страниц простым включением компрессии могут снизить свои размеры на 230 Кб. Наибольший потенциал для оптимизации имеют автомобильный, технологический, деловой и промышленный секторы.
Продавцы должны стараться удержать посетителей и для этого в первую очередь думать об адаптированности своих страниц для мобильных просмотров. Чтобы проверить адаптивность и скорость мобильных страниц, используйте сервис Test My Site от Google.
Проверили Cossa
Что сделать, чтобы ускориться
Покажите эти советы своему специалисту, который разбирается в оптимизации сайтов.
Уменьшите количество запросов к странице. Хорошо: менее 50.
Для уменьшения количества запросов подойдут техники объединения файлов одного типа в один или несколько (стили, скрипты). Изображения могут быть включены в файлы стилей с помощью data:URI, векторные изображения можно объединить в SVG спрайты. Использование протокола HTTP/2 частично решает проблему большого количества запросов, но на медленных соединениях это будет работать всё так же плохо.
Оптимизируйте вес страницы. Хорошо: менее 500 КБ.
Текстовые файлы можно уменьшить при помощи максимального gzip-сжатия, zopfli. Сжатие при помощи brotli или SDCH потребует дополнительного трудоёмкого внедрения, но сократит размер текстовых файлов ещё на 20–40%. К уменьшению в размере изображений нужно подойти со всей тщательностью: для мобильных пользователей можно показать изображения, соответствующие устройству (используя высокую плотность точек или уменьшенные изображения через Client Hints). Дополнительно нужно «перетрясти» все подключаемые ресурсы: вполне возможно, что часть из них можно безболезненно удалить с определённых страниц сайта.
Уменьшайте время загрузки страницы. Хорошо: меньше 3 секунд.
Сокращение числа объектов и уменьшение «веса» страницы — наиболее простые способы для уменьшения времени загрузки страницы. Но если все меры уже предприняты, то нужно проанализировать порядок загрузки и решить, какие вызовы могут быть отложены на событие полной загрузки. Например, бо́льшая часть рекламных пикселей и статистики не нужна пользователю в момент отображения страницы, эти объекты можно загружать позднее.
Уменьшайте «время до первого полученного байта» (time-to-first-byte). Хорошо: менее 1,3 секунды.
На время «до первого байта» влияет множество факторов: это и качество настройки вашего хостинга (включая TLS/SSL подключение), и скорость обработки сервером динамических запросов, и удалённость самого хостинга от пользователей. Обычно первую группу факторов можно улучшить за счёт перенастройки хостинга (разовых работ), вторая группа улучшается при оптимизации логики работы сайта, смене движка или пропорциональному расширению парка серверного оборудования. Третья группа — факторы удалённости — могут быть улучшены только при подключении CDN для сайта. Ограничение на скорость света при передачи информации ещё никто не отменял :—)
Вывод
Исследование Google подтвердило, что огромное количество сайтов работают медленно даже на десктопе, не говоря уже о мобайле. Интернет-магазины теряют клиентов, которые элементарно не дожидаются, когда сайт загрузится.
Быстрая работа сайта на мобайле станет важным конкурентным преимуществом бизнеса.
Читать по теме: 5 способов увеличить скорость загрузки сайта
Мнение редакции может не совпадать с мнением автора. Если у вас есть, что дополнить — будем рады вашим комментариям. Если вы хотите написать статью с вашей точкой зрения — прочитайте правила публикации на Cossa.