Как сделать лендинг пейдж своими руками

Создание лендинга

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

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

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

Блок 1: заголовок и информация

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

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

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

Блок 2: преимущества и раскрытие темы

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

Цель этого блока – рассказать клиенту о том, что он должен купить, сколько это стоит и почему он должен работать именно с вами.

Блок 4: форма заявки, призыв к действию

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

Также в последнем блоке – футере, обычно располагается информация о конфиденциальности, ссылки на какие-то прочие разделы (более подробную политику, например) или информация о годах, а также о том, что “Все права защищены”.

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

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

Основные особенности эффективного лендинга

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

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

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

Профессионально выглядящее иллюстрации

После того, как мы зарегистрировали домен и подобрали инструмент для создания лендинга, мы начинаем разработку его уникального и максимально профессионального вида. Чтобы упростить себе задачу, мы предлагаем использовать уже готовые и бесплатные инструменты такие как Canva. Процесс интуитивен и ясен, поэтому возможно создать изображения в краткие сроки. Более опытные могут инвестировать, например, в Photoshop и протестировать эту программу в пробной версии либо воспользоваться бесплатными аналогами онлайн, в которых доступно меньше опций. Ресурсами бесплатных картинок является Pixabay или Iconfinder для поиска иконок. 

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

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

Четкие и ясные заголовки

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

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

Правильное соответствие ранее упомянутой CTA также является важным элементом, который информирует пользователя и перенаправляет его в соответствующий раздел или оффер. Лучше использовать более “теплые” фразы, такие как “Мне нужна помощь”, но для обычного редиректа также подойдет “Купить”, “Нажми” и другие. 

Простой контент

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

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

Конструкторы лендингов с англоязычным интерфейсом

Конструктор лендингов Weblium

Конструктор лендингов Weblium от компании TemplateMonster позволяет выбрать подходящий шаблон сайта, воспользоваться услугой регистрации домена, хостингом и SEO-продвижением.

Плюсы:

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

Минусы:

• Ограниченные возможности интеграции.
• Нет модулей для ecommerce.

Конструктор лендингов HubSpot Landing Page

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

Плюсы:

• Хостинг для домена.
• Широкий набор инструментов: А/В тестирование, настройка контента на основе местоположения, создание форм подписки и призывов к действию.
• Адаптивность.
• Большие возможности в дизайне, можно настроить практически все — от изображений и шрифтов до внешнего вида кнопок.
• Сбор статистики в панели управления HubSpot и подключение Google Analytics.
• Наличие встроенной CRM-системы.

Минусы:

Доступен только в пакете Marketing Hub, приобрести HubSpot Landing Page отдельно нельзя.

Конструктор лендингов Instapage

Еще один инструмент для создания целевой страницы с drag-and-drop редактором — Instapage. Он подходит для тех, кто практически не имеет опыта в программировании или веб-дизайне.

Плюсы:

• Простой и понятный редактор целевых страниц.
• Можно создавать собственные блоки.
• Интегрированная статистика для лендинга.
• Подключение SSL-сертификатов.
• 200 готовых шаблонов.
• Можно дублировать уже созданный контент на других лендингах с помощью функции Instablocks.
• Доступно более 40 интеграций: Google Ads, Facebook Ads, LiveChat, Zendesk, Zoho, Salesforce и другие.

Минусы:

• Отсутствие интегрированного провайдера доменных имен.
• Ограничение на количество уникальных посетителей до 30 тысяч в месяц.

Конструктор лендингов Unbounce

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

Плюсы:

• Создание 75 лендингов с неограниченным количеством посетителей в самом доступном тарифе.
• А/В тестирование посадочных страниц.
• SSL-сертификаты.
• Более 100 шаблонов, оптимизированных под конверсию.
• Гибкий и удобный редактор, который позволяет кастомизировать шаблоны.
• Галерея всплывающих окон Unbounce Convertibles.

Минусы:

• Сложный для новичков.
• Мало обучающих материалов по работе с сервисом.

Конструктор лендингов Landingi

Плюсы:

• Нет ограничений на количество созданных лендингов.
• Drag-and-drop редактор и более 100 шаблонов.
• Быстрый экспорт лидов в CSV-файл или Google Sheets.
• Встроенная аналитика и построение отчетов.

Минусы:

