Как оптимизировать мобильный лендинг для эффективной конвертации

Вы когда-нибудь заходили на неоптимизированную под мобильные гаджеты посадочную страницу со своего смартфона?

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

Теперь взгляните на ваш лендинг. Представьте, что кто-то зашёл на него со смартфона. Весьма маловероятно, что пользователь долго задержится на неоптимизированном сайте, вероятность совершения покупки в такой ситуации практически исключена. Поэтому чрезвычайно важно оптимизировать целевые страницы под мобильные устройства.

Причины для оптимизации целевой страницы

Сразу стоит отметить, что в среднем на заказы с мобильных устройств приходится около 15% всех покупок россиян в интернете. При этом за 2015 год их доля выросла более чем в полтора раза.

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

  • 70% мобильных поисков приводят к совершению какого-либо действия на веб-сайте уже в течение часа
  • 40% пользователей продолжит изучать результаты поиска, если первые открытые ими сайты не оптимизированы под mobile.

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

Советы для создания эффективного мобильного лендинга

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

Но как именно оптимизировать мобильную целевую страницу для улучшения показателей конверсии?

 

Начните с основ, которые являются базовыми требованиями к любому оптимизированному интернет-ресурсу.

Взгляните на приведенные ниже советы:

1. Оптимизируйте скорость загрузки страницы

Медленная загрузка страницы способствует потере посетителей.

Вы же хотите захватить внимание клиентов с первой секунды знакомства с вашим предложением?

Для этого вам нужно сократить время, необходимое для загрузки вашего мобильного лендинга.

Даже полусекундная задержка оказывает серьезное негативное влияние на мобильную конверсию. Это четко доказано в исследовании SOASTA. Специалистам компании удалось выяснить, что страницы со средней скоростью загрузки 2,4 секунды имеют коэффициент конверсии 1,9%. Это солидный показатель, учитывая тот факт, что соответствующий результат для ПК в среднем равняется 2-3%. Страницы, которые загружаются на одну секунду медленнее демонстрируют снижение конверсии на 27%.

Есть несколько способов увеличить скорость загрузки вашего мобильного лендинга. Но начать стоит с оптимизации изображений, а именно, масштабирования их до правильного размера. Кроме того, вы можете уменьшить HTML и CSS файлы, применив сжатие, что поможет уменьшить их размер на 50-70%.

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

Оптимальный размер вашей мобильной целевой страницы не должен превышать 20 килобайт.

2. Минимизируйте отвлекающие элементы

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

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

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

3. Напишите сильный и короткий заголовок

Вы конечно же знаете, что заголовок на целевой странице должен быть коротким. Мобильная целевая страница предполагает ещё более жесткое ограничение количества символов. Постарайтесь использовать не больше пяти слов. Если у вас уже есть проект, оцените его критически. Уберите все ненужные слова, например, описание продукта; вы можете раскрыть его ниже, не перегружая заголовок.

Все, что должен сделать заголовок мобильного лендинга — это дать посетителю представление о том, для чего предназначен ваш продукт.

Мобильная целевая страница компании Motorola Moto 360 — достаточно хороший пример. Заголовок здесь содержит не более пяти слов и раскрывает только самые важные детали. Здесь указаны название продукта и цена. Кнопка CTA привлекает внимание пользователя и даёт чуть больше информации о продукте.

1.png

Убедительные короткие заголовки в паре с простой кнопкой СТА способны творить чудеса.

4. Сделайте свой номер телефона кликабельным

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

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

Попробуйте спроектировать ваш номер в виде кнопки, дополненной интерактивными элементами.

5. Оптимизируйте призыв к действию (CTA)

Пусть CTA будет коротким, ясным и убедительным. В идеале, он должен привлекать посетителя с первых секунд нахождения на сайте наравне с заголовком. Значение «видимости» этого элемента сложно переоценить, однако чрезвычайно важно грамотно подойти и к написанию текста. Он должен чётко говорить, какое именно действие необходимо совершить пользователю. Если единственной целью вашей мобильной посадочной страницы является конвертация, сосредоточьте своё внимание на убедительном и четком тексте.

Посмотрите на этот пример мобильного лендинга.

2.jpg

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

6. Тестируйте свои мобильные лендинги


Как узнать работают ли изменения на ваших целевых страницах, и какие из них вы действительно должны сохранить?

Запустите серию тестов, это — неотъемлемая часть создания успешной посадочной страницы как для мобильных, так и для стандартных веб-сайтов.

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

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

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

А теперь рассмотрим пример, когда тестирование оптимизации мобильного опыта для ecommerce помогло увеличить доходы от мобильных покупателей.

Ниже расположена оригинальная мобильная страница. Она явно не адаптируется к размеру экрана соответствующего устройства, СТА почти незаметен, текст трудно читать.

3.jpg

А вот вариант с увеличенным СТА.

4.jpg

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

Экспериментируйте с размещением кнопки CTA, шрифтами, цветом и общим дизайном вашей целевой страницы. Это наиболее эффективный способ успешной оптимизации и, соответственно, увеличения количества конвертаций.

Вывод


Является ли ваш мобильный лендинг максимально успешным, способен ли он конвертировать посетителей?

 

Если нет, то обратите внимание на приведенные выше советы и наблюдайте как количество преобразований увеличивается.

У вас есть что добавить к нашему списку? Не стесняйтесь делиться своим опытом, оставляйте комментарии.

Успехов!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *