Как создать лендинг самому

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

Цели и задачи Landing Page

Лендинг — это одностраничный сайт, который создается для продвижения конкретного товара, услуги, мероприятия. В переводе с английского Landing Page означает «посадочная страница», в русском языке принято употреблять термин-кальку «лендинг».

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

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

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

Кому и когда нужен лендинг

Кому и когда нужен лендинг - картинка

Главное, для чего нужен одностраничный сайт, это:

  • реклама единичного продукта или небольшой группы товаров;
  • продвижение услуги;
  • быстрая стимуляция продаж.

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

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

Зачем еще нужен лендинг-пейдж:

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

Обычный сайт и лендинг: в чем разница

Обычный сайт и лендинг: в чем разница - картинка

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

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

В этой статье мы разобрали - что лучше для бизнеса сайт или лендинг.

Основные признаки классического лендинга

Основные признаки классического лендинга - картинка

В каком-то смысле, лендинг-пейдж работает как путеводитель по рекламируемому продукту, поэтому для этого web-жанра сложились определенные правила.

Особенности лендинга:

  1. Продающий заголовок.

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

  2. CTA (call to action) — призыв к действию.

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

    Призыв к действию должен быть заметным, понятным и простым для исполнения. Обычно это кнопка с глаголом: «Купить», «Подписаться», «Забронировать», «Рассчитать» и т.д.

  3. Содержательная часть.

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

  4. Фокус на целевой аудитории.

    Лендинг проектируется под определенные сегменты аудитории. Здесь учитывается подготовленность пользователей, их осведомленность о продукте, с каких площадок они приземлились.

  5. Упаковка.

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

Виды лендингов

Виды лендингов - картинка

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

  • Страница для генерирования лидов — Lead Generation Landing Page.

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

  • Страница для клика — Click-through page.

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

  • Страница продажи — Sales page.

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

  • Страница-квиз — Quiz.

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

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

  • Сжатая страница — Squeeze Page.

    Мини-лендинг для самого важного, его и одностраничником-то сложно назвать, скорее это «одноэкранник» с необходимым минимумом информации и формой для регистрации. Squeeze Page часто используют для быстрого сбора контактов у уже подготовленной аудитории, например, когда нужно быстро собрать базу для рассылки оповещений перед вебинаром или организовать регистрацию на офлайн-мероприятие.

  • Яркие страницы — Splash page.

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

Создание лендинга самостоятельно с нуля

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

Для начала разберемся с определением. Landing Page — это посадочная страница, задача которой продвижение конкретного продукта. Лендинги имеют свою четкую структуру, где каждый элемент работает на конверсию: пользователя буквально за руку подводят к совершению целевого действия. Это может быть все что угодно: оформление заказа, заявка на просчет, регистрация на мероприятие, бронь места, подписка на рассылку. У посадочных страниц есть одно главное правило: один лендинг — один продукт. Смысл здесь в том, чтобы не распылять внимание аудитории на другие товары и услуги.

Что такое лендинг - картинка

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

Подготовка

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

Цель лендинга

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

Возможные варианты:

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

УТП

Уникальное торговое предложение - картинка

Уникальное торговое предложение — это самая суть вашего будущего одностраничника, то, что выделяет вас среди конкурентов и делает ваш продукт привлекательным для аудитории. Чтобы сформулировать УТП, нужно ответить на три вопроса:

  • В чем уникальность вашего предложения в сравнении с аналогичными продуктами, представленными на рынке?

    Например, вы натаскиваете учеников на ведение жестких переговоров всего за неделю интенсивных вечерних занятий.

  • На кого рассчитано ваше предложение?

    Ваш курс для предпринимателей и менеджеров, у которых нет лишнего времени.

  • Какие проблемы аудитории решает ваш продукт?

    Учит эффективно вести переговоры в любых стрессовых условиях.

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

Целевая аудитория

Целевая аудитория - картинка

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

Портрет целевой аудитории складывается из разных показателей: так называемого «соцдема» (пол, возраст, семейное положение, социальный статус, уровень дохода, регион проживания), интересов, желаний, болей и критериев, на основе которых пользователь принимает решение о покупке.

Как определить ЦА:

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

