Продающий адаптивный лендинг, каким он должен быть | Альянс Свободных Предпринимателей | Блог
Личный кабинет
Альянс свободных предпринимателей
Альянс свободных предпринимателей

Продающий адаптивный
лендинг, каким он должен быть
Часть 2

Читать первую часть…

Часть 2

2. Быстрая прокрутка (Click-to-Scroll)

Глядя на предыдущее изображение от Sling Automotive вы могли заметить 4 различных числа, расположенных в зеленых кругах. Эти числа демонстрируют эффективность применения 4 разных фишек адаптивного лендинга, каждую из которых следует разобрать в отдельности. Поэтому мы хотели бы подробно рассмотреть представленный кейс и рассказать вам, что к чему.

Итак, с какой целью люди приходят на подобные автомобильные лендинги?

• Они хотят побольше узнать об интересующем их автомобиле
• Их интересует цена или наличие
• Хотят записаться на тест – драйв автомобиля
• Приходят с намерением купить автомобиль

На представленном мобильном лендинге даны ответы на все эти вопросы! И не одного миллиметра пространства не потрачено на лишнюю информацию. Нет долгой прокрутки и дополнительных изображений.

String Automotive прекрасно понимают, что если пользователи достали свой смартфон из кармана и зашли на сайт автодиллера, они сделали это не для того чтобы длительное время искать информацию. Они хотят быстро получить главную информацию, сразу же после перехода на сайт.

Именно для этого и существует быстрая прокрутка.

Две такие кнопки могли бы переносить вас на отдельные страницы. Но в данном случае намного лучше размещать всю важную информацию на одном лендинге.

Это эффективно и с практический точки зрения, и с точки зрения поисковой оптимизации. Если у вас 30 автомобилей, для каждого из которых надо создать отдельный адаптивный лендинг, то создание дополнительных 60 страниц (по две дополнительные для каждого автомобиля) – мягко говоря неудачное решение.

В то же время мы знаем, что мобильные пользователи всегда ленятся прокручивать страницы и просто хотят СРАЗУ получить все, что им нужно. Поэтому вместо того, чтобы заставлять их прокручивать длинный лендинг (это равносильно заставлять их уйти с сайта) добавьте Click-to-Scroll кнопки, как на изображении выше и сделайте так, чтобы при нажатии на данные кнопки страница быстро прокручивалась сразу до релевантной информации.

В случае с Sling Automotive применение двух таких кнопок позволило снизить частоту ухода посетителей с сайта на 37%

3. Статичные шапка и подвал сайта

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

Как оказалось, статичные (то есть всегда закрепленные на экране) шапка сайта и его подвал (футер) идеально подходят этой цели.

Недавнее исследование от Smashing Magazine показало, что статичное меню помогает найти информацию на 22% быстрее, а это значительная разница, учитывая как важна для мобильных пользователей скорость получения информации. Более того, то же исследование показало, что все 100% опрошенных предпочитают сайты именно со статичным меню. Правда на вопрос “Почему именно?” никто ответить не смог.

Что еще интереснее, CRO – специалисты Джоэл Харви и Брайн Мэсси проведя множесто исследований для своих клиентов пришли к выводу, что статичные шапка и футер значительно увеличивают конверсию. Почти все, кто приходил на ресурсы, оснащенные статичной шапкой/футером, были довольны результатом своего посещении. Конечно бывают очень редкие исключения, но все же, быстрый звонок, быстрая прокрутка и статичное меню обязательны к применению (ну или по крайней мере тестированию) всем без исключения компаниям.

4. Всплывающие окна

Если подумать о всплывающих окнах, на ум сразу приходят страницы для захвата email-адреса пользователя. Это постоянная практика как для обычных, так и для мобильных версий сайта.

Но всплывающие окна могут быть использованы и иначе. По словам Джоэль Харви, если в такое окно поместить Click-to-Call кнопку, уровень конверсии может значительно увеличиться.

Но давайте не будем забывать и об окнах захвата лидов. Пусть мобильные сайты плохо подходят для прямых продаж (особенно если бизнес не заточен под продажи по телефону), они все же отлично годятся для сбора email-адресов пользователей.

