Разбираемся в терминах
Что такое лендинг
Лендинг – одностраничный сайт, который используется для сбора контактных и других типов данных. Лендинги не продвигаются в органическом поиске, и трафик на них идет только через контекстную рекламу и другие платные каналы (таргет, CPA-сети, прямые заходы).
Часто термины лендинг и одностраничный сайт используются как взаимозаменяемые, но это не совсем корректно. Одностраничный сайт может быть информационным (контентным), в то время как лендинг используется только для сбора контактных данных, и никакого полезного контента, с точки зрения поисковой системы, там нет.
«Одностраничник» не всегда является лендингом. Есть еще «одноэкранник» – это лендинг, состоящий из одного экрана, который отображается на десктопе полностью.
Главный элемент сайта – кнопка «Участвовать»
Лендинг актуален в следующих ситуациях:
- продвижение готового товара;
- продвижение услуги или сервиса;
- прогрев аудитории перед запуском продукта;
- сбор заявок для участия в мероприятии;
- презентация компании;
- проведение экспериментов и проверка гипотез среди целевой аудитории.
Зарубежные лендинги обычно гораздо интереснее в плане дизайна и не скованы рамками стандартной структуры
Что такое «конструктор»
Если лендинги путают с одностраничниками, то «конструкторы» успешно смешивают с CMS.
Конструкторы чаще всего используются для создания коммерческих сайтов, включая лендинги на основе готовых шаблонов. Возможности кастомизации и настройки сайта в конструкторах очень сильно ограничены. Конструктор – это не CMS, а так называемый SaaS-сервис (ПО по подписке). Как правило, он имеет полностью закрытый исходный код.
Примеры конструкторов:
- Wix;
- Tilda;
- Google Sites;
- Webstarts;
- Webnode.
А вот CMS – это полноценный инструмент для создания сайта с нуля, позволяющий настроить проект под любые потребности и нужды.
Примеры CMS:
- WordPress;
- Joomla;
- OpenCard;
- typo3;
- Chamilo;
- ImpressPages.
Какие конструкторы подойдут для создания лендинга
Wix
Один из самых раскрученных конструкторов в России и мире. По функционалу на голову выше 90 % конструкторов. Лендинги на Wix получаются красивыми, быстрыми и функциональными.
Wix предлагает десяток категорий для создания лендингов: бизнес, медицина, рестораны, путешествия, здоровье, мода, финансы и так далее.
Сейчас в Wix доступно около сотни шаблонов для лендингов. Создать и опубликовать полноценный лендинг можно за 150 рублей в месяц.
Пример верстки лендинга в редакторе
Reg.ru
Это не только известный регистратор доменных имен и хостинг-провайдер, но и конструктор простых сайтов и лендингов. В категории «Лендинги» здесь доступно более 10 бесплатных шаблонов (правда, они не локализованы и не особо адаптированы под российские реалии). Конструктор сайтов reg.ru доступен бесплатно на весь срок использования, но с ограничением в 10 мб (дисковая квота для развертывания вашего лендинга).
На бесплатном тарифе доступно только 30 шаблонов и 5 лендингов, показывается реклама. Полноценный тариф с более чем 170 шаблонами доступен на тарифе за 1 499 рублей в год.
Конструктор reg.ru удобнее Wix, но по функциональности сильно проигрывает.
Здесь есть только самые необходимые функции (работа с блоками, элементами, текстом, изображениями)
Ulanding
Конструктор заточен под создание лендингов. Простой, имеет три преимущества: быстрая интеграция с «Google Аналитикой», amoCRM и детальная настройка учета лидов. В остальном конструктор мало отличается от других подобных инструментов.
Есть неплохая внутренняя аналитика, которая показывает графики по посетителям, лидам и конверсиям. Что касается шаблонов, здесь их более сотни. Все разбиты по категориям и назначению. Самый простой тариф обойдется в 9 долларов в месяц и позволит управлять пятью лендингами с одного аккаунта.
Каждый вариант лендинга имеет разную эффективность
LPgenerator
Конструктор для создания одностраничных сайтов и лендингов. Один из самых простых и удобных вариантов, который я видел. Шаблонов для лендингов здесь более 200. Текст, элементы страницы, иконки и другую графику можно настроить в один клик. В LPgenerator есть собственная CRM, так что не обязательно пользоваться интеграциями. А еще собственный сервис SMS- и email-рассылок. Базовый тариф (один домен и не более трех страниц) обойдется в 959 рублей в месяц.
Лендинг для кондитерской компании
GetResponse
Многие маркетологи хорошо знакомы с этим брендом. Есть у GetResponse и любопытный конструктор лендингов, который интегрирован в сервис e-mail рассылок. Возможности конструктора GetResponse: работа с блоками на основе готовых шаблонов (более сотни вариантов), свободное изменение кода страницы, интеграция с Google Analytics и встроенные инструменты для проведения А / B-сравнений. Если у вас база e-mail рассылки до 500 подписчиков, использование конструктора будет бесплатным.
Пример шаблона для лендинга GetResponse
Как создать лендинг в конструкторе
Подготовка
«Верстка» сайта в визуальном редакторе конструктора – один из финальных этапов создания лендинга. До него нужно провести подготовительную работу:
- определить сильные стороны, УТП;
- выделить основные сегменты аудитории – текст и дизайн лендингов должен быть разным для каждой группы клиентов;
- найти конкурентов в нише, проанализировать их УТП и ключевые элементы сайтов;
- написать тексты для главной страницы;
- провести прототипирование;
- создать сайт в конструкторе;
- опубликовать его.
Структура
Обычно лендинг строится из смысловых блоков и может выглядеть так:.
- В первом блоке находятся следующие элементы: шапка, уникальное торговое предложение, subtitle и CTA.
- Во втором – описание оффера.
- В третьем и дальше – способы использования продукта, блок «О компании», блок «выгод», экспертиза, доверие, опыт, пошаговая схема, как получить товар или воспользоваться услугами компании.
Или так:
- 1 блок – основная выжимка об оффере.
- 2 блок – преимущества оффера. В этом блоке часто размещается подробное описание товара, мероприятия или услуги.
- 3 блок – доказательства и доверие. Часто размещаются советы и отзывы о товаре.
- 4 блок – контактная форма. Здесь пользователь оставляет данные для связи, обычно – это электронная почта или номер телефона.
- 5 блок – футер. Можно продублировать сведения об организации или разместить CTA.
Как создать лендинг на Wix
Открываем Wix, регистрируемся и проходим авторизацию. Затем попадаем на главный экран личного кабинета (страницу «Мои сайты») и нажимаем «Создать сайт»:
Приступаем к созданию лендинга на Wix
Теперь нужно выбрать категорию шаблона для будущего лендинга:
Лучше изначально определиться с тематикой. Так вы сразу увидите наиболее подходящие по дизайну и функционалу шаблоны
После выбора категории появится новое окно. Мы хотим создать сайт в редакторе, поэтому нажимаем кнопку «Выбрать шаблон»:
Если вы не хотите использовать готовое решение, нажмите «Создать сайт». Прохождение опроса и создание сайта в этом случае займет у вас порядка получаса, при этом сайт все равно будет построен из стандартных блоков. «Выбрать шаблон» – вариант для экономии времени
В правом верхнем углу есть поисковая строка. Вводим в ней слово «Лендинг» и получаем более 20 страниц шаблонов под этот формат сайта:
Выберите шаблон, который наиболее полно отражает ваше представление о будущем лендинге. Ориентироваться на текст и картинки не нужно: их мы заменим позже
Наводим курсор на понравившийся шаблон и нажимаем кнопку «Редактировать»:
Нажмите «Редактировать», чтобы сразу перейти в редактор, или «Смотреть шаблон», чтобы посмотреть сайт с примененным дизайном
Наконец мы попадаем в визуальный редактор. Как видим, все элементы на странице, включая заголовки, удачно размещены:
Кликнули по кнопке, чтобы изменить ее текст и настроить навигацию
Wix позволяет добавить на лендинг следующие типы объектов:
Доступно более десятка объектов: текст, фото, блоки, боксы, кнопки и так далее
Текст заголовков, кстати, можно форматировать аж до H6 (но не значит, что нужно):
В других конструкторах H3 или H4 – максимум
Разберем навигационное меню Wix подробно. Доступно восемь кнопок (не считая кнопки добавления объекта):
Левое навигационное меню Wix
- Меню и управление страницами. Здесь можно отредактировать стандартное меню лендинга. Если у вас многостраничный сайт (не-лендинг), в этом разделе вы сможете сделать полноценное меню (главная, FAQ, условия доставки и оплаты, политика сайта), добавить формы регистрации и входа, страницы магазина (страница товара, страница магазина, корзина) и страницы пользователя (мои заказы, мой аккаунт, мои адреса).
Любую страницу можно удалить или отредактировать здесь
- Дизайн сайта. Здесь вы можете настроить дизайн, в том числе переходы между страницами, фоны, цвета, шрифты, стили страниц.
Мы выбрали стиль шаблона, но его можно кастомизировать
- Добавить приложение. Приложения – те же плагины (как в других CMS). Они позволяют расширить функционал лендинга, например, добавить чат, секцию комментариев, бронирование, управление билетами и многое другое. Все приложения отсортированы по категориям (маркетинг, коммуникации, магазины, дизайн, услуги, контент).
На главном экране отображаются самые популярные приложения
- Медиа. Это библиотека, в которую загружаются фото и видео для публикации на сайте. Здесь же есть редактор и видеомейкер. Для лендингов и других сайтов доступны сотни бесплатных стоковых фотографий и видео.
Нажмите «Показать больше», чтобы увидеть весь каталог
- Вести блог. Вы можете добавить раздел «Блог» на свой сайт. Для лендингов неактуально.
Управление блогом осуществляется в другом приложении
- Магазин. Полноценные коммерческие сайты могут подключить Wix eCommerce. Этот инструмент позволяет настроить товары, каталоги, скидки, оплату и корзину. Можно отслеживать прием и отправку товаров. Магазин доступен с тарифа «Бизнес и эл. коммерция» – от 400 рублей в месяц.
Настройка Wix Stores начинается с добавления товаров
- Бизнес-инструменты Ascend. Это многофункциональный модуль, позволяющий управлять SEO (поисковая оптимизация, рассылки, купоны и промо, интеграции), веб-аналитикой, маркетинговыми и финансовыми процессами сайта (интеграции с финансовыми сервисами, запрос цены, счета). Еще здесь есть управление клиентами – от форм и чатов до многозадачности и управления потоками клиентов.
Нажмите кнопку «Начать оптимизацию», чтобы указать ключевые слова вручную или подобрать их автоматически
- Отобразить слои. Любой сайт Wix состоит из нескольких слоев (шапка / хедер / заголовок, страницы, подвал), и вы можете управлять ими из этого раздела:
Перетаскиваем слой наверх, ближе к хедеру
С меню все! Перейдем к визуалу. Чтобы отредактировать любой элемент на сайте, кликните по нему правой кнопкой и измените значение в появившемся окне. Когда все элементы на первой странице лендинга будут отредактированы, пролистайте ее вниз. Аналогичным образом измените текст и элементы на следующей странице:
Отредактируйте текст и описание второй страницы
Настройка текста – блок, где вы можете выбрать стили, шрифт, его размер, начертание и другие параметры:
Можно добавить эффекты, настроить интервалы, вертикальный текст и добавить HTML-тег
Когда все страницы лендинга будут настроены, откройте «Мобильный редактор». Он поможет увидеть лендинг при заходе с мобильного устройства:
Верстка может «полететь» при редактировании первоначального шаблона
Откроется новое окно. Также, как и в версии для десктопа, изменяем элементы в мобильной версии сайта:
Принцип редактирования элементов ничем не отличается
Когда верстка в визуальном редакторе будет завершена, нажмите кнопку «Опубликовать» в правом верхнем углу:
Нажмите эту кнопку
Успех! Теперь наш лендинг доступен на внутреннем домене:
Лучше сразу подключить полноценный домен второго уровня
Wix позволяет подключить ваш собственный домен. Для этого нажмите кнопку «Подключить» и оплатите тариф. За 90 рублей в месяц вы можете подключить один домен, но тогда на вашем сайте будет показываться реклама Wix. Базовый тариф с подключением домена и без рекламы обойдется в 150 рублей в месяц.
Wix – крутой инструмент, позволяющий создать очень красивый и функциональный лендинг. Никаких минусов в этом инструменте мы не нашли.
Как создать лендинг на LPgenerator
Открываем главную LPgenerator и нажимаем кнопку «Создать лендинг»:
Кликните по оранжевой кнопке
Откроется окно регистрации. Указываем телефон, пароль и электронную почту. Подтверждать код по телефону не нужно.
Попадаем на страницу выбора шаблона. Все они объединены по категориям:
Все представленные шаблоны относятся к лендингам
В каждом шаблоне текст и другие элементы страницы уже локализованы (в отличие от того же Wix):
Каждый шаблон можно посмотреть в полном размере (нажмите кнопку «Посмотреть»)
Мы решили создать лендинг на основе шаблона «Загородные дома». Когда вы выберете вариант, подходящий вам, нажимайте кнопку «Создать сайт из этого шаблона»:
Создаем сайт на основе выбранного шаблона
Попадаем на экран визуального редактора, где можно отредактировать любой элемент страницы:
Режим визуального редактора LPgenerator
Теперь посмотрим на основные инструменты LPgenerator:
Основные разделы конструктора LPgenerator
- Здесь происходит управление шаблонами. Кроме готовых шаблонов можно самостоятельно создать уникальный дизайн или заказать его у специалистов. А еще есть шаблоны для страниц FB.
- В этом разделе собраны красивые мобильные страницы, которые уже имеют контактные формы и подготовлены к превращению мобильного трафика в лиды (CtC, контактные формы, мобильные лендинги).
- Здесь можно привязать собственный домен (включая почтовый) к созданному лендингу. Купить полноценный домен можно прямо из интерфейса LPgenerator. Удобно, что DNS-адрес привязывается сразу после покупки домена.
- Эксперименты. Преимущество LPgenerator в том, что вы можете создать несколько вариаций одного лендинга и сразу запустить A / B-эксперимент. Здесь есть все, чтобы определить самый эффективный лендинг + можно выбрать % показов для всех вариантов лендинга и внедрить собственные скрипты. Результаты сплита сохраняются в отдельный отчет.
- Встроенная веб-аналитика позволит получить все данные по эффективности созданного лендинга. Как и во «взрослых» инструментах, здесь есть определение стоимости клика, лида и даже инструменты для вычисления суммарной окупаемости инвестиций. Изучая воронку на уровне параметров трафика, вы найдете лучшие варианты лендинга и сможете увеличить его эффективность в долгосрочной перспективе.
- Интеграции с другими сервисами. Уже «из коробки» вы сможете связать созданный лендинг с Bitrix, MailChimp, amoCRM и другими инструментами для командной работы, рассылок, платежей и CRM.
- Удобное и быстрое решение для управления заявками. Все лиды можно отсортировать по статусу и другим параметрам, есть экспорт заявок, оповещения и дополнительные инструменты.
Вернемся в визуальный редактор. В итоге у нас получилась такая страница:
Эту посадочную страницу мы сделали на основе готового шаблона
Если вам нужно добавить на страницу новый блок, кликните по плюсу в левом углу экрана:
Добавление нового блока
В LPgenerator доступны следующие виды блоков:
Чуть меньше чем у Wix, но для стандартных лендингов хватит с лихвой
Останавливаться подробнее на описании каждого блока не будем, так как они односложные. Просто нажмите нужный элемент и тяните его вправо (в область страницы), затем настройте параметры внутри всплывающего окна.
Редактор мобильный версии сайта доступен здесь:
Нажмите эту кнопку
Шрифты по всему сайту и цвета вы можете поменять здесь:
Доступны заголовки H1 / H2 / H3 / H4, крупный, обычный и маленький текст
В остальном редактирование шаблона лендинга мало отличается от Wix. Логика элементарна: кликаем по необходимому элементу, а затем изменяем его параметры в открывшемся окне:
Настройки у разных типов элементов могут различаться
Аналогично редактируются все элементы лендинга, например, форма:
Обратите внимание на вкладки вверху окна: можно настроить дизайн, действия, цели и добавить интеграцию (PayPal, Bitrix24, GetResponse и другие)
Кликнув по изображению или иконке, вы откроете медиа-библиотеку конструктора:
Все изображения отсортированы по сценарию использования (иконки, эмодзи, социальные сети, картинки на странице)
Нажав кнопку «Добавить секцию» внизу страницы, вы можете создать новый элемент на основе готового блока:
Нажмите эту кнопку
Откроется окно добавления новой секции. В LPgenerator есть все, что может понадобиться при конструировании даже сложного лендинга – от простых секций с кнопкой до больших галерей и товарных каталогов.
Мы добавили секцию комментариев в самом низу страницы:
Все секции отсортированы по категориям (вкладки, услуги, первый экран, преимущества)
Перейдя на вкладку «Шаблоны», вы сможете выбрать секцию из готовых вариантов, тоже отсортированных по категориям:
Доступно пять готовых сценариев для видеосекции
После финальной настройки лендинга нажмите кнопку «Запустить» в верхнем правом углу экрана. Сайт станет доступен любому пользователю, и можно начинать лить на него трафик.
Для запуска сайта и доступа ко всему функционалу LPgenerator нужно выбрать тариф, иначе опубликовать лендинг в интернете не получится. Самый доступный тариф стоит 690 рублей в месяц (можно подключить собственный домен):
«Бизнес» – оптимальный вариант для эффективного лендинга
Резюме
Создать красивый и функциональный лендинг можно за полчаса. Работа в визуальном редакторе – не самый сложный этап. Гораздо сложнее сделать так, чтобы сайт был эффективным и стабильно приносил лиды.
Целевая аудитория – выделена, сильные стороны оффера – обозначены, конкуренты – внимательно проанализированы, а текст на главную написан с учетом «болей» ЦА? Отлично, теперь можно приступать к созданию прототипа и работе в конструкторе.
Перед публикацией лендинга проверьте сайт:
- мобильная версия лендинга открывается и работает корректно;
- контакты организации указаны на главной странице и в них нет опечаток;
- в отдельный блок выделены все УТП;
- форма для сбора лидов работает корректно (протестируйте ее, попробовав передать собственные контактные данные);
- заголовок сайта не перегружен лишней информацией.