Анализ конкурентов

Анализ конкурентов - картинка

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

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

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

Текст для лендинга

Текст для лендинга - картинка

Качественная подготовительная работа помогает осознанно создавать контент для сайта, но тексты для Landing Page — это особый жанр, который требует соблюдения жестких правил.

  • Главная страница лендинга — это первый экран. От него зависит, заинтересуется ли пользователь вашим предложением. Поэтому все самое важное ставим в начало, прямо с места в карьер. Landing Page не место для интриг, намеков и долгих подводок.
  • Тщательно проработайте УТП. Оно должно быть релевантным запросу, по которому пользователь приземляется на вашу посадочную страницу. По сути УТП должно быть заголовком первого экрана. Наиболее эффективная и поэтому популярная формула для такого заголовка называется 4U:
    • 1U (usefulness) — польза. Какую выгоду или пользу получит клиент.
    • 2U (uniqueness) — уникальность. За счет чего работает ваше выгодное предложение.
    • 3U (ultra-specifity) — ультраспецифичность. Количественный показатель выгоды.
    • 4U (urgency) — срочность. Указание конкретного срока действия предложения.
  • Факты важнее общих фраз: вместо клише с уже давно затасканным смыслом нужно оперировать цифрами, реальными кейсами, живыми отзывами.
  • Следуйте правилу «краткость — сестра таланта». Лендинг воспринимается пользователями как рекламная информация, поэтому никто не готов здесь читать километры текста. Лучшее решение для этого формата — блоки с небольшими емкими текстами и иллюстрации.
  • Уделяйте внимание заголовкам для каждого текстового блока. Пользователи предпочитают быстро считывать информацию по опорным заголовкам и останавливаться только на важных для себя блоках.

Не каждый предприниматель ясно понимает, как создать текст для продающего лендинга. Иногда гораздо полезнее делегировать эту задачу профессиональному копирайтеру. Где искать исполнителя:

  • На биржах копирайтинга, например ContentMonster — биржа с жестким отсевом авторов на входе и своим внутренним обучением копирайтеров, или eTXT — одна из самых популярных бирж с огромным выбором авторов на разный кошелек.
  • В частных копирайтинговых агентствах.
  • Среди фрилансеров в тематических пабликах «ВКонтакте», профильных каналах «Телеграма» и в других соцсетях.

Блоки лендинга

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

Что должно быть в лендинге:

  • Главный блок - картинка

    Главный блок располагается на первом экране Landing Page. Здесь сразу демонстрируется ваше уникальное торговое предложение, которое не должно оставить сомнений, что именно вы предлагаете и какие выгоды получит клиент.
  • Описание продукта - картинка

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

    Информация о компании или о персоне, если лендинг рекламирует авторский проект. Здесь нужно доказать свою экспертность, объяснить, почему вам можно доверять.
  • Отзывы - картинка

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

    Призыв к действию или форма для сбора контактных данных. Это обязательный элемент лендинга, ради которого, собственно, все и затевается. Именно кнопка CTA (Call-To-Action) отвечает за конверсию.
  • Вопросы по продукту - картинка

    FAQ — блок с наиболее популярными вопросами по вашему продукту. Позволяет внедрить на посадочную страницу ключевые фразы и заодно помочь пользователю разобраться с особенностями вашего предложения и снять возражения.
  • Лицензии, сертификаты - картинка

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

    Таймер. Ограничение по времени стимулирует принять решение быстро, не откладывая в долгий ящик.
  • Контакты в подвале сайта. Чем больше контактных данных вы указываете на лендинге, тем выше доверие аудитории.

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

  • Факты в цифрах - картинка

    Факты в цифрах. Здесь важно не переусердствовать. Цифры хорошо иллюстрируют информацию, когда они понятны или соотносятся с чем-то понятным для аудитории.
  • Кейсы - картинка

    Выгоды, они же преимущества вашего продукта или сервиса. Здесь вы не просто расхваливаете товар, а описываете, что получит клиент, оформивший заказ.
  • Видео - картинка

    Видео. Принцип «лучше один раз увидеть, чем 100 раз прочитать» работает со многими категориями товаров и услуг. Все, что можно показать, надо показывать.
  • Портфолио - картинка

    Портфолио. Презентативная выборка лучших работ снимает множество страхов у потенциальных клиентов.
  • Блок «Для кого». Иногда полезно сразу обозначить целевую аудиторию лендинга.
  • План действий - картинка

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

    Тарифы и цены. Старайтесь не прятать этот блок, его наличие существенно влияет на конверсию.
  • Платёжная кнопка. Если лендинг предполагает прямую продажу продукта, привяжите к нему платежную систему с несколькими вариантами оплаты заказа.
  • Партнеры. Узнаваемые партнеры влияют на репутацию вашей компании и формируют доверие.
  • Галерея. Если ваш продукт предполагает эффектный визуальный ряд, делайте галерею с примерами работ.
  • Расписание. Блок будет уместен, если ваш сервис или офлайн-офис работают по расписанию.
  • Команда - картинка

    Команда. Часто людям важно знать, с кем они имеют дело. Рассказ о команде, персонализация отлично работают на доверие.

