Продающие лендинги: подробное руководство

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

Цели и задачи лендинга

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

Важно помнить: один лендинг = один товар/услуга = одна ЦА.

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

• проанализировать конкурентов
• изучить целевую аудиторию
• сформулировать выгоды продукта
• выбрать уникальное торговое предложение (УТП)
• продумать четкий оффер

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

Выгоды

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

• Составьте список из 10-20 выгод от использования вашего продукта
• Выделите из них 3 основных
• Подумайте, как вы можете их подтвердить

Этот список вы можете использовать при составлении УТП и проектировании страницы. 

Метод персонажей

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

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

После этого ответьте на несколько вопросов по каждому персонажу:

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

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

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

Уникальное предложение

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

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

Возражения

При просмотре любого предложения возникают возражения:

• А почему так дешево/дорого?
• А если вы не уложитесь в срок?
• А где гарантии?
• А почему я могу вам доверять?

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

Как закрыть возражения?

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

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

Четкий оффер

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

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

Каким должен быть хороший оффер? Есть 5 основных правил:

• Оффер должен содержать поисковый запрос. Хотя бы частично. Если пользователь не увидит в первом экране свой запрос, он может подумать, что попал не туда и уйти с сайта.
• Оффер должен быть максимально емким. В идеале, 7-8 слов, максимум — 10. Большее количество слов использовать нежелательно. Если вдруг у вас не получается его сократить, вынесите часть в уточнения под оффером. 
• Оффер должен содержать выгоду. Добавьте в него решение проблемы клиента, за которой он к вам пришел. Не «Банкротство физических лиц за две недели», а «Избавьтесь от всех долгов, оформив банкротство». 
• Оффер должен говорить с пользователем на его языке. Сравните: «Разработка конверсионного адаптивного сайта с высоким CTR» или «Создаем одностраничные сайты для роста продаж с гарантией результата». Какой оффер будет понятнее? 
• Оффер должен быть конкретным. Формулировки в стиле «большой выбор», «широкий ассортимент», «короткие сроки» уже никого не впечатляют. Будьте конкретными — это точно выделит вас среди конкурентов. 

Логичная структура

Стандартный одностраничник содержит 10-15 блоков. В случае, когда мы продаем сложную услугу или инновационный товар, блоков может быть и более 20. 

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

Если кратко описать структуру любого лендинга, то получится такой список:

• Кто вы такие?
• Что вы предлагаете?
• Как это решит мою проблему?
• Почему этот товар/услуга, а не аналог?
• Почему я должен купить это у вас?
• Как совершить покупку или что произойдет после заказа?

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

Первый экран

Мы уже разобрали, каким должен быть оффер. А что должно быть на первом экране? 

• Логотип и название компании
• Дескриптор 
• Оффер
• Изображение
• Кнопка/форма

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

Какое изображение выбрать для первого экрана?

• Изображение товара 

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

• Результат оказания услуги или использования товара

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

• Процесс оказания услуги 

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

• Процесс использования товара

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

• Примеры ваших лучших работ

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

• Фото представителя компании

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

• Видео

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

• Анимация

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

Элементы одностраничного сайта

• Навигация

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

• Преимущества товара/услуги

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

• Преимущества компании

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

• Целевая аудитория

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

• Цены и тарифы

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

• Этапы работы

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

• Кейсы и примеры работ

Обязательный блок, если вы оказываете услугу. Чаще всего реализуется в виде слайдера с фото или фото+пояснительный текст. Для многих ниш кейсы можно размещать в формате «До-после». Если возможно, опишите подробно, с какой проблемой столкнулся клиент и как вы помогли ее решить. Ниже блока с кейсами можно разместить форму захвата с призывом «Хотите так же?».

• Отзывы

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

• FAQ

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

• Контакты

Разместите максимально полные контактные данные: телефон, email, адрес, ссылки на социальные сети, реквизиты, режим работы. Для оффлайн-бизнеса обязательно добавьте виджет карты с указанным местоположением. 

