Мобильный трафик превосходит десктопный с 2016 года. Google приступил к запуску mobile-first индекса.
Когда всё больше трафика поступает с мобильных устройств, а ведущие IT-компании уделяют всё больше внимания опыту мобильных пользователей, наличие эффективных мобильных целевых страниц становится важным, как никогда.
И это не значит, что достаточно лишь mobile-friendly страниц. Это значит, что нужно уделять время мобильному дизайну и созданию таких лендингов, которые будут привлекать пользователей.
В статье мы рассмотрим пять примеров лучших мобильных целевых страниц, которые могут послужить источником для вдохновения в мобильную эру.
-
Drift: выделяйте CTA (но не будьте навязчивыми)
Цель посадочной страницы проста: побудить пользователя конвертироваться и приобрести товар или услугу. Однако процесс подведения пользователя к конвертации и заполнению формы или регистрации может быть довольно непростым. Вы можете тратить дни и месяцы, создавая разные CTA и тестируя их.
Вам может казаться, что у вас самый лучший текст из тех, что когда-либо были написаны человеком – до тех пор, пока вы не проверите коэффициент конверсии и не увидите, что он поднялся всего лишь на 0,05%.
Мобильные пользователи легко отвлекаются.
Согласно данным Flurry Analytics, пользователи мобильных устройств активно пользуются своим смартфоном пять часов в день. Что же они делают?
- 8% времени приходится на интернет-браузеры;
- 92% времени тратится в мобильных приложениях.
Привлечение внимания пользователей и, что ещё более важно, удержание его – становится всё более сложной задачей.
Заполучить мобильных пользователей достаточно непросто, когда в этом пространстве доминируют приложения. А чтобы удержать их, нужны мощные CTA-элементы, способные быстро захватывать внимание. И в этом плане, возможно, нет никого лучше, чем Drift:
Мобильные целевые страницы Drift сразу привлекают пользователей простым дизайном, который ведёт их к конверсии: созданию бесплатного аккаунта.
За счёт использования стандартного чёрно-белого дизайна меняющая цвет CTA-кнопка выделяется, при этом не раздражая пользователей стрелками и всплывающими окнами.
Прокрутив страницу вниз, мы видим тот же дизайн:
В мире миллиардов приложений мобильные пользователи отвлекаются больше, чем когда-либо. Удержание их внимание и конвертация требуют выделения CTA-элементов, но с соблюдением баланса, без чрезмерности. И Drift это удаётся за счёт контраста между динамически меняющимися цветами и упрощённым дизайном.
-
Hulu: размещайте самый лучший контент на первом экране
Мы все уже слышали об этом раньше: на мобильных устройствах важно держать контент на первом экране. Хотя этот принцип давно широко распространён, давайте посмотрим, что говорят об этом данные? Действительно ли это так важно?
В 2014 году Google провёл исследование, согласно результатам которого контент на первом экране имеет показатель видимости на уровне 73%, а контент, расположенный ниже, мгновенно теряет 30% видимости.
Позже Nielsen проанализировал влияние расположения контента на видимость и конверсии и выяснил, что разница между тем, как пользователи обрабатывают информацию на первом экране и на втором, составляет 84%.
Размещение лучшего контента на первом экране – это ключевой фактор успеха. Но это не значит, что у вас не может быть более длинной целевой страницы.
Nielsen отмечает, что на первом экране должен располагаться самый важный для совершения покупки контент, побуждающий пользователя прокручивать страницу вниз. В противном случае, он просто уйдёт.
Hulu – это отличный пример того, какой контент должен быть размещён на первом экране:
На фоновом изображении их целевой страницы, предлагающей оформить подписку на пробный период, показаны самые популярные ТВ-шоу на текущий момент, что мгновенно побуждает пользователей регистрироваться, чтобы получить к ним доступ.
Предложение гласит: «Смотрите фильмы и сериалы в любое время, в любом месте», и пользователь не может устоять, чтобы не зарегистрироваться.
Использование градиентнойCTA-кнопки, которая выделяется на общем фоне – это лишь вишенка на торте. Прокручивая страницу вниз, пользователь можете узнать больше об условиях и сроках, но быстро становится понятно, что эта информация вторичная по отношению к тому предложению, которое содержится на первом экране:
Здесь мы уже не видим популярных сериалов и фильмов, а также CTA-элементов и ценных предложений.
Вся самая важная информация содержится на первом экране, а вторичная – ниже.
-
PayPal: пропускайте пустые разговоры и побуждайте людей регистрироваться
Одна из наибольших трудностей при создании мобильных страниц – это решить, как заставить пользователя конвертироваться.
Отвлекающих факторов очень много, не говоря уже о том, что форма подписки на мобильном устройстве вдвое меньше той, что на десктопе.
Мобильные пользователи не любят заполнять длинные формы или вводить информацию. Не давайте им ещё одну причину для ухода, предлагая выполнить эти действия.
PayPal знает об этом и пользуется этим, пропуская этап «светской беседы» и ценных предложений:
При переходе на целевую страницу PayPal пользователям сразу предлагается выбрать между двумя типами аккаунтов.
Компания не описывает свои преимущества и не делает «ценных предложений». Она сразу направляет пользователя к созданию учётной записи.
PayPal использует простой дизайн, где всё, что нужно от пользователя – это нажимать «Continue» и делать несложные выборы.
Чтобы поддержать желание пользователей к продолжению взаимодействия, в процессе компания заверяет их, что её сервис – «это безопасный и простой способ совершать оплату и получать платежи».
Если вы можете упростить процесс и заменить формы альтернативным креативом, вы можете ожидать улучшение показателей эффективности на мобильных устройствах, где распространённой ситуацией является сокращение количества подписок на 50% по сравнению с десктопной версией.
-
Buffer: интегрируйте видеоконтент
Видеоконтент – это больше не будущее веяние, он уже доминирует онлайн:
У одного лишь YouTube месячная аудитория превышает 1,8 млрд пользователей. И эти люди смотрят более часа видеоконтента каждый день. И это только на мобильных устройствах.
По прогнозам Cisco, к 2021 году глобальный IP-трафик на 82% будет основан на видео. Согласно тому же отчёту, в настоящее время на видео приходится 73% онлайн-трафика.
Однако интеграция видео в мобильную целевую страницу – это не самая лёгкая задача, особенно в то время, когда всего 1 секунда задержки в загрузке страницы повышает показатель отказов на 90%. Согласно Google, большинство посадочных страниц в каждой категории бизнеса загружаются намного дольше трёх секунд, признанных лучшей практикой.
Поэтому добавление видеоконтента на медленные страницы кажется неразумным решением. Но есть и другая сторона: таким образом вы сможете убрать множество другого контента и элементов, которые будет охватывать это видео.
Buffer – это один из лучших примеров использования этой тактики. Компания интегрирует видео, но это не оказывает негативного влияния на пользовательский опыт:
За счёт качественной интеграции пользователь может просматривать видео, не покидая страницу, и даже разворачивать ролик на весь экран.
В результате он может выполнять несколько задач одновременно: читать предложение компании и потреблять видеоконтент. А поскольку мобильные пользователи потребляют больше видеоконтента, чем когда-либо ранее, то это очень действенное решение.
Хотите повысить эффективность мобильной целевой страницы? Преобразуйте объёмный текстовый контент в краткое видео, которое можно просмотреть непосредственно на целевой странице.
-
Trello: статические/закреплённые CTA-элементы
Прокручивание длинной целевой страницы на мобильном устройстве – не самое приятное занятие. Когда вы находитесь на ходу или используете небольшой экран, прокрутка даже относительно небольшой страницы требует времени и сил.
И зачастую весь этот путь нужно пройти лишь для того, чтобы увидеть тот же призыв к действию, которые вы уже видели на первом экране.
Однако Trello использует тактику, которая отходит от этой нормы: закреплённые заголовки со статическими CTA:
Независимо от того, как далеко пользователь прокрутит страницу, наверху всегда будет заголовок Trello с логотипом и кнопка «Зарегистрироваться» («SignUp»), чтобы он мог конвертироваться тогда, когда почувствует себя готовым. Другими словами, пользователю не нужно прокручивать страницу вниз, чтобы заполнить форму. Он сможет сделать это на любом этапе.
Вам не обязательно привязываться к предварительному и окончательному призыву к действию. Пользователи могут конвертироваться в любой момент. И эта тактика работает.
Одно исследование показало, что плавающие заголовки помогают пользователям находить информацию на 22% быстрее. Более того, 100% опрошенных респондентов предпочитали этот формат.
Правда в том, что ограничивая возможность конверсии только верхней и нижней частью страницы, вы не максимизируете свой потенциал.
Дать возможность пользователям конвертироваться, когда они захотят, можно с помощью статичного или плавающего заголовка и упрощённого призыва к действию.
Заключение
Доля мобильного трафика неуклонно растёт, поэтому необходимо вкладывать больше времени и сил в создание мобильных целевых страниц.
Следуйте примеру успешных компаний:
- Выделяйте CTA-элементы, но не будьте навязчивыми;
- Держите самый лучший контент на первом экране, чтобы побудить пользователей прокручивать страницу дальше;
- Откажитесь от традиционных прелюдий и, как PayPal, переходите сразу к делу;
- Интегрируйте видеоконтент, чтобы сократить длину целевой страницы и использовать самый популярный формат для мобильных пользователей;
- Используйте закреплённые заголовки, чтобы пользователи могли конвертироваться в любой момент.
