Что такое лендинг пейдж — как создать, примеры, конструкторы

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

Здравствуйте, уважаемые читатели Делай Бизнес.ру! Если Вы не знаете, что такое Лендинг (landing page), то советую прочитать эту статью до конца и вот почему.

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

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

1. Что такое Лендинг (landing page) — обзор понятия

Landing page (пер. с англ.: посадочная страница) — это специально разработанная веб-страница, созданная для реализации единичного товара, услуги.

Главная её задача — заинтересовать потенциального клиента и не отпускать до момента получения необходимого результата (звонок, подписка, покупка товара и т. п.)

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

2. Чем отличается обычный сайт от лендинг пейдж?

Лендинг пейдж и главная страница сайта имеют много различий:

  1. Лендинг — это, как правило, одна единственная страница.
  2. На посадочной странице отсутствует меню, ссылки и прочие характерные для главной страницы сайта атрибуты.
  3.  Она изначально разрабатывается для повышения конверсии. Правильно сделанный одностраничник, позволяет увеличить продажи в несколько раз. Конверсия может составлять 20-30% и более.
  4. В отличие от обычных сайтов, на landing page сжато отображена только та информация, которая побуждает посетителя выполнить необходимое действие.
  • При создании лендинга, необходимо чётко следовать структуре построения, грамотно используя весь набор стандартных ключевых компонентов.
  • Обычно Landing Page состоит из следующих элементов:

Заголовок

Заголовок должен содержать: суть предложения, быть «цепляющим», привлекать внимание, создавать интригу, предлагать решение проблемы:

Например: «Как получать до 170 000 рублей в месяц с одного аквариума-автомата?»

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

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

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

Картинка

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

Продающий текст

Основной элемент landing page — это продающий текст.

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

Кнопка заказа

Кнопка заказа — это финишная прямая лендинг пейдж, «вишенка на торте», то ради чего он и создается, только после того, как пользователь нажал на кнопку, он становится клиентом.

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

5. Разновидности целевых страниц

Все landing page, в зависимости от поставленной цели, можно разделить на четыре типа:

1. Страница для сбора данных или лидогенерирующая страница (lead-capture page)

Основная цель такой страницы, собирать данные о посетителе, как правило, это: E-mail, Ф.И.О. или телефон. Получив контактные данные, компания начинает обработку пользователя и с помощью E-mail рассылки, звонков, превращает его в клиента.

2. Однокликовая страница

Однокликовая страница (clik-trough page) — это самый простой тип. В отличие от других landing page, на такой странице нет лид-формы для сбора информации, а единственным интерактивным элементом является кнопка заказа.

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

3. Продающая страница

Страница продажи или продающая страница (sales page), содержит полную информацию о продукте, его цене и кнопку «Купить», нажав которую открывается форма оплаты. Моментально продать продукт — вот главная задача такой страницы.

4. Страница захвата контакта

Единственная цель страницы захвата — это сбор E- mail адресов посетителей.

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

6. Выбираем лучший конструктор лендингов

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

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

Вот список самых популярных конструкторов landing page:

Ukit

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

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

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

Бесплатный тестовый период — 14 дней, затем необходимо выбрать один из четырёх платных тарифов, стоимость самого дешевого составляет — 4$ в месяц.

Flaxbe

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

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

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