Прототип

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

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

Что смотрим на прототипе

Прототип сайта - картинка

  • Расположение и объем текстовых блоков.
  • Оформление заголовков.
  • Расположение и содержание графических элементов: картинок, иконок, инфографики, схем.
  • Расположение, содержание и размер кнопок CTA.
  • Контрастность фонов на каждом экране.

В чем делаем прототипы

В чем делать прототип - картинка

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

  • На бумаге. Это уровень Elementary, доступный каждому. Просто берете лист бумаги и рисуете на нем схему каждого экрана. Этот способ хорош на самом начальном этапе обсуждения, им не пренебрегают даже опытные разработчики.
  • Moqups. Онлайн-сервис для прототипирования разных проектов от презентаций до полноценных сайтов. Здесь есть удобная база шаблонов, а готовый прототип можно экспортировать в pdf. Сервис платный, но один проект доступен бесплатно. Для первого опыта его функционала хватит.
  • Photoshop или любой графический редактор. Удобный инструмент для тех, кто знаком со специальными программами. Здесь же можно потом накручивать дизайн.

Bootstrap в Photoshop - картинка

В Photoshop есть возможность сразу работать с сеткой Bootstrap. Это инструмент для создания адаптивного дизайна, который впоследствии будет нормально отображаться на любом устройстве. Сетка обычно состоит из 12 колонок и структурирует контент лендинга.

Дизайн

Наконец, начинается самая приятная работа над дизайном лендинга: выбор шрифтов, цветовой гаммы и создание графических элементов.

Шрифт

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

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

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

Цвет

Палитра лендинга - картинка

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

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

  • 60% — доминирующий оттенок;
  • 30% — дополнительный оттенок;
  • 10% — акцентный цвет.

Вся сложность в этом методе найти гармоничное сочетание этих трех оттенков. Для этого можно воспользоваться онлайн-сервисами для составления цветовых схем, например Coolors или color.adobe.com.

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

Фиолетовый — тяжелый, холодный, насыщенный, спокойный, таинственный. Способствует вдохновению, чувствительности, состраданию.

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

Зеленый — спокойный, нежный, умиротворяющий, живой, свежий. Символизирует покой, мир, спасение, любовь, гармонию, жизнь, рост.

Красный — насыщенный, горячий, тяжелый, яркий. Цвет лидерства, активности, уверенности, дружелюбия. Стимулирует нервную систему.

Желтый — радостный, легкий, струящийся, теплый, яркий. Ассоциируется с движением, весельем, вызывает приятные ощущения.

Черный — таинственный, сдержанный, элегантный, траурный, глубокий.

Более подробно с психологическими характеристиками цветов можно познакомиться здесь: Значение цветов в психологии.

Графика

Графика - картинка

Фотографии, иконки, кнопки, иллюстрации — все это необходимые элементы лендинга.

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

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

Бесплатные фотостоки — крайний случай. Уж слишком много желающих воспользоваться халявой, поэтому и ходят одни и те же фотографии по разным лендингам, вызывая у пользователей оскомину и недоверие к контенту. Один из самых популярных фотостоков Free Stock Images.

Верстка

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

CMS WordPress + редакторы WPBakery или Elementor.