Триггеры доверия

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

• Гарантии и условия возврата
• Фотографии сотрудников
• Сертификаты, лицензии, награды, уставные документы 
• Фотографии офиса/склада/точки продаж
• Фото и видео с производства 
• Обращение от директора
• Упоминания в прессе
• Список клиентов
• Виджет из социальной сети
• Пример договора
• Статистика в цифрах

Учтите: люди часто бывают ленивыми или невнимательными, но они поймут, что вы хотите их обмануть. Если вы пишете, что на рынке 10 лет и осчастливили сотни клиентов, а в 2GIS у вашей компании два отзыва, то вам не поможет даже самый лучший оффер.

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

Призывов к действию должно быть несколько — для всех персонажей на разных стадиях принятия решений. 

Объединяйте призывы с УТП или решением проблемы пользователя, например «Закажите консультацию и получите скидку 50% на разработку дизайна», «Давайте обсудим, как мы можем повысить продажи для вашего бизнеса». 

Лучше использовать в призывах глаголы в повелительном наклонении (Позвоните, закажите, узнайте) и формулировки в виде вопросов: «Хотите узнать, сколько клиентов мы приведем вам с нового сайта?» или «Остались вопросы?».

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

Примеры рабочих призывов для разных ниш:

• Проконсультируйтесь с менеджером
• Закажите КП
• Получите полный прайс
• Остались вопросы? Задайте их менеджеру
• Нужна помощь? Подберем подходящий вариант
• Узнайте точную стоимость
• Закажите бесплатный замер
• Получите скидку 
• Попробуйте наш продукт в работе
• Получите лендинг в подарок при заказе контекстной рекламы

Формы захвата

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

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

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

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

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

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

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

Каким должен быть дизайн?

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

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

О чем забывают при создании дизайна?

• Один экран = один смысловый блок = одна группа элементов

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

• Иконки в инфографике должны дополнять заголовок 

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

• Важно соблюдать иерархию элементов

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

Как написать хорошие тексты?

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

Сравните следующие тексты:

• Доступные цены / Цены от 10 000 рублей
• Многолетний опыт работы / 10 лет на рынке
• Гибкие условия оплаты / Беспроцентная рассрочка на 6 месяцев
• Квалифицированные сотрудники / Опыт сотрудников от 10 лет

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

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

Лендинг для B2B и B2С

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

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

На чём сделать лендинг?

Зависит от целей, бюджета и позиционирования бизнеса. Есть два основных варианта — конструктор и CMS. 

• Конструктор

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

• CMS

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

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

Чего не должно быть на лендинге?

• Простыней текста

Люди не воспринимают списки более 5-6 пунктов и не читают абзацы текста длиннее 300 символов. Будьте краткими, но убедительными. Убирайте лишние слова, сокращайте предложения, экономьте «мыслетопливо» пользователей. И не забывайте про форматирование текста — иногда достаточно просто разбить текст отступами и добавить маркеры. 

• Большого количества стоковых фото

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

• Ошибок и опечаток

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

• Прилагательных в превосходной степени

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

• Внешних ссылок

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

Про что все забывают?

• Адаптивная верстка

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

 

• Скорость загрузки

Если первый экран грузится дольше двух секунд, то пользователь может и не дождаться. Часто скорость крадут неоптимизированные картинки или видео. Проверить скорость загрузки можно с помощью сервиса PageSpeed Insights. 

• Кликабельный телефон

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

• Корпоративный email

Намного надежнее выглядит адрес почты на домене сайта, например, zakaz@i-complex.ru. Это можно сделать быстро и бесплатно. 

• Политика конфиденциальности

152-ФЗ никто не отменял — страница с информацией о том, как вы собираете и обрабатываете персональные данные, обязательна, как и информация об этом в каждой форме сбора контактов. 

Как протестировать лендинг?

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

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

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

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