• Мало опций для настройки всплывающих окон.
• Дизайн не всегда корректно работает в мобильной версии.

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

Центр компьютерного обучения «Специалист» при МГТУ им. Н.Э.Баумана

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

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

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

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

Онлайн-формат — будущее образования, «Специалист» остаётся с вами!

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

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

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

Источник — by Stian

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

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

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

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

Источник — by Achraf Elkaami

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

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

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

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

Источник — by Martin Strba for Balkan Brothers

Как создать одностраничник

Имеется четыре пути создания landing page:

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

Landing page рассматривается с трёх точек зрения:

Чтобы разработать посадочную страницу правильно самому надо придерживаться правил.

Заголовок

Часто заголовок называется оффер, так как он включает предложение, адресованное потенциальному клиенту

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

Если нужно пояснить заголовок или указать преимущества – используют подзаголовок.

Персонализация

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

Верная структура лэндинга

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

Нельзя перенасыщать дизайн landing page графикой или текстом: между ними должен быть оптимальный баланс.

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

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

Призыв к действию

Правильно сделанный landing page включает СТА или мотивирует к действию. Подобный призыв должен быть в хедере и в конце лэндинга. Иногда размещается с лид-формой.

Текст СТА-кнопки должен звучать так, как будто посетитель лэндинга произносит его в голове или озвучивать пожелание пользователя.

Лид-формы

Самостоятельно разработанный landing page содержит лид-форму

Она делается простой и не вызывающей вопросов, так как важно сотрудничество с потенциальным клиентом или его контакты

Счётчики

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

Дизайн landing page рассказывает о предоставляемой услуге. Лэндинг ориентируется на целевую аудиторию.

Бизнес-школа KOGIO

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

Сначала были просто сайты, потом появились магические landing page — посадочные страницы, которые начали завоевывать себе признание среди онлайн-маркетологов.

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

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

Что вы получите:

• Понимание анатомии landing page
• Стратегию создания посадочных страниц
• Техники привлечения и удержания внимания
• Особенности формирования доверия на landing page
• Умение измерять эффективность
• Способы оптимизации конверсии и тестирования гипотез
• Понимание особенностей психологии при создании лендингов
• Умение создать правильный текст

Создать сайт в бесплатном онлайн конструкторе сайтов LPBuilder.pro

Наш лучший конструктор сайтов – это настоящий подарок для всех, кто мечтает Создать свой уникальный сайт. Конструктор сайтов на русском языке и будет понятен каждому. Определитесь с темой, выберите нужные блоки (которых очень много и доступно более 300 штук), заполните иллюстрациями, текстами, мультимедиа — вот и все, Ваш продукт готов всего за 5 мин! Опубликовать сайт также будет легко: мы поможем разместить его на хостинге, поэтому Вы можете освободить себя от технических подробностей с заливкой сайта, мы сами сделаем это. И самое главное, что все это абсолютно бесплатно и Вам платить ничего не нужно. Создать свой сайт в нашем конструкторе сайтов это удобно, надежно, быстро. Наша квалифицированная поддержка всегда готова помочь с возникшими трудностями.

Курс по созданию конверсионных Landing Page

Курс разработан с основателем Платформы LP Максимом Демкиным и экспертом в создании конверсионных лендингов Дмитрием Борейчуком.

В результате занятия вы получите:

• Узнаете инструментарий для дизайна на Платформе LP
• Сделаете дизайн вашего лендинга или найдете исполнителя на дизайн
• Сделаете мобильную версию
• Научитесь добавлять скрипты
• Добавите скрипт «Блик на кнопку»
• Список бесплатных стоков с картинками для сайта
• Расширение «Пипетка»
• Ссылки на выбор исполнителей-дизайнеров на Платформе LP

После оплаты на указанную вами почту в течение 1 рабочего дня придет письмо с ссылкой на материалы курса. Ваш тариф в Платформе LP будет активирован в течение 3-х рабочих дней с момента оплаты.

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

Лендинг (landing page) – это продающий сайт, который состоит из одной или нескольких страниц, разделенных на блоки. В каждом блоке содержится определенная информация и призыв к действию. Также на лендинг пейдж обычно присутствуют формы заявок и контактные данные.

Лендинги бывают разные: одни предназначены для рекламы компании, другие – для продажи конкретных товаров. Всех их объединяет одно – лендинг должен продавать

Причем не так важно, что это будет – услуги, товары или бренд

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

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

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

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

Где еще быстро создать лендинг: 13 качественных сервисов

Это англоязычный конструктор. У него большая база (более 500 шаблонов), сконструированных для быстрого сбора лидов. Есть возможность менять контент в зависимости от пришедшей аудитории. Сервис предоставляет многопользовательское управление, что позволит управлять сайтом разным специалистам. Цены не самые гуманные для российских пользователей – 149 $ в месяц при годовой подписке. Но если нужен красивый лендинг с динамическим контентом, можно протестировать эту платформу.

Это также англоязычная платформа с большой базой шаблонов. Ее редактор напоминает фотошоп. Элементы добавляются путем перетаскивания, каждая деталь гибко настраивается. Всплывающие окна хорошо отображаются на разных устройствах. Лендинг можно интегрировать с MailChimp, подключать к Google Analytics, тестировать. Стоимость – от 29 $/мес. при годовой оплате. Тарифы ограничены количеством посетителей в том числе. 

Стандартный конструктор посадочных страниц, который на всех тарифах предлагает:

• Интеграцию с внешними сервисами, Google Analytics и Яндекс.Метрикой;
• Полную адаптивность;
• Добавление всплывающих лид-форм;
• Сбор базы подписчиков;
• Хостинг и домен.

Минимальная стоимость – 400 руб./мес. 

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

Примеры лендингов, созданные на Bloxy

Конструктор предлагает 1300+ шаблонов, которые поделены на сферы деятельности. Есть пустая страница, позволяющая собрать одностраничник с нуля. Конечно же, страницы адаптированы под мобильные устройства, есть виджеты и онлайн-оплата. Бесплатный тариф действует 2 недели, затем минимальная стоимость будет составлять 315 руб./мес. 

Здесь можно сделать лендинг с абонентской платой от 210 руб./мес. Есть бесплатный тариф с поддоменом, возможностью добавить 5 товаров и 20 фотографий. Доступно 100+ шаблонов.

Сайты интегрируются не только с CMR, но и “Мой склад”, СДЭК. Есть выгрузка товаров в Яндекс.Маркет. 

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

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

Можно подключиться к Bazium CRM, составлять свои формы. Содержание лендинга обойдется в 290 руб./мес. при годовой оплате. 

Конструктор предлагает посмотреть шаблоны лендингов и возможности редактирования до регистрации, что удобно. Базовый тариф стоит 190 руб./мес. В нем доступно 60+шаблонов, бесплатный домен (на год), но всего 50 Мб места на сервере. Платформа подойдет для стандартного лендинга, без тяжелой графики.

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

Платформа позволяет без регистрации просмотреть не только веб-версию шаблона, но и мобильную. Дизайны современные, отличаются простотой и большим количеством «воздуха». Стоимость начинается от 3.19 $/мес. 

Конструктор предлагает собрать лендинг самому на основе одного из 200 шаблонов или из 250 блоков. Есть AI-помощник, который будет подсказывать лучшие решения в процессе редактирования сайта. Создать посадочную страницу можно бесплатно на неограниченный период, правда, он будет на поддомене и содержать брендированную плашку Weblium.

Англоязычный конструктор с высокими ценами. Минимальный тариф составляет 80 $\месяц, причем действует ограничение по числу конверсий и посетителей. Сервис предоставляет качественные шаблоны, множество интеграций и аналитику.

Переходите на новый уровень

Да, обычно лендинг — это быстро и недорого. Но в любом правиле есть исключения. Например, компания S7 Airlines сделала необычную презентацию нового самолета — это интерактивная картинка гаража с Airbus A320neo. Дизайнер создал 3D-анимацию снятия покрывала с самолета, взлета и возможность прогулки по салону.

Посмотрите проект сайта на Behance.

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

Старайтесь удивлять пользователя. Не обязательно использовать технологии, которые стоят тысячи долларов. Съемка 3D-фотографии, пусть без динамики, сейчас стоит не очень дорого (можно найти варианты от 600–700 рублей), но этот эффект заставит пользователей запомнить ваш лендинг.

Как создать лендинг: советы профессионалов

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

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

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

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

Как сделать лендинг самому — подготовка контента

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

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

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

