Есть мобильная версия? А если найду?

В этом году отечественную онлайн-торговлю можно поздравить с совершеннолетием. В августе первому российскому интернет-магазину исполнится 18 лет.  Однако до настоящей зрелости ещё далеко.

80% интернет-магазинов из ТОП100 убыточны. Как сделать их прибыльными? Можно сделать ставку на юзабилити — об этом мы писали в прошлый раз. Из альтернатив — обдуманная разработка мобильной версии сайта.

Сегодня более 40% российских интернет-пользователей заходят в Сеть при помощи мобильных устройств. Из них почти 80% выбирают товары и услуги со смартфонов и планшетов. Это относительно много. Однако только у 1% российских онлайн-магазинов есть мобильные версии. Это непропорционально мало.

Кому это надо?

Обычный сайт может выглядеть на мобильном устройстве неразборчиво. Чтобы нажимать на маленькие кнопки приходится проявлять чудеса ловкости и смекалки.

Дезадаптивный дизайн

Переместитесь на смартфоне по рядовому интернет-магазину, и вы поймёте, как неудобно покупать. Отказ от мобильной версии — это отказ от гарантированного трафика в пользу конкурента.

Однако это ещё не довод в пользу мобильной адаптации — необходимо свериться с Google Analytics или Яндекс.Метрикой. Если доля мобильных пользователей в магазине игрушек составляет 5-6%, то версия для мобильных устройств, скорее всего, не нужна. А если ситуация выглядит следующим образом?

Носитель

Визиты, %

Отказы, %

Конверсия, %

Заказы, %

Стационарные ПК

75

18

1

96,9

Мобильные устройства

25

28

 0,64

3,1

То есть:

  • со стационарных ПК заходят 75% посетителей и оставляют почти 97% заказов;
  • с мобильных устройств заходит 25% посетителей и оставляют всего около 3% заказов.

Скорее всего, владельцу такого магазина стоит задуматься о переменах.

Потенциальные клиенты

Где люди пользуются мобильными устройствами. Например:

  • 84% - дома;
  • 80% - в свободное время;
  • 76% - в очередях и в процессе ожидания;
  • 69% - во время покупок;
  • 64% - на работе;
  • 62% - во время просмотра телепрограмм;
  • 47% - во время подготовки к работе.

Очень вероятно, что среди них есть потенциальные заказчики.

Причём, нередко интернет-соединение в перечисленных местах нестабильное, а его качество оставляет желать лучшего. Поэтому мобильная, лёгкая версия просто необходима.

Это очень просто?

Кажется, что адаптировать интернет-магазин довольно легко. Это не так. На самом деле, возможно, придётся: 

  • переделать модульную сетку; 
  • изменить меню и навигационную цепочку, расположение рекламных блоков, текстовую область; 
  • применить режим ленивой загрузки (англ. lazy loading) или использовать технику «Агрессивного улучшения» (подход content first + MatchMedia);
  • уменьшить размер фотографий (формат WebP, учесть ограничения HiDPI-изображений); 
  • поработать над шрифтами (уменьшить их или перевести в иконочный формат);
  • оптимизировать представление каталога, форму заказа и т.д.
  • учесть самые распространённые разрешения мобильных экранов: 320х480, 320х568 и 240х320, используя RESS (Responsive Web design + Server Side components) в комбинации с подходом Cut the Mustard!
  • использовать другие технологии в духе прогрессивного улучшения и принципа «Mobile First».

Самые популярные разрешения

Возможны варианты

Если владелец интернет-магазина решил адаптировать сайт под мобильные устройства, то у него есть на выбор несколько решений.

Решение

Плюсы

Минусы

Мобильная версия сайта в чистом виде

Просто, быстро, дёшево.

Малоэффективно

Мобильное приложение (с iTunes, AppStore и т.п.)

·         Полный функционал.

·         Работа в оффлайн.

 

·         Кроссплатформенные проблемы.

·         Требует постоянной техподдержки и вложений.

·         Мало грамотных специалистов.

Поверхностная адаптация

Меняется вёрстка страниц.

Нет адаптированных изображений.

Адаптивный дизайн

·         Сохраняется весь функционал и контент.

·         Оптимизирует сайт сразу под разные типы устройств.

 

·         Лучше, когда сайт разрабатывается с нуля.

·         Дорого.

·         Может замедлять работу сайта.

Можно сразу адаптировать под мобильное устройство весь сайт. А можно – только важные разделы. Это очень удобно, когда владелец сайта не готов к радикальному решению, но требует известных усилий. Например, в интернет-магазине чаще всего клиент «соскакивает» в разделе каталога, на карточке товара или в корзине. Эти страницы стоит адаптировать в первую очередь.

Впрочем, на рынке уже присутствуют шаблоны под некоторые решения. Например, «Битрикс» разработал платный продукт «Мобильной приложение», который позволяет избежать многих проблем. Аналогичные решения разработали и другие компании. Это общая тенденция.

Прогнозы

Согласно прогнозам Cisco, в 2017 году, по сравнению с 2012 г., объём мобильного трафика вырастет в 13 раз. Аналогичный бум ожидает и Россию.

Какое из решений подойдёт конкретному интернет-магазину, зависит от многих факторов. Однако то, что владельцам интернет-магазинов придётся всерьёз задуматься об адаптации к мобильным устройствам — это точно.

Похожие статьи: