Каким должен быть лендинг: как сделать посадочную страницу. Для чего нужны посадочные страницы? Добавляем интерактивные элементы

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

Первая, и, пожалуй, наиболее важная, задача - найти четкое УТП (уникальное торговое предложение) товара или услуги, а затем использовать дизайн посадочной страницы, чтобы сосредоточить все на одном основном призыву к действию (СTA). Это может быть предложение посетителю зарегистрироваться или же сделать мгновенную покупку. Какова бы ни была цель, это работа дизайна страницы направить пользователя к ней – будь то за счет использование белого пространства, контрастных цветов или более четких направленных сигналов.

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

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

Таинственная «капля» нарушает большинство правил обычного дизайна посадочной страницы

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

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

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

Каждая панель - это искушение

С его аккуратно расположенной сеткой великолепных изображений, сайт Present & Correct несомненно достигает своей основной аудитории – людей, для которых канцелярские принадлежности являются настоящим фетишем.

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

Лендинг, который рассказывает о силе типографики

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

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

LS Productions заманивает в кавалькаду шикарных мест Шотландии

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

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

O"Neill – страница идеально продающая мечту о снеге и серфинге

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

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

Вы просто не можете пропустить призыв к действию на посадочной странице Bear CSS

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

Основной призыв к действию «загрузи HTML» - это большая кнопка оранжевого цвета на бледно-сером фоне, под тремя маркированными пунктами, объясняющими весь процесс. И только в случае, если вы пропустите ее, талисман Bear CSS указывает лапой прямо на нее с другой стороны экрана.

Squarespace знают своих основных заказчиков и создали свою страницу в соответствии с ними

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

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

Выделяющийся золотой призыв GiftRocket к действию привлекает внимание мгновенно

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

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

Одностраничник показывает, что приложение может предложить

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

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

Не нужны безделушки - теперь Square имеет свое программное обеспечение POS

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

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

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

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

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

Эффективные посадочные страницы

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

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

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

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

Конверсия посадочной страницы

Компания Mnogoland представляет примеры посадочных страниц с высокой конверсией в разделе «Наше портфолио». Это одностраничники «Пепси», «Мобильные аксессуары», «1 C Bitrix», «ФК Мерабелья», «Мида». На этих лэндингах, благодаря работе нашей команды, конверсия составляет от 20 до 50%. А число заявок в день приближается к полусотне.

Есть компании, которые обещают клиенту нереально большую конверсию за первую же неделю существования ресурса чуть ли не + 1000. Задумайтесь, конверсия посадочной страницы зависит от многих факторов. Если вам пообещали невероятно высокую прибыль, но при этом не дали никаких гарантий, сразу отворачивайтесь от предложения. В компании Mnogoland дают гарантию на минимальную конверсию до 10%. При этом, после сдачи проекта наши специалисты «не бросают» клиента наедине со своими проблемами. Постоянно проводят анализ работы, продолжают продвижение посадочной страницы, Проводят постоянное тестирование эффективности, разбираются в причинах низкой конверсии и постоянно проводят мероприятия по повышению уровня продаж.

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

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

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

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

Посадочные страницы. Стоимость успешного проекта

«Сколько стоит посадочная страница» - один из самых часто задаваемых вопросов. Предлагаем не тратить время в поиске реальных цифр, перерывая многочисленные сайты, выданные поисковой системой. Чаще всего вы найдете размытую формулировку, а конкретики никакой. Наша служба поможет вам выяснить конкретную стоимость посадочных страниц проекта. Запросы у бизнесменов разные, каждый занимается и понимает все тонкости своего дела, а значит и требования у человека будут сугубо индивидуальные к макету и готовому лэндингу. Это может быть представление эксклюзивного, дорого продукта. В портфолио можно посмотреть, как пример, посадочную страницу магазина женской одежды «Comodik». А может быть вы представитель заводского бизнеса или производитель товара, тогда и цена посадочной страницы, объявленная вам менеджером, составит другую сумму и будет разрабатываться в стиле вашего требования и предложения.

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

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

Создание посадочных страниц landing page в компании Mnogoland

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

Как сделать лучшие посадочные страницы или этапы сотрудничества:

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

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

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

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

1. Сделайте призыв к действию понятным

Кнопка СТА (Call To Action) должна мотивировать посетителя к определенному действию на вашей целевой странице, поэтому особое внимание стоит уделить оптимизации этого элемента. Рекомендуем следовать следующим правилам:

1.1 Заголовок и надпись на кнопке ясно дают посетителю понять, что он получит

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

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

Консультант по оптимизации конверсии Михаэль Аагард (Michael Aagaard) следовал данному правилу и увеличил конверсию целевой страницы Betting Expert на 31,54%.

Слева заголовок: «Присоединяйтесь к BettingExpert» и надпись на кнопке «Зарегистрироваться». Справа заголовок: «Получить бесплатные советы, как делать ставки» и надпись на кнопке: «Зарегистрируйтесь и получайте лучшие советы каждый день»

1.2 Расположите кнопку призыва к действию в верхней части страницы

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

«Инструменты для увеличения вашего веб-трафика. Попробовать бесплатно»

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

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

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

1.3 Используйте пустое пространство

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

1.4 Используйте контрастные цвета для привлечения внимания

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

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

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

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

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

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

Так, на лендинге компании Human Touch, которая продает массажные кресла и кровати, размещена вот такая фотография:

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

Не экономьте на качестве изображений. Инвестируя в профессиональные и уникальные фотографии и картинки, вы зарабатываете доверие клиентов. Как пишет эксперт по оптимизации конверсии Пип Лая (Peep Laja): «Первое впечатление о целевой странице посетитель получает, просматривая визуальные элементы дизайна. Ресурсы, которые выглядят как любительские, не вызывают доверие».

3. Размещайте отзывы реальных клиентов

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

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

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

Гипотеза подтвердилась: публикация реальных отзывов повысила конверсию на 22%.

4. Пользователь должен легко скользить взглядом по странице

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

Специалист по юзабилити Якоб Нильсен (Jakob Nielson) считает, что это «распространенная модель поведения в интернете — охота за информацией и безжалостное игнорирование деталей. Но как только нужный контент найден, человек, как правило, погружается в него. Таким образом, содержание целевой страницы должно соответствовать двум требованиям: текст должен легко сканироваться и, в то же время, отвечать на вопросы пользователей».

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

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

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

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

5. Не позволяйте отделу продаж препятствовать конверсии

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

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

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

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

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

Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

Подписаться

Что такое посадочная страница?

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

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

С точки зрения веб-аналитики, посадочная страница – это страница входа, куда поступает трафик.

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

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

Факторы, влияющие на конверсию:

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

Стоит заметить, что правильная настройка посадочной страницы увеличивает количество заявок в 5 - 10 раз.

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

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

1. Определитесь с целями. Каких действий вы хотите от пользователя: отправление заявки, покупка, просмотр. Это опорные моменты.
2. Напишите хороший текст. Заголовок должен быть привлекательным и соответствовать поисковому запросу пользователя. Расскажите о товаре, или услуге. Чем вы можете понравиться покупателю, опишите преимущества. Например, заголовок «Продаем надежные охранные системы в Воронеже» лучше, чем «Вы обратились по адресу» и т.п. Помните, что в тексте не должно быть ошибок и опечаток.
3. Дизайн должен привлекать внимание. Если вы что-то продаете, имеет смысл показать «товар лицом» и еще лучше – показать его в использовании. Видео и красивые картинки удерживают внимание.
4. Если цель - отправка пользователем формы, ее нужно располагать на видном месте. И так, чтобы она не нарушала его общий путь движения по странице. Целевое действие должно находиться там, куда падает взгляд. Ссылки на другие товары, красивые картинки – все, что может замотивировать посетителя смотреть ваш сайт дальше. Форма заявки должна запрашивать только обязательную информацию. Не перегружайте форму большим количеством полей. Оставьте только необходимые данные для дальнейшей обработки. Обязательно: форма должна отдавать ответ об успешной (или неуспешной, указать причины) отправке.