Бесплатный тестовый период — 14 дней, стоимость ежемесячной подписки начинается от 750 рублей и за эти деньги вы получаете: возможность создать 10 лендингов, домен в зоне .ru или .рф в подарок, почтовый ящик, 250 sms-уведомлений и SSL сертификаты (https://). При оплате годовой подписки, полагается 30% — я скидка.

LPmotor

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

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

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

За это вы получаете: возможность создать до 50 лендингов, три домена, адаптивный дизайн под мобильные устройства, встроенную систему учёта и ведения клиента (CRM — система), возможность принимать онлайн-оплату, А/Б тестирование и много других приятных «плюшек».

LPgenerator

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

LPGENERATOR — хороший конструктор с 7-ми дневным бесплатным периодом тестирования. Большое количество современных уникальных шаблонов, хорошая тех поддержка и обучение. Для новичков будет немного сложноват, а вот для людей поопытнее подойдёт идеально.

Тарифы начинаются от 559 рублей за месяц.

Особенность этого сервиса в том, что он заточен исключительно под создание лендингов.

Wix

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

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

Создать и опубликовать продающую страницу на Wix, можно действительно бесплатно. Вы получите бесплатный хостинг, 500МВ дискового пространства для хранения информации, возможность добавлять свыше 250 приложений из Wix AppMarket, но при этом, на вашей странице будет размещена сторонняя реклама и вы получите домен вида: имяпользователя.wixsite.com/название сайта.

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

Заключение

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

  1. Один лендинг → один продукт → одно целевое действие.  Размещайте один продукт и ведите клиента по «воронке продаж», не стоит размещать на одной странице несколько продуктов, иначе в погоне «за двумя зайцами» не поймаете и одного.
  2. Цепляющие заголовки и чёткий, ясный призыв к действию, пользователь должен понимать, чего вы от него хотите.
  3. Яркая кнопка с призывом к действию (нажать, купить, подписаться).
  4. Уникальный и интересный дизайн, ещё одно обязательное условие при создании качественного лендинга.
  5. Информация о продавце и наличие отзывов, убедят посетителя в вашей надёжности.
  6. Формы для заполнения информации должны быть максимально простыми.
  7. Не перегружайте landing page лишней информацией, больше свободного пространства — вот залог успеха!
  1. Дорогие друзья, соблюдая этот нехитрый свод правил, вы с лёгкостью сможете построить отличный лендинг с высокой конверсией.
  2. Желаю вам удачи и успехов!
  3. Если остались вопросы или вы хотите поделиться своим опытом создания landing page — пишите в комментариях.

До встреч, на страницах бизнес-блога Делай Бизнес.ру.

С вами был, Виктор Васильев.

Источник: https://DelayBusiness.ru/chto-takoe-landing-page-opisanie-i-primery/

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

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

Что такое лендинг и для чего он нужен

Лендинг пейдж (landing page) это страница для продвижения товара или услуги. Она призвана «направить» посетителя на совершение определенного действия:

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

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

Синонимы: одностраничный сайт, одностраничник, лендинг пейдж, посадочная страница, landing page, целевая страница.

Делать самостоятельно или заказать работу «под ключ»?

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

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

Реальность: сделать хороший, рабочий лендинг не сложнее чем создать страничку в социальной сети.

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

Предположим:

  1. вы новичок в бизнесе;
  2. хотите протестировать новую нишу;
  3. у вас небольшой стартовый капитал.

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

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

Единственное, что вам действительно необходимо — это знание своего продукта: его достоинств, недостатков и целевой аудитории.

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

Помните, что если вы решили заказать лендинг «под ключ», вам нужно составить как можно более точное ТЗ и согласовать все детали с разработчиками.

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

LPMotor — самый лучший конструктор одностраничников

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

Читать подробный обзор Создать лендинг на LPMotor

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

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

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

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

На сайте отсутствует бесплатный тариф. Есть возможность подключить четыре платных тарифа (цены при оплате за год):

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

При оплате за год вы получите скидку 40%.

Оплатить услуги и тарифы платформы можно с помощью банковской карты, через Сбербанк Онлайн, Альфа-клик, посредством перевода через Связной, Евросеть, МТС, Теле2 и Билайн. Поддерживаются электронные кошельки: Яндекс.Деньги, QIWI, Webmoney.

Bloxy — стильный и современный

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

Создать лендинг прямо сейчас

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

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

Пользователю предлагается три тарифных плана:

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

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

Источник: http://www.bestseoblog.ru/kak-samomu-sozdat-lending/

Лендинг — что это такое простыми словами и 12 советов по созданию landing page в примерах

Здравствуйте, уважаемые читатели блога KtoNaNovenkogo.ru. Сегодня мы поговорим о такой важной вещи как посадочная страница, которую очень часто на буржуйский манер называют лендинг пейдж (от английского landing page — целевая страница). Что же это такое и почему это так важно?

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

Что такое лендинг пейдж и почему это так важно

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

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

В чем может быть дело?

Обратите внимание

Скорее всего, вы забыли продумать и подготовить приземляющие (посадочные, целевые) страницы, которые часто называют лендингами. Что это такое?

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

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

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

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

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

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

Примеры лендингов

В зависимости от преследуемых вами целей можно разделить посадочные страницы (лендинги) на несколько типов:

  1. Подписная страница — ее задача сводится к получению Емайл адреса зашедшего на нее пользователя. С помощью нее собирается база, на основании которой уже потом, средствами Емайл маркетинга, из попавшего в сети пользователя будут пытаться сделать клиента или покупателя.
    Приманкой на такого рода посадочных страницах, обычно, служит какой-нибудь бесплатный курс, бесплатная консультация или другая полезная информация, которая может показаться интересной пользователю, попавшему на такой лендинг. Единственным препятствием на пути к вожделенной халяве будет стоять необходимость указать свой Емайл адрес, что, по сути, мало кого останавливает.
  2. Товарная посадочная страница (landing page) — служит непосредственно для продажи товара. Фактически это продвинутая (расширенная) карточка товара, которую вы можете встретить в любом интернет-магазине. Тут будет и кнопка «Купить», и описание товара, а также условия доставки, контактный телефон и тому подобная информация.
  3. Лендинг по услугам — аналог товарного, но только продать тут пытаются услугу. Правда, вместо кнопки «Купить» на первый план тут уже выдвигается контактный телефон, по которому предлагается заказать данную услугу или получить по ней дополнительную информацию. Ну а другие атрибуты похожи на предыдущий тип посадочных страниц.
  4. Брендовая посадочная страница — позволить себе такую роскошь могут только крупные бренды (например, Эпл или Самсунг), ибо на ней не ведется продажа рекламируемого товара или продукта, а просто доносится информации о его появлении или обновлении. Барыши собираются с увеличения общего роста продаж данного продукта или услуги.

12 шагов по созданию идеального лендинга

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

  1. Каждый лендинг должен быть заточен только под одно целевое (конверсионное) действие — либо подписка, либо продажи. Не надо жадничать, ибо внимание пользователя будет рассеяно и сильно увеличится вероятность его ухода (так ничего и не выбрав из предложенных вариантов). Лучше как можно меньше заставлять клиентов думать и выбирать — путь конверсионной воронки на landing page должен быть прямым как стрела (очевидным для него) и без каких-либо ответвлений.
  2. На посадочной странице обязательно должен присутствовать призыв к действию (с глаголами в повелительном наклонении — позвони, купи, получи, приди и т.п.). Фразы должны быть короткими и мотивирующими. Например, «купите сейчас», «получить видеокурс» или «подпишись и получи».
  3. Рулят также яркие кнопки и стрелки, создающие на них акцент. Неплохо работают кнопки красных и желтых оттенков, ибо заметны и содержат как бы призыв к действию.

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

    Иногда очень неплохо работают анимированные кнопки (но в любом случае нужно будет проводить тестирование эффективности тех или иных элементов лендинг пейджа):

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

    или так

  6. На вашей landing page должны быть не только призывы к действию и эффектные заголовки, но и аргументация необходимости подписки, покупки, заказа или звонка. В случае страницы подписки это может быть, например, небольшой видеоролик с описанием и содержанием «халявы», или все то же самое оформлено в виде краткого списка (перечня). В случае продажника это тоже может быть видеоролик с обзором товара, списком тех услуг, которые вы предлагаете (в том числе и ваши конкурентные преимущества).
  7. Очень хорошо на посадочных страницах работают отзывы от уже состоявшихся клиентов, покупателей или подписчиков (лучше, если при этом будут указаны какие-то контакты тех, кто эти отзывы оставил, чтобы все выглядело правдоподобно).
  8. Также неплохо работают на посадочных страницах сравнения «до и после». Не для всех тематик это применимо, но в области похудения, косметологии, фитнеса и многих других ниш это можно с высокой эффективностью использовать. Например, так делает фирма, предоставляющая услуги ресторации.
  9. Страница landing page может быть довольно длинной, но при просмотре первого экрана (это та область страницы, что видна без использования прокрутки) пользователю должно быть совершенно ясно и понятно, что именно вы хотели ему сказать.
  10. Для стимулирования подписчиков или покупателей некоторых товаров (например, инфопродуктов и прочих вариаций инфо-бизнеса) можно использовать вариант дополнительных бонусов, которые получит подписчик или покупатель при заказе. Когда пользователь находится на грани принятия решения, то как раз такие «плюшки» могут перевесить чашу весов в вашу пользу.
  11. Ну и, конечно же, стоит делать упор на то, что «только здесь и только в течении нного количества времени» пользователю будет доступно все это великолепие (подписка, специальная цена на товар, дополнительный набор услуг). Как это сделать лучше всего? Правильно, поставить таймер, ведущий обратный отчет времени до часа Х, когда предоставленная возможность будет упущена. Ничто так не стимулирует к принятию решения колеблящегося пользователя, как буквально на глазах убегающие секунды.
    Рядом с таймером неплохо будет расположить форму подписки, заказа или контактный телефон. Это будет работать не всегда, поэтому надо проводить тесты (думаю написать ряд статей про проведение А/Б-тестирования — если не хотите пропустить, то подписывайтесь на рассылку), и возможно, что такой простой и очевидный способ позволит вам увеличить конверсию данной лендинг пейдж и с лихвой окупить деньги, потраченные на продвижение в социальных сетях или контекстной рекламе.
  12. Пользователи также хотят знать, кто именно им предлагает данный товар, услугу, видеокурс и т.п., поэтому необходимо в лендинге указывать информацию об авторе, магазине, фирме.
    Естественно, что хорошо было бы при этом упомянуть достоинства, достижения, конкурентные преимущества, но не перехваливайте себя, дабы не перейти ту грань, за которой уже снижается доверие к опубликованной информации.
Читайте также:  Кто такие бизнес-ангелы - список топ-10 в россии, как найти и привлечь

Примеры ошибок делающих landing нерабочим

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

  1. Еще раз напоминаю, что в интернете практически никто не читает (во всяком случае вновь открытую страницу), а именно просматривает информацию. Если она окажется действительно стоящей и требующей более детального изучения, то тогда уже доходит дело и до прочтения (в общем-то, так же как и с газетами). Поэтому не допускайте перегруженности лендинга информацией — это может дезориентировать пользователя и вызвать реакцию отторжения еще до того момента, когда он разберется о чем там идет речь.
  2. Текст должен быть небольшого объема, максимально лаконичен и наполнен информацией, а не водой. Пару абзацев «ни о чем» вызовут у пользователя бурное желание закрыть такую посадочную страницу. На landing page также плохо работает мелкий шрифт. В общем-то, его использование и не нужно, ибо для изложения сути много слов не потребуется.
  3. Не обманывайте ожидания пользователя. Если в рекламе или в посте в социальной сети вы говорили об одном, а при попадании на лендинг пользователь видит несколько другое, то происходит утрата доверия и резко снижается конверсия. Очень важно следить за этим соответствием.
  4. Дизайн посадочной страницы на самом деле очень важен.

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

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

    Опять же, определить лучший вариант вам поможет тестирование и анализ статистики, например, через Вебвизор из арсенала Яндекс Метрики (зачастую не все так очевидно, как может показаться).

    Важно

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

У вас есть еще немного времени? Хотите его провести с пользой? Тогда берите попкорн, садитесь поудобнее и смотрите двухчасовой мастер-класс «Пошаговый алгоритм создания Landing Page»:

Удачи вам! До скорых встреч на страницах блога KtoNaNovenkogo.ru

Что такое Лендинг Пейдж - как создать, примеры, конструкторы

  • * Нажимая на кнопку «Подписаться» Вы соглашаетесь с политикой конфиденциальности.
  • Подборки по теме
  • Использую для заработка

Рубрика: Используем соцсети, Продвигаем бизнес-сайты

Источник: https://KtoNaNovenkogo.ru/seo/smo/prodvigatsya-socsetyax-12-sovetov-sozdaniyu-lendinga-posadochnoj-stranicy.html

18 примеров лендингов с интересным дизайном и необычными фишками

Главная проблема большинства современных лендингов – все они будто сделаны под копирку. А где же креатив, огонь, где дизайнерские безумства?

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

Смотрите, вдохновляйтесь, применяйте понравившиеся идеи на практике, миксуйте их со своими и не забывайте проводить A/Б-тестирования – вот единственно правильный рецепт создания убойных посадочных страниц.

Расширенная форма

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

Но в некоторых сложных сферах лучше раскрыть тему подробнее. Вот как это сделали в «Текстерре»: в форме лендинга dellservers.ru клиент может выбрать модуль, параметры, задачи сервера.

Может сбросить значения, если что-то пошло не так.

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

Две кнопки СТА

На лендинге планировщика задач wunderlist.com/ru – сразу два призыва к действию, которые усиливают друг друга: «Создать бесплатную учетную запись» и «Загрузить Wunderlist». Пользователи кликают по обеим ссылкам, конверсия растет, а лендинг выполняет свою работу на отлично.

Конкретные цифры (результаты)

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

Мы делаем лендинги с учетом интересов ЦА и юзабилити. 7 дней – и посадочная готова. Обращайтесь!.

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

Безликие шаблонные лендинги – бр-р, что может быть унылее! Оживите свой одностраничник, добавьте огня, заинтересуйте потенциального клиента.

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

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

Удобная форма ответа

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

Иногда вообще приходится вводить капчи и коды – ужас! Понятно, что это делается для того, чтобы получить лиды. Но есть и другой вариант – как на лендинге «Церебро Таргет».

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

Отзывы клиентов

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

Читайте также:  Лизинг авто для физических лиц - что это, условия, плюсы и минусы

Лучше пойти дальше и убедить посетителей в этом. На лендинге huskypark.info, который разрабатывала «Текстерра», приводятся слова клиентов из «Инстаграма» со ссылками на их аккаунты.

Все честно – зайдите и убедитесь.

Демонстрация результатов

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

Параллакс-эффект

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

Анимация

Вообще, у анимации функций много. Движущиеся картинки и предметы привлекают и удерживают внимание пользователя, направляют его взгляд на самые важные элементы лендинга (кнопку СТА, таймер, виджет и так далее), частично заменяют текст. Один из примеров – на сайте madwell.com. Пройдите по ссылке – цепочки двигаются. И мало того что двигаются – слушаются каждого движения мышки.

Внимание, вопрос: какую функцию выполняет эта анимация? Ответить можно в комментариях к статье.

Иллюстрации

Не будем говорить банальности: авторские иллюстрации способны оживить самый тухлый шаблонный лендинг, это все знают. Важно, чтобы рисунки отвечали тематике лендинга и ожиданиям его целевой аудитории. Смотрите: на сайте полезного детского питания marcandfisa.com картинки стилизованы под детские рисунки. Точное попадание в ЦА – мамам и папам, которые покупают продукцию, должно зайти.

Еще один пример на лендинге satellite-express.ru. Иллюстрация идеально дополняет заголовок: «Главное при диабете – найти баланс».

Мультилендинги

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

Вот пример мультилендинга для компании «Овионт», который сделали мы.

Клиент планировал сделать отдельные лендинги для трех продуктов: инструментов автоматизации делопроизводства.

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

Для каждого продукта мы сделали подробные разделы. Общий объем контента на мультилендинге – примерно 30 тыс. знаков. На каждой странице есть подробные разделы:

  • описание функциональности;
  • дополнительные модули;
  • частые вопросы по использованию;
  • тарифы;
  • отзывы.

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

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

Нover-эффект

При наведении курсора картинки меняют цвет, увеличиваются, приближаются и удаляются. Это делает лендинг необычным и привлекает внимание к отдельным его элементам. Если навести курсор на строку «Фотографии и общение с хаски» – появится фотография собачки. На строку «Семейная беседка-гриль» – интерьер этой самой беседки, и так далее.

Сплит-макеты

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

Трехмерная графика и дополненная реальность

Лендинг создан для приложения Qubi. Это игра для детей 3+ лет и взрослых. Суть игры проста. На первом шаге пользователь по предложенной схеме склеивает реальный бумажный, картонный или деревянный кубик.

Потом он устанавливает приложение, открывает его на смартфоне и «смотрит» на кубик через камеру устройства.

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

Трехмерную модель кубика можно увидеть на иллюстрации (gif).

Что хотел клиент

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

Что мы сделали

Мы реализовали трехмерность с помощью 3D-трансформаций CSS3. Переходы между гранями кубика сделаны с помощью чистого JavaScript с отслеживанием событий drag и touch. Благодаря необычным переходам между экранами у пользователя создается ощущение объемности экрана. Это особенно ярко выражено на рабочей версии посадочной страницы.

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

Лендинг полностью адаптивный.

Интерактивный выбор цветов окраски интерьера и мебели

Необычность лендинга «ДСК.Color» заключается в возможности самостоятельно выбрать цвет мебели и предметов интерьера с помощью интерактивной палитры.

Компания «ДСК.Color» окрашивает любые поверхности в разные цвета. Можно заказать окраску мебели, бытовой техники, велосипедов, музыкальных инструментов и других предметов. Клиент может выбрать любой цвет.

Самая востребованная услуга – окраска мебели и предметов интерьера. На нее приходится около 80 % работ клиента.

Что хотел клиент

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

Что мы сделали

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

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

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

Совет

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

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

Необычные и обычные прелоадеры

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

Что такое прелоадер и какие задачи он решает

Прелоадер или спиннер – знак, который появляется на экране до загрузки страницы. Эти элементы вы видите ежедневно, когда пользуетесь интернетом. Ниже пример прелоадера.

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

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

Прелоадеры реализуются с помощью стандартных инструментов фронтенд-разработки: HTML, CSS, JavaScript и дополнительных библиотек и фреймворков, например, jQuery, React.

Как мы улучшаем лендинги с помощью прелоадеров

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

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

На сайте Levellen Interiors мы использовали прелоадер в виде логотипа компании. Это дополнительный элемент брендинга сайта.

На лендинге Whalenet можно увидеть спиннер в виде бирюзового прямоугольника.

На сайте Parielle работает классический прелоадер в форме круга.

На лендинге Projectto использовали прелоадер в форме прямоугольника.

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

Интерактив

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

Как работает лендинг

На лендинге представлена информация об аренде помещений в бизнес-центре. Главный секрет посадочной страницы находится в разделе «Офисы». Здесь пользователь может посмотреть наличие свободных офисов на каждом этаже здания.

При наведении курсора на свободный офис всплывает кнопка «Подробнее».

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

Особенности реализации

Наш дизайнер нарисовал формы офисных помещений, рисунки сделаны в формате svg. Эти рисунки накладываются на планы этажей.

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

Когда администратор отмечает, что офис занят, скрипт отключает изображение рисунка на плане.

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

В этом примере нет сложных технических фишек и дизайнерских эффектов – весь лендинг вывозит красивая картинка: фон, цвета, аппетитные фотографии астраханской икры. Одностраничник astrahancaviar.ru – хороший пример того, как благодаря дизайнеру продукт хочется приобрести. И немедленно съесть!

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

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

12-primerov-velikolepnykh-lendingov-cherpaem-vdokhnovenie-u-professionalov

Источник: https://TexTerra.ru/blog/12-primerov-velikolepnykh-lendingov-cherpaem-vdokhnovenie-u-professionalov.html

Ссылка на основную публикацию