Работа над контентом при создании лендинга проходит в несколько этапов.

Этап 1. Сформулировать гипотезу

Если вы решили сделать лендинг, значит, у вас есть идея или представление о странице. Запишите их коротко по плану:

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

Этап 2. Изучить конкурентов

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

Как это сделать? Посмотрите, что предлагают в ответ на запросы поисковики Google или Яндекс.

Затем введите в строку поиска подходящие ключевые слова и изучите страницы конкурентов:

Конкуренты могут работать без сайта, продавая через соцсети. Поэтому есть смысл изучить предложения в Facebook, Instagram, «Вконтакте».

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

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

Этап 3. Описать целевую аудиторию и выделить сегменты

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

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

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

Как изучить свою аудиторию и найти сегменты:

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

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

Этап 4. Написать текст лендинга

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

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

Структура лендинга

Теперь время написать текст. Но не спешите открывать конструктор. Создайте прототип страницы в Google Docs, Word или напишите от руки. Так удобнее редактировать текст и лучше видно, где нужно изменить или добавить информацию.

Этап 5. Подобрать картинки, видео, фотографии

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

Фотографии товара можно попросить у поставщика или сфотографировать самому.

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

Интерактивные элементы

Кроме всего прочего в коллекции редактора конструктора Wix доступны интерактивные элементы, которые повышают конверсионность лендинга: таймеры, всплывающие формы и т.д.

Таймер обратного отсчета

Добавим на свой вариант посадочной страницы таймер. Для этого:

1. В меню слева переходим в раздел Wix APP Market, в поисковое поле вводим «таймеры» и выбираем Wix Countdown Clock.
2. Расположим таймер в блоке со второй мотивирующей надписью. После этого переходим в настройки элемента.
3. Здесь задаем дату окончания таймера, часовой пояс, дизайн и т.д.

Всплывающая форма лидогенерации

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

Для добавления на лендинг всплывающей формы:

1. В разделе бокового меню «Добавить» переходим в пункт «Интерактив» — «Промобоксы» — «Контакты» и выбираем нужный элемент.
2. В режиме промобокса удаляем все его содержимое.
3. После этого меняем фон промобокса.
4. Переходим на лендинг, копируем расположенную ниже форму для сбора пользовательских данных. Вставляем ее в промобокс.
5. Затем в настройках промобокса указываем, на каких страницах его отображать и с какой задержкой.

Настройка якорей и CTA-кнопок

На созданной нами странице присутствует три CTA-элемента. Кнопка «Позвонить» расположена в правом верхнем углу хедера и две кнопки «Погнали» на полосках с мотивирующими фразами. В их настройках можно задать следующие варианты перенаправления:

• На внешний интернет-ресурс.
• На страницу сайта.
• К определенному элементу лендинга (например, форме).
• К футеру или хедеру веб-страницы.
• На определенный документ (файл).
• К отправке электронного письма на заданный email-адрес.
• К звонку на указанный номер.
• На промобокс.

Кнопка «Позвонить»

Рассмотрим настройку кнопки «Позвонить». Для этого:

Теперь мобильные пользователи лендинга при нажатии на иконку телефона сразу смогут позвонить по указанному номеру.

Кнопки «Погнали»

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

1. В настройках кнопки кликаем по иконке ссылки, которая расположена внизу диалогового окна.
2. В списке «Куда ведет этот элемент?» выделяем вариант «Якорь». В параметрах справа выбираем страницу сайта и элемент (лид-форма), на который будет указывать кнопка.
3. Сохраняем внесенные изменения.

Вторую кнопку «Поехали» привяжем к промобоксу. После этого нажатие на кнопку будет открывать всплывающее окно, которое мы создали ранее. Для этого:

1. Переходим в настройки кнопки и в списке «Куда ведет этот элемент?» выделяем вариант «Промобокс» и справа выбираем нужный элемент.
2. Нажимаем «Сохранить».

Заключение

Конструктор лендингов вам подойдет в случае, когда:

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

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

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

Simpoll.ru

Заключение

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

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

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

Если вы хотите создавать не только лендинги, но и информационные проекты для заработка, то я рекомендую вам посетить курс Василия Блинова «Как создать сайт». На нем вы узнаете, как можно сделать крутой сайт и зарабатывать на нем от 20 000 рублей в месяц пассивно.