Пример хорошей формы заявки

И еще:

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

Примеры посадочных страниц с высокой конверсией

Рассмотрим целевую страницу курса техники речи:

• Обратите внимание на картинку: человек не ней смотрит на заголовок и это еще один прием управления вниманием. Картинки сами по себе привлекают взгляд, но если модель смотрит не на вас, а на рекламируемый объект, вы неосознанно переведете взгляд.
• Сразу поданы выгоды и гарантии: избавление от дефектов, указана гарантия результата через 6 занятий.
• Наличие цены и кнопки «Отправить заявку» на главной картинке также являются важным фактором.

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

Страница контактов оформлена с учетом ближайшей станции метро и времени.

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

Логотипы известных брендов повышают доверие.

И наконец:

И наконец, мы «подхватываем» пользователей, которые, просмотрев страницу до конца, не хотят скроллить вверх.

Примеры далеко не лучших посадочных страниц

А теперь давайте рассмотрим немного неоднозначный лендинг.

Сайт доставляет пиццу. У которой нет фото...

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

Лишь проскроллив вниз можно увидеть текст и в самом его низу телефон. Но названия по-прежнему нет нигде. Доставка? А просто доставка еды на дом.. Секретная, видимо.

Надеюсь, статья была вам полезна. Жду вопросы в комменты.

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

1. Позитивные тексты

Один из лучших примеров использования позитивных текстов можно увидеть на посадочной странице сайта Patreon , который занимается финансированием художников:

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

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

2. Вызываем доверие с самого начала

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

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

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

3. Уникальное продающее предложение

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

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

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

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

4. Добавляем интерактивные элементы

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

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

Даже простое обещание интерактива уже делает ваше предложение более привлекательным.

5. Пусть говорят картинки

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

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

Chatterbox Labs использует знакомую пользователям сцену из жизни города – забитую улицу Нью-Йорка. Такой подход позволяет визуально (без текста ) объяснить всю сложность определения нужной аудитории. За счет этого посадочная страница сохраняет минималистичный вид.

6. Исключаем препятствия на пути к конверсии

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

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

Если вы хотите нарастить пользовательскую базу собственного приложения, то нужно интегрировать социальные сети и возможность авторизоваться при помощи существующих аккаунтов. Посмотрите, как это реализовано у платежного шлюза Venmo :

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

7. Краткое и точное введение в курс дела

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

Текст краткий, четкий, и отлично информирует о предложении AskNative еще до того, как пользователь сможет авторизоваться при помощи Facebook (то, о чем говорилось в шестом пункте ).

Чем быстрее вы объясните посетителю суть, тем больше вероятность, что он кликнет по CTA-элементу .

8. Помогаем посетителю представить возможности

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

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

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

9. Используем видео

Взгляните на пример посадочной страницы от производителя курятников ChickenSaloon.com , а также на объявление, которое переносит пользователей на страницу. Здесь представлено коротенькое видео из телевизионного реалити-шоу, в котором рассказывается об одном из продуктов компании – курятнике под названием Tavern :

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

10. Помогаем делать выбор

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

Мы видим, как продукт помогает потенциальному покупателю решить его проблему.

11. Делаем четкое утверждение

Иногда того, что вы делаете, уже достаточно для привлечения внимания и мотивации посетителей. Примером такого случая служит страница Last Days of Ivory :

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

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

12. Знайте свой бренд и принимайте «риски»

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

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

13. Задаем вопросы

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

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

14. Стараемся вызвать эмоции у потенциальных клиентов

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

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

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

15. Прямое обращение к посетителям

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

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

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

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

16. Смеемся над проблемами

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

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

17. Думаем о цвете

По ходу этой статьи мы фокусировались на посыле, тексте и эмоциях, однако не обращали внимания на еще один важнейший элемент – цветовую схему!

Давайте взглянем на пример от сервиса для управления паролями Mitro :

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

Хорошо Плохо