Редакторы кода - картинка

WordPress — самый популярный движок в мире, на нем работают 43% сайтов во всем интернете. Сама CMS бесплатная, но к ней можно докупить полезные платные инструменты. Drag&Drop редакторы WPBakery и Elementor — это два плагина для WordPress, которые позволяют верстальщику создавать и редактировать страницы сайта, просто перетаскивая элементы интерфейса в визуальном редакторе. Дословный перевод названия технологии «перетяни и кинь».

Комбинация WordPress с одним из Drag&Drop-редактором делает верстку лендинг-пейдж доступной и несложной для новичков в процессе обучения.

  • Tilda

    Конструктор Tilda - картинка

    Один из самых популярных и очень понятных конструкторов сайтов. Разобраться с версткой на Тильде может любой, даже далекий от web-дизайна человек. Здесь отличный функционал, понятное юзабилити, масса уроков по верстке.

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

  • uKit

    Конструктор uKit - картинка

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

  • LPgenerator

    Конструктор LPgenerator - картинка

    Профессиональный конструктор лендингов, заточенный под верстку одностраничников со всей их спецификой. Эта платформа не для новичков, она рассчитана на опытных разработчиков Landing Page. Но если вы настроены серьезно разобраться в вопросе, сервис предлагает сильную обучающую базу — курс «Университет лидогенерации».

  • LPmotor

    Конструктор LPmotor - картинка

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

  • Платформа LP

    Конструктор Платформа LP - картинка

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

  • Ручная верстка

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

Домен

Чтобы запустить свой сайт-одностраничник в большое плавание, ему нужно выбрать доменное имя. Домен — это адрес web-ресурса. Есть три варианта размещения посадочных страниц:

  1. Новое доменное имя.

    Собственное имя лендинга покупается у регистраторов типа Reg.ru или Timeweb.com — тут домен покупается сразу с хостингом, это выгоднее, чем по отдельности.

    Формула адреса: landingpage.ru

  2. Внутренняя страница сайта.

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

    Формула адреса: site.ru/landingpage

  3. Поддомен.

    Домен третьего уровня сохраняет связь с основным адресом, но становится обособленным. Этот способ размещения лендинга используется реже других.

    Формула адреса: landingpage.site.ru

Процедура регистрации нового доменного имени на любом сервисе-регистраторе:

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

Полезные советы по созданию лендинга

Полезные советы по созданию лендинга - картинка

  • Упрощайте.

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

  • Форматируйте текст.

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

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

  • Выделите CTA.

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

  • Сфокусируйтесь на ЦА.

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

  • Пишите о клиенте.

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

  • Заходите с козырей.

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

  • Позаботьтесь об адаптивности.

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

  • Избавьтесь от лишних ссылок.

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

  • Отожмите воду.

    Для лендингов важна точность формулировок и концентрация на важных характеристиках продукта. Людям интересна самая суть, сливки вашего предложения. Рекламному тексту не прощают высокую художественность и пространные лирические отступления.

  • Будьте честны.

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

Преимущества лендинга

У Landing Page высокая конверсия, это самый простой инструмент лидогенерации, но маркетологи ценят посадочные страницы и за другие достоинства.

  • Гибкость настроек. Когда вы запускаете полновесный сайт-многостраничник, то оказываетесь рабом лампы. Если что-то не работает, как надо, то анализ и переделки сжирают время и силы. С лендингом все гораздо проще. Тут можно экспериментировать буквально на коленке, проводить А/В-тестирование, тут же снимать результаты и быстро вносить изменения.
  • Быстрый запуск. Создание лендинга — это то, что не требует месяцев веб-разработки, часто достаточно от пары дней до недели для запуска проекта. К тому же, простенькую посадочную страницу без особых претензий к качеству и уровню конверсии может сделать даже новичок.
  • Возможность запускать на один продукт одновременно несколько посадочных страниц: для тестирования или для разных сегментов целевой аудитории.

Недостатки лендинга

