Содержание:

1.Немного теории
2.Практикум: создаем лендинг своими руками
3.Создание каркаса: формулы AIDA и PMPHS
4.Онлайн-конструкторы для создания лендингов

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

Немного теории

Что такое лендинг?

Это онлайн-страница, которая продает один товар или услугу. Обязательный элемент сайта-визитки — призыв к действию: записаться на вебинар, купить билет на концерт, подписаться на рассылку или скачать видео. Лендинг не ссылается на другие страницы. Его задача — не отвлекать клиента, а подвести к цели.

Источник — by Stian

Зачем нужен лендинг?

  • Привлечь целевую аудиторию. Не просто путешественники, а любители экстрима, не просто приверженцы ЗОЖ, а веганы — одностраничник направлен на привлечение узко сегментированной ЦА.  
  • Сформировать воронку продаж. Главная и конечная цель — повысить коэффициент конверсии.

Кому подойдет лендинг?

  • У вас есть онлайн-платформа, но нужна рекламная кампания под конкретный продукт. К примеру, вы организуете путешествия и хотите продать горящий новогодний тур в Лапландию.
  • Вы открываете бизнес. На этом этапе одностраничник работает тестовым инструментом, чтобы проанализировать реакцию целевой аудитории на новый продукт.
  • Ваш сайт устарел. Сайт-визитка — это простой способ заявить о себе и выглядеть современно.
GOTOEGYPT - Travel Landing Page
Источник — by Achraf Elkaami

Чем лендинг отличается от сайта?

  • Одна цель — одно действие. Если на сайт люди заходят с разными целями (посмотреть каталог, сделать заказ или почитать статьи в блоге), то на лендинге им предлагают сделать что-то одно.
  • Кнопка СТА (call to action). Без призыва к действию лендинга быть не может. На обычном онлайн-ресурсе такая кнопка не обязательна.
  • Результативность. Если средний коэффициент конверсии для сайта составляет 1-3%, то для лендинга эти цифры вырастают до 5-15%, а иногда — до 30%.

Какие бывают лендинги?

  • Транзакционные. Продают товары или услуги: билеты на обучающий курс, партию эксклюзивных часов или консультацию коуча.
  • Посадочные. Собирают лиды — потенциальных клиентов, готовых совершить конкретное действие. Анализируйте их данные и подогревайте аудиторию: настраивайте под нее рекламу в соцсетях, отправляйте письма и предлагайте бонусы. Так вы подготовите людей к совершению покупки.  
Источник — by Martin Strba for Balkan Brothers

Практикум: создаем лендинг своими руками

Пошаговое руководство

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

Источник — by EnvyTheme

Шаг 1. Соберите информацию о целевой аудитории

Как понять, что хочет ЦА? Собрать о ней максимум информации: возраст, пол, место жительства, социальный статус, уровень платежеспособности, привычки или симпатии. Проводите онлайн и офлайн-опросы, исследуйте поведенческие характеристики на форумах и в соцсетях, опрашивайте знакомых.

Источник — by Eddie Lobanovskiy

Шаг 2. Определите цель

Что вам нужно от пользователя? Определите главную цель, к которой будете его вести. Например:

  • записаться на конференцию;
  • подписаться на рассылку;
  • скачать презентацию;
  • попробовать бесплатную демо-версию;
  • скачать купон на скидку;
  • заказать товар или услугу.
Источник — by Mike | Creative Mints

Шаг 3. Подберите ключевые слова

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

Источник — by Walid Beno 

Шаг 4. Напишите контент

Заголовок

Короткий броский заголовок — главный инструмент привлечения клиентов. Одна из самых популярных формул продающего заголовка — 4U:

  • usefulness (польза): пояснение, как товар или услуга улучшит жизнь людей;
  • uniqueness (уникальность): отличие от конкурентов;
  • ultra-specificity (специфичность): обращение к узкому сегменту ЦА; 
  • urgency (срочность): ограниченность предложения по времени.

Не обязательно копировать эту формулу — используйте отдельные ее элементы, как Netflix, сделавший ставку на выгоду: «Все из Netflix. Бесплатно на 30 дней».

Тексты

  • Используйте короткие предложения, разбивайте их на блоки, чтобы облегчить восприятие.
  • Откажитесь от клише, сложных терминов или профессиональных шуток, которые никто не поймет.
  • Делайте ставку на конкретику. Продают цифры и факты. Не «Динамичая молодая компания», а «Разработали конструкцию матрасов, которые помогают сохранить здоровую спину. За три года нашими услугами воспользовались 1560 человек». 
Источник — by Afterglow

Социальные доказательства

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

Шаг 5. Сформулируйте призыв к действию

