IT-Agency создаёт лендинги с 2009 года. Мы экспериментировали с содержанием и внешним видом промостраниц, наблюдали за изменениями конверсии. В этой статье мы делимся своими представлениями о первом экране лендингов.
Лендинг — веб-страница, которая должна убедить посетителя совершить определенное действие: купить товар или услугу, оставить эл. почту, зарегистрироваться на мероприятие и т. д.
Чаще всего посетители попадают на лендинги из соцсетей, рассылок по эл. почте или рекламы в поисковых системах.
Обычно лендинг рассказывает только об одном товаре или услуге (пакете услуг), отвечает на вопросы и возможные возражения посетителя, постепенно подводя к целевому действию.
Цели первого экрана
При поиске вариантов решения своей задачи человек бегло просматривает десятки сайтов и лендингов. На очередном лендинге он по первому экрану определяет, стоит ли читать дальше. Вот какие вопросы возникают у посетителя лендинга в первую очередь:
-
Куда я попал? Что это за сайт?
-
Что полезного и интересного для меня есть на этом сайте?
-
Что можно сделать / купить на этом сайте?
Основные элементы первого экрана
Давайте посмотрим, какие элементы лендинга отвечают на эти вопросы:
-
Название компании и логотип: представиться посетителю. Подписью можно обозначить суть деятельности компании / сервиса.
-
Меню навигации: сообщить, какую информацию посетитель здесь найдёт. Меню навигации пригодится, если лендинг длиннее трёх экранов.
-
Главный заголовок (и подзаголовок): привлечь внимание и сообщить суть предложения. Важно показать посетителю, что тут он может решить свою задачу.
-
Изображение: привлечь внимание и более полно представить продукт.
-
Набор продающих моментов (УТП — уникальное торговое предложение): показать ценность предложения и объяснить, чем данное предложение выгоднее конкурентных.
-
Целевое действие: показать посетителю, как он может решить свою задачу. Это может быть кнопка (например, «Оформить заказ») или номер телефона.
-
Телефон, онлайн-чат: показать посетителю, что ему помогут и ответят на все вопросы.
Оформление первого экрана
Не стоит перегружать первый экран акцентами и графическими элементами. Частая причина падения конверсии — посетитель не стал разбираться в слишком сложной странице. Использование минимума выразительных средств и стилей текста, аккуратная вёрстка и понятная визуальная иерархия помогут этого избежать.
Рассмотрим несколько примеров, как первый экран отвечает на вопросы посетителя.
Прототип и оформленная версия первого экрана лендинга «Автоломбард»
