Дизайн лендинга: все что вы хотели знать, но ленились гуглить

Image for post
Image for post

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

Краткий ликбез: кому и для чего нужен лендинг

Лендинг (от англ. landing page — посадочная страница) — это одностраничный сайт, который призывает пользователя совершить конкретное действие: что-то купить, подписаться на рассылку или оформить услугу.

Digital-визитка для малого бизнеса

Если предмет бизнеса — это локальная услуга или конкретный товар.

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

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

Первый выход в свет для стартапа

Лендинг — это отличный инструмент для тестирования гипотез. Именно поэтому он так популярен среди стартаперов: простой одностраничник с ключевой информацией о продукте или услуге позволяет запустить продажи за минимальное время и с минимальными инвестициями. Вы быстро получите необходимый фидбек и ответ на главный для любого начинающего предпринимателя вопрос — есть ли потребность в его продукте или услуге среди выбранной ЦА.

Ситуативные рекламные кампании для крупного и среднего бизнеса

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

Основные принципы лендинга

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

«Мужчины и женщины в возрасте от 25 до 45 лет» — это слишком размытое и широкое определение, которое применимо почти к любому товару/услуге.

«Студент, который снимает блог про путешествия по России» и «Профессиональный фотограф, работающий в репортажном жанре» — уже более осмысленные портреты пользователей.

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

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

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

Призыв к действию (CTA, Call To Action) в рамках лендинга — это кнопка, которая отражает основное предложение: “Заказать”, “Подписаться”, “Оставить заявку”.

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

Для того, чтобы обеспечить максимально эффективное привлечение целевой аудитории на сайт, нужно определиться с точкой входа. Это может быть контекстная реклама, баннеры в социальных сетях или поисковая выдача. Важно помнить о том, что реклама не должна быть слишком навязчивой, преувеличенной, раздутой. Основная ее цель — заинтересовать пользователя, а не “впарить” продукт.

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

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

Текст должен быть сформирован в специальном формате убеждения. Убеждающие и призывающие формулировки, которые от экрана к экрану повторяются, как мантра, не превратят пользователя в клиента. Такой сайт все скорее всего будут обходить стороной. Продукт не должен быть навязан пользователю — пользователь сам должен захотеть приобрести продукт.

Правила эффективного лендинга

Первый экран — первое впечатление. То, как лендинг встречает пользователя, влияет на все последующие действия на странице. Основная цель — захватить внимание и начать с пользователем диалог.

Визуальные приемы для вовлечения могут быть абсолютно разными — не обязательно в рамках первого экрана использовать сложные 3D-анимации. Это эффектно, но не везде уместно.

Image for post
Image for post
Концепция посадочной страницы для акции “Делиться ГБ” от компании Tele2

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

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

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

Существует большое количество других подходов, и под каждый продукт подход подбирается индивидуально. Например, если ваш бизнес — это отель для животных, то нет необходимости заказывать разработку сложных 3D-объектов “комнат”, чтобы показать атмосферу отеля. Достаточно снять теплое непостановочное видео, которое будет доносить основную мысль — “У нас безопасно, комфортно и уютно”.

Image for post
Image for post
Презентация нового продукта компании Дом.ru — Wi-fi Mesh-система. Основной целью было рассказать про преимущества нового и необычного продукта.

Wi-fi Mesh-система — это система wi-fi роутеров, состоящая из основного маршрутизатора и адаптеров. Преимуществом является то, что адаптеры работают без проводов, что актуально при большой площади помещения. В данном примере мы погружаем пользователя через имитацию владения продуктом. Демонстрация основных преимуществ через визуальный ряд — стильный Wi-fi кубик, который работает без проводов и классно смотрится в интерьере.

Image for post
Image for post
Концепция посадочной страницы для акции “Кино под открытым небом” от компании Tele2. Погружение пользователя через создание атмосферы кинотеатра, используя визуальные образы, ассоциирующиеся с кино.

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

Image for post
Image for post
Лендинг для компании Дом.ru. Демонстрации возможностей продукта Movix Pro. Пример емких заголовков и создание атмосферы домашнего кинотеатра.
Image for post
Image for post
Промо-страница в формате интерактивной презентации. Пример проработанных заголовков на каждом экране. Последовательный рассказ о преимуществах продукта.

Метрики

Для того, чтобы оценить эффективность готового лендинга, нужно обеспечить сбор необходимых данных. В этом помогут системы анализа и статистики — Яндекс. Метрика и Гугл Аналитикс. Наиболее эффективными и простыми инструментами являются: Установка счетчиков, Карта кликов, Карта скролла и Вебвизор.

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

Возвращение пользователя

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

Чтобы разработать и запустить лендинг, который будет на 100% выполнять свою основную функцию — продавать, предлагать, продвигать, достаточно следовать основным принципам и помнить про то, что лендинг создается для конкретной группы людей. Чем точнее вы определите свою целевую аудиторию, тем проще вам будет предлагать свой продукт. Таким образом, вы сможете получить максимальный результат.

Источник

Подпишитесь на наш Telegram-канал: еще больше эксклюзивных кейсов по заработку и свежей информации из мира бизнеса/маркетинга!

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store