Сайт The Next Web увеличил конверсию на 42% добавив в нижней части экрана простенькое всплывающее окно с предложением о рассылке новостей и просьбой ввести email–адрес.

А в еще одном кейсе от Талии Вульф и Banana Splash были приведены результаты работы сайта GoEco команде которого удалось увеличить количество регистраций на 150%, применив мобильные оверлэи (mobile overlays).

Обязательным условием высокой конверсии всплывающих окон является хороший цепляющий заголовок.

Получите план по созданию онлайн-бизнеса с доходностью 200-500 тысяч рублей за 120 дней. Записывайтесь на открытый онлайн-мастер-класс!

На самом деле, мобильные устройства не идеальны во всем, что касается маркетинга, и они могут запросто стать вашим противником в борьбе за внимание аудитории, независимо от того, в какой нише вы работаете. Esigns доказали эту мысль, получив 16 тыс. новых email – адресов в год с того момента, как начали просить своих пользователей заходить на сайт с ПК, а не со смартфона.

Запомните, главное в мобильной оптимизации, это понять, зачем мобильные пользователи пришли на ваш сайт, и обеспечить возможность максимально быстрого получения интересующей их информации.

Мобильные всплывающие уведомления позволяют вам предоставить пользователю возможность сделать следующий шаг к покупке именно в тех местах, где это интуитивно понятно и необходимо.

Как правильно применить все эти фишки на вашем лендинге

Итак, мы поняли, что у мобильных пользователей и пользователей ПК разные потребности. Очевидно, что нет никакого смысла добавлять всплывающее окно с размещенной в нем Click-to-Call кнопкой на обычном десктопной посадочной странице, но при этом такое решение отлично работает на адаптивном лендинге.

Кроме этого, сама информация о продукте на обычном и мобильном лендингах должна отличаться. А кнопки призыва к действию (CTA), эффективные для мобильных устройств, могут давать низкий уровень конверсии на компьютере.

Иными словами это значит, что если вы хотите, чтобы ваша компания вышла на высокий уровень, вы должны:

  • предоставлять один контент для мобильных юзеров и немного другой контент для пользователей ПК;
  •  инвестировать силы, средства и время в адаптивный дизайн;
  • выделять для мобильных сайтов специальный домен формата m.domain.com;
  • или создать специальное мобильное приложение и привлекать вашу аудиторию к использованию данного приложения.

И только после того, как вы решите вышеупомянутые задачи, можно будет внедрять фишки вроде быстрых звонков и статичного меню.

В эру быстрых, дешевых лендингов все вышеперечисленное кажется просто грудой тяжелой работы. К счастью, в настоящий момент есть множество компаний, предлагающих доступные конструкторы лендингов, которые включает в себя все, о чем мы сегодня говорили.

Подведем итог

Инструменты и способы оптимизации мобильной конверсии существенно отличаются от инструментов и способов оптимизации конверсии для ПК. Мобильные юзеры хотят как можно быстрее получать интересующую их информацию, и чем лучше вы оптимизируете и ускорите этот процесс, тем выше будет ваш уровень мобильной конверсии.

И еще раз, существует 4 фишки, которые согласно многочисленным исследованиям и тестам почти всегда эффективно работают. Это:

  1.  Быстрый звонок (Click-to-Call)
  2. Быстрая прокрутка (Click-to-Scroll)
  3. Статичные шапка и подвал сайта
  4. Мобильные всплывающие окна

Попробуйте использовать все 4 способа, но обязательно протестируйте их. И не надейтесь на чудо. Направьте ваши усилия на улучшения пользовательского опыта и удовлетворения потребностей и ожиданий ваших посетителей. Конечно, результаты в каждом случае могут отличаться, но эти 4 фишки – отличная отправная точка, особенно если вы все еще находитесь на этапе перехода к адаптивному дизайну.

Читать первую часть статьи

Данный материал является переводом статьи Джейкоба МакМилена

Похожие материалы