Есть у одностраничников и обратная сторона:

  • Очевидные проблемы с SEO. Оптимизация классически строится на регулярном обновлении контента, поведенческих факторах, глубине просмотров, использовании ключевых слов и т.д.
  • Недоверие пользователей, ведь одностраничники легко сделать и запустить, поэтому среди них попадается много мошеннических сайтов-однодневок. Клиенты предпочитают взаимодействовать с полноценными сайтами, которые кажутся более надежными.
  • Лендинги все же не универсальны. Сложные продукты с растянутым сроком принятия решения не всегда возможно продать с помощью посадочной страницы.

Конверсия Landing Page

Конверсия Landing Page - картинка

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

Коэффициент считают по формуле:

коэффициент конверсии = количество целевых действий / количество посетителей * 100 %

Нормальная конверсия от 5 до 20 % — тут все зависит от ниши, продукта и характера целевого действия. На призыв «Получите подарок» отзовется больше народу, чем на «Приведите друга и получите скидку 1 %».

Дополнительные инструменты

Дополнительные инструменты - картинка

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

  • Онлайн-чат. Многие сегодня предпочитают письменную коммуникацию устной, поэтому онлайн-чаты стабильно повышают конверсию. Человек охотнее напишет о своей проблеме в чат и, быстро получив ответ, оформит заказ, чем выйдет из своей зоны комфорта, чтобы позвонить.
  • Обратный звонок. Инструмент для экономных. пользователь оставляет свой номер, а ваш менеджер быстро ему перезванивает.
  • Метрики «Яндекса» и Google. Нужны для контроля и анализа статистики и эффективности сайта.
  • Ретаргетинг. Нужен для запуска рекламы в соцсетях. С помощью метки на лендинге вы будете собирать базу посетителей с аккаунтом в нужной вам соцсети, а потом настраивать на них рекламу.
  • CRM. Система управления взаимоотношениями с клиентами, позволяет контролировать все действия по заявкам на сайте.
  • Калькулятор. В некоторых нишах калькуляторы становятся эффективным инструментом привлечения лидов. Хороши там, где по нескольким стандартным параметрам можно сделать расчет.
  • Сбор базы подписчиков. Необходимый инструмент для тех, кто планирует заниматься email-маркетингом.

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

Заключительный этап работы над лендингом — тестирование и проверка на ошибки. Что проверяем:

  • Тексты: вычитываем сами или отправляем корректору.
  • Адаптивность: тестируем посадочную на всех доступных устройствах.
  • Кнопки: корректно ли они работают.
  • Формы лидогенерации: попадают ли данные из формы, куда было задумано.

SEO-продвижение лендинга

Лендинги — сайты, заточенные под коммерческий трафик, и к SEO это не имеет отношения. На посадочные страницы приземляются с контекстной и таргетированной рекламы, с email-рассылок, с рекламных баннеров, но сюда не приходят из выдачи поисковых систем.

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

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

И все же попытаться поколдовать над SEO на лендинге можно, этому мы посвятили целую статью: Одностраничный сайт - как продвинуть в поисковых системах.

Как создать лендинг самому

Как создать лендинг самому - картинка

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

  • Тильда. Один из самых популярных на сегодня конструкторов сайтов. Для лендингов есть готовые блоки, включая формы сбора данных. Сервис предлагает 250 готовых шаблонов для разных ниш.
  • LPgenerator. Профессиональный конструктор лендингов с неделей бесплатного тестового периода. 300 шаблонов, много полезных функций типа A/B-тестирования, управления лидами, CRM.
  • LPTrend. Стандартный недорогой конструктор, заточенный под создание Landing Page.

Заключение

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

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

Обсудим сотрудничество?

Какие задачи нужно решить:
Разработка сайта / интернет-магазина
Продвижение (SEO, Директ и т.п.)
Контент-маркетинг
Поддержка сайта (информационная, техническая)
Аудит сайта / интернет-магазина
Консультация
Задать вопрос специалисту
Заполните форму и мы вам быстро ответим

Комментарии

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

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

Провести бесплатный SEO-аудит вашего сайта?

Провести бесплатный SEO-аудит вашего сайта?

Хочу бесплатный аудит
Заказ сайта
Оставить заявку
Заявка на расчет
Оставить заявку
Оставить заявку
Заказ услуги
Заказ услуги
Заказ работ
Продвижение от 10.000 рублей
Form
X
Хочу быть автором