Создание лендинга что это такое

Как сделать лендинг самому. Пошаговая инструкция (2019)

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

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

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

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

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

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

Пример лендинга

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

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

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

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

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

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

Поиск вариантов ключевых слов в Google Adwords

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

Рекламные объявления компаний по запросу «беседка для дачи»

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

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

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

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

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

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

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

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

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

Пример отзыва на сайте магазина настольных игр

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

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

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

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

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

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

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

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

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

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

Нельзя просто взять фотографию из поиска — это нарушение авторских прав. В лучшем случае автор фотографии напишет вам и попросит заменить или оплатить фото. А может и подать в суд. Бесплатно можно использовать фотографии с лицензией Creative Commons. Подробно о лицензии Creative Commons и ее типах мы писали в одной из прошлых статей.

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

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

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

Сделать лендинг бесплатно можно с помощью конструкторов:

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

Зарегистрироваться на сайте и ознакомиться с подсказками

После регистрации сервис сразу предложит вам создать сайт.

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

Справочные материалы на сайте Tilda

Создать сайт

Придумайте название сайта. Это рабочий вариант, он виден только вам:

Создание сайта в конструкторе Tilda

Выбрать шаблон

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

Выбор шаблона на сайте Tilda

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

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

Шаблон «Ремонтная компания» для создания страницы

Вставить свой текст и фотографии

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

Шаблон со своим текстом и фотографией

Опубликовать сайт

Когда все отредактировано, нажимаем «сохранить» и смотрим результат.

Если результат вас устраивает, ссылки работают, можно публиковать страницу в интернете и запускать рекламу.

На бесплатном тарифе адрес страницы будет иметь такой вид:

Бесплатный адрес сайта на субдомене Tilda

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

Как увеличить конверсию лендинга

На лендингах используются два подхода к продажам. Первый — сразу предложить купить товар или услугу. Он подходит для недорогих товаров и услуг или если клиент уже «прогретый», например, пришел с рассылки либо профиля в Instagram.

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

Email рассылки

Рассылки помогают прогреть посетителей, которые пока не готовы к покупке. Вы можете добавить на лендинг форму подписки из SendPulse. Тогда контакты подписчиков будут сразу попадать в сервис. В справочном разделе Tilda описано, как вставить на страницу форму подписки SendPulse и собирать email адреса потенциальных клиентов.

Автоматические серии писем

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

Чтобы настроить авторассылки, нужно зайти в SendPulse и выбрать раздел «Авторассылки»:

Создание автоматических рассылок в SendPulse

Web push уведомления

Еще один способ повысить конверсию лендинга — настроить web push уведомления. Когда посетитель находится на странице, в браузере появляется предложение подписаться на уведомления:

Предложение подписаться на push уведомления

Если человек нажимает «разрешить уведомления», он в будущем будет получать сообщения в браузере или на рабочем столе компьютера.

Web push уведомления помогают решить несколько задач:

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

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

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

Регистрируйтесь в SendPulse, чтобы повышать конверсию лендинга с помощью рассылок и push уведомлений и превращать посетителей в покупателей!

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

Источник

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

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

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

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

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

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

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

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

Узнайте вашу целевую аудиторию

Поймите, как работает текст лендинга

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

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

PickEvent — отличный пример длинного лендинга.

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

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

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

Чем больше времени, энергии, нервов или денег нужно потратить человеку, тем длиннее должен быть лендинг.

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

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

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

Разбейте текст на части

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

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

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

У вас может быть только одна цель

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

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

Коэффициент внимания

Коэффициент внимания вашего лендинга равен тому, сколько у вас на странице ссылок на число целей конверсии (которое всегда должно быть равно 1). Поэтому чем больше на странице ссылок, которые не ведут непосредственно к цели, тем выше коэффициент внимания. В идеале, он должен быть равен 1:1.

Именно поэтому нужны лендинги, вместо того чтобы отправлять людей просто на главную страницу. На главной странице коэффициент внимания может быть равен 10:1, 25:1 или даже 100:1. Это значит, что, помимо вашей основной цели, за внимание пользователя будут бороться слишком много вещей.

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

Изучите конкурентов

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

После этого вы можете решить, насколько вы хотите отличаться от нормы в индустрии. Или несильно, или вы можете сделать что-то совершенно другое.

Откуда идёт траффик?

Траффик на посадочную страницу обычно идёт с одного из двух источников. Это оплачиваемая реклама или PR/ маркетинговая кампания.

Текст должен совпадать

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

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

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

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

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

Первое впечатление важнее всего

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

Например, главная страница Ghost. Это отличный пример хорошего первого впечатления, в котором есть все упомянутые элементы.

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