Сообщите пользователям, что вы от них ждете. Вот несколько советов по разработке кнопки СТА:

  • убедитесь, что она визуально привлекает внимание: используйте яркие цвета, которые выделяются на общем фоне;.
  • призыв должен быть одинаковым на всех экранах лендинга; 
  • один из часто используемых приемов — эффект дефицита или синдрома упущенных возможностей («Закажите последнюю партию», «Забронируйте со скидкой до конца месяца», «Успейте поучаствовать в акции к черной пятнице»).
Источник — by Catarina Coutinho

Шаг 6. Используйте единый дизайн

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

  • Логотип — визуальный образ компании. Расположите его в левом верхнем углу и позаботьтесь, чтобы он не сливался с фоном. Еще нет лого? Разработать его в несколько кликов вы можете с помощью генератора Logaster — достаточно ввести название бренда и сферу деятельности.
  • Цвета. Используйте не больше трех основных цветов, которые сочетаются между собой и отвечают образу бизнеса.
  • Шрифты. При помощи шрифта можно выделять места, на которые вы хотите обратить внимание (например, заголовок).
Источник — by Ramotion

Продает не только лендинг, но и ваш фирменный стиль!

Хотите удержать посетителя и превратить его в покупателя? Тогда создайте уникальный логотип прямо сейчас.

Шаг 7. Упростите навигацию

Не тратьте время пользователей — помогите им быстрее прийти к цели. Навигация должна быть простой и интуитивно понятной. Минимизируйте прокрутку, как делает Spotify. Вся основная информация умещается на одном экране: короткий заголовок «Музыка для всех», объяснение: «Миллион песен. Кредитная карта не нужна» и СТА с предложением попробовать продукт бесплатно.

Шаг 8. Добавьте фото и видео

Используйте визуальный контент: видео на лендинге может увеличить конверсию на 86%. Вот несколько приемов:

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

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

Шаг 9. Разместите информацию о тарифах и контакты

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

Контактная форма для сбора данных должна быть короткой. Не заставляйте людей оставлять свой телефон, если вам нужен только их электронный адрес.

Источник — by Nick Velichkin

Создание каркаса: формулы AIDA и PMPHS

Структура большинства одностраничников базируется на двух классических формулах: AIDA и PMPHS. Ориентируйтесь на них, но не копируйте слепо, чтобы контент не выглядел искусственно.  

AIDA

  • attention (внимание): первый экран с уникальным предложением («Лендинг под ключ за пять дней»);
  • interest (интерес): подробное описание преимуществ (какие выгоды получит клиент, отдав задачу на аутсорс);
  • desire (желание): скидки, подарки или ограниченное по времени предложение («Заказав услугу в течение 24 часов, вы получите 30-процентную скидку»);
  • action (действие): кнопка СТА («Хочу заказать прямо сейчас»).  

PMPHS

  • pain (боль): внимание на проблему («Не получается создать лендинг самостоятельно?»);
  • more pain (обострение боли): описание последствий нерешенной проблемы («Потеряете деньги на рекламе и не привлечете клиентов»);
  • hope (надежда): намек на возможность выйти из ситуации («Не обязательно тратить много денег и искать специалистов»);
  • solution (решение): ваш продукт, который решает проблему («Скачайте наше руководство по созданию лендингов — и разработайте сайт-визитку в десять простых шагов»).

Онлайн-конструкторы для создания лендингов

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

CUBIX — Project Collaboration and Organization
Источник — by Ben Schade

Wix

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

Стоимость: есть бесплатная версия с ограниченным функционалом; платные пакеты — от $4,5 в месяц.

Как работать с Wix, смотрите на видео:

Читайте также: «Как добавить логотип на сайт WIX?«

WordPress

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

Стоимость: есть бесплатная версия с ограниченным функционалом; платные пакеты — от $4 в месяц

Как работать с WordPress, смотрите на видео:

Как добавить логотип на сайт WordPress читайте в нашей подробной инструкции.

Joomla

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

Стоимость: бесплатно.

Как работать с Joomla, смотрите на видео:

Bootstrap

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

Стоимость: бесплатно.

Как работать с Bootstrap, смотрите на видео:

Tilda

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

Стоимость: есть бесплатная версия с ограниченными возможностями; платные пакеты — от $8 долларов в месяц.

Как работать с Tilda, смотрите на видео:

Читайте подробную инструкцию о том, как добавить логотип на сайт Tilda.

Заключение

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

Создавайте свой дизайн сейчас

Приступите к разработке своего фирменного стиля прямо сейчас. Введите название своей компании — и всего через минуту логотип будет у вас! Попробуйте сами! Нет ничего проще!

Хотя бы 3 символа в длину.