Вся цель лендинга заключается в том, чтобы побудить пользователей к определённому действию. Поэтому призыв к действию — это самый важный элемент на странице. Чаще всего это кнопка, иногда — ссылка или форма. Оптимизируя только один этот элемент, вы можете значительно увеличить конверсию. На призыв к действию влияют несколько факторов. Это дизайн (кнопки, формы или ссылки), расположение на странице, текст призыва и окружающий контент.

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

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

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

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

Считается, что красный цвет означает «опасность» и заставляет пользователя остановится. Но исследования показали, что в некоторых ситуациях красный цвет может превзойти зелёный. Сайту Performable удалось увеличить конверсию на 21 %, изменив цвет кнопки с призывом к действию с зелёного на красный. Одно из возможных объяснений кроется в том, что на всей странице активно используется зелёный цвет, поэтому зелёная кнопка не была такой контрастной, как красная.

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

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

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

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

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

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

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

Хороший пример — сайт Dropmark. Заголовок «Все ваши вещи в одном простом, визуальном, личном месте» (“All your stuff in one simple, visual, private place”) передаёт основные преимущества сервиса и при этом остаётся ясным и понятным.

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

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

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

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

Стоковые фотографии против обычных

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

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

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

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

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

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

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

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

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

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

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

A/B тестирование

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

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

Установите аналитику важнейшей информации

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

Инструменты для создания более эффективных лендингов

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

Unbounce

Unbounce даёт инструменты для создания, публикации и A/B тестирование лендингов без необходимости писать код. Стоимость тарифных планов начинается от 49$ в месяц и включает бесплатную пробную версию в течение 30 дней.

Convert

Convert — это приложение для проведения A/B тестов. Тесты можно создавать с помощью визуального редактора, а также с доступом к HTML и CSS. Для использования тестов на сайте нужно вставить небольшой кусок кода. Приложение незаметно интегрируется с Google Analytics. Цены начинаются от 125$ в месяц, есть 15-дневная пробная версия.

Optimizely

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

Visual Website Optimizer

Visual Website Optimizer — ещё одно приложение, которое помогает оптимизировать и персонализировать лендинги. Оно включает такие функции, как A/B тестирование, раздельное тестирование URL, многовариантные тесты, обратная связь, анализатор лендинга, тепловые карты и многое другое. Тарифы начинаются от 49$ в месяц, есть бесплатная пробная версия.

Instapage

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

Lander

Lander помогает создавать лендинги специально для малого бизнеса. В приложении есть простой редактор, функция A/B тестирования и интеграция с Facebook Pages. Цены начинаются от 22$ в месяц, сервис можно попробовать бесплатно в течение 30 дней.

HubSpot Landing Pages

HubSpot Landing Pages позволяет создавать лендинги за секунды и тестировать их часто и рано. В приложении есть редактор drag & drop, умные формы, адаптивные страницы, умный контент и многое другое. Это часть приложения HubSpot Marketing, стоимость которого начинается от 200$ в месяц.

Эксперименты Google Analytics

Эксперименты Google Analytics позволяют протестировать различные варианты страницы в зависимости от ваших пользователей. Они входят в аккаунт Google Analytics.

Usability Hub

Usability Hub — это сайт, где вы можете протестировать ваш дизайн или макет на реальных людях. Загрузите ваш дизайн, выберите тип теста (5-ти секундный тест, клик тест, тест предпочтения или навигации), они покажут его своим пользователям, и вы получите детальный отчёт о результатах. У них есть бесплатный план (чтобы провести тесты, вам сначала нужно самим в них поучаствовать) или платный от 99$ в месяц.

10 примеров отличных лендингов

Basecamp

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

Benchmark

Главная страница Benchmark — ещё один пример отличного лендинга. Несмотря на то, что навигация вверху увеличивает коэффициент внимания, вся остальная страница ясно рассказывает о продукте и о его преимуществах. Текст кнопки («Начните бесплатную версию») также является достаточно убедительным.

Manpacks

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

WebDAM

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

Shopify

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

Invision

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

Stripe

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

Evernote

Лендинг Evernote для функции Work Chat использует очень ясный призыв к действию: «Попробовать Work Chat» на кнопке, которая выделяется на странице. Все изображения подходящие и призваны поддержать цели конверсии.

SuperTasker

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

Acorns

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

Посадочная страница против главной

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

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

Очень хороший пример — главная страница Flow. Она выглядит как обычный лендинг, с чётким призывом к действию и длинным текстом в поддержку конкретной цели конверсии. За исключением нескольких ссылок в шапке (Pricing, Features, Blog и Log In) коэффициент внимания остаётся равным 1:1.

Лучшие практики по созданию лендингов

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

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

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

Источник