Руководство по Landing Page

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

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

• Домашняя страница — ваша общая страница для посетителей любого типа
• Страница Persona, где вы адаптируете ценностные предложения для конкретной аудитории
• Страница продукта, где вы погружаетесь в детали конкретного продукта

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

Начнем с классической Landing Pages. Подумайте о создании целевой страницы с точки зрения вероятности трансформации посетителя в подписчика. Это просто уравнение:

Коэффициент Конверсии = Желание — Труд — Путаница

Другими словами, чтобы увеличить скорость трансформации, мы:

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

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

Процесс создания ценностных предложений

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

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

Качество: быстрый
Выгода: более быстрый результат.
Преимущество клиента: получите результат быстрее

Качество: быстрый
Выгода: выполняет больше работы
Преимущество: получите больше выполненной работы

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

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

Давайте возьмем качество «безопасный» и представим, что ваш продукт — приложение для обмена сообщениями:

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

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

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

Как взглянуть на продукт глазами клиента

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

1. В первой колонке перечислите все нежелательные альтернативы, к которым люди прибегают, когда у них нет вашего продукта. Затем опишите, что делает каждую альтернативу плохой. (прокрутите вниз, чтобы увидеть таблицу)
2. Ваш список того, что делает каждую альтернативу плохой, теперь является отправной точкой для создания ценностных предложений. Напишите, как и почему ваш продукт лучше.
3. В третьей колонке просто перечислите категории самых платежеспособных клиентов. Эта колонка должна напомнить вам, к какой аудитории вы обращаетесь. Для каждой персоны перечислите два преимущества продукта, о которых они заботятся больше всего.
4. Теперь оставьте только те предложения из второго столбца, которые больше всего подойдут вашим главным клиентам. Другими словами, используйте третий столбец для фильтрации второго столбца.

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

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

Говорите много кратко. Это принцип информационной плотности, который направлен на то, чтобы не заставлять пользователя слишком много читать.

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

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

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

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

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

Структура идеальной Landing Page

Начните со следующего шаблона и отклоняйтесь от него только, если вы хотите улучшить отдельные элементы страницы в рамках A/B теста:

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

Hero: основной раздел в верхней части страницы, который включает текст заголовка, текст подзаголовка и захватывающие изображения.

Social Proof: логотипы известных клиентов, ссылки на статьи в СМИ, отзывы.

CTA: кнопка регистрации и краткий стимул, чтобы нажать ее.

Features: ключевые ценностные предложения и обработка самых частых возражений.

CTA: кнопка регистрации и дополнительный стимул, чтобы нажать ее

Footer: ссылки на дополнительную информацию

Начнем с первого элемента в верхней части страницы.

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

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

• Фонового изображения
• Заголовка
• Подзаголовка

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

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

Как написать заголовок для лендинг пейдж

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

• «Создание сайтов с нуля. Никакого кодирования»
• «Доставка продуктов в течение 1 часа. Попрощайтесь с пробками, парковкой и длинными очередями»
• «Аренда жилья у местных жителей. Почувствуйте себя своим в новом городе или стране»

Заголовок объясняет, как решается проблема. Пользователям не нужно копать глубже. Как написать заголовок не хуже?

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

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

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

1. «Создание сайтов с нуля. Никакого кодирования»

2. «Доставка продуктов в течение 1 часа. Попрощайтесь с пробками, парковкой и длинными очередями»

3. «Аренда жилья у местных жителей. Почувствуйте себя своим в новом городе или стране»

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

Оптимальная длина заголовка 6-12 слов, чтобы он быстро читался. Он должен быть не оригинальным, а настолько интересным, что купили продукт. Теперь, когда ваш заголовок объясняет, что вы делаете, используйте подзаголовок, чтобы описать, как вы это делаете. (Миллионы читают Википедию не просто так.)

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

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

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

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

Пример для видеочата — «в режиме реального времени наша команда расшифровывает и переводит ваши слова на более, чем 20 языков»

Но есть два исключения из этого правила:

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

Оптимальная длина подзаголовка 10-13 слов.

SOCIAL PROOF

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

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

Call to-action (CTA) побуждает посетителя перейти к следующему событию в вашей воронке, такому как регистрация или добавление товара в корзину. Он состоит из двух компонентов: заголовка и кнопки.

Заголовок CTA суммирует то, что посетитель получает, нажав на кнопку. Хороший пример — «получите новый логотип за 24 часа», плохой — «подпишитесь на пробную версию».

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

Создать лендинг →
Начать загрузку →
Посмотреть демо →

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

Работа с возражениями

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

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

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

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

От теории к практике. Напишите ключевое преимущество (3-5 слов). Не используйте неопределенные формулировки, такие как «расширение возможностей отдела продаж». Просто опишите особенность продукта, чтобы посетители могли быстро решить, нужен он им или нет. И должны ли они читать абзац с описанием конкретной опции/функции (2-3 предложения). Ваша цель состоит в том, чтобы кратко описать эту функцию и, возможно, ответить на часто возникающие вопросы, которые мешают клиентам оформить заказ.

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

Тестирование Landing Page и сбор обратной связи

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

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

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

Попросите респондентов оценить следующие шесть критериев:

• Конверсия. Готовы ли вы привязать свою кредитную карту и зарегистрироваться прямо сейчас? Если нет, что бы вам нужно было увидеть, чтобы добраться до этой точки?
• Интерес. Оцените, насколько хорошо страница поддержала ваш интерес по шкале от 1 до 10. Что вы предлагаете переписать или переработать, чтобы она лучше поддерживала ваш интерес?
• Ясность. Какие вопросы остались без ответа?
• Расширение. Вы нашли что-то удивительное, вы хотели бы узнать еще больше деталей?
• Краткость. Если бы вам пришлось удалить половину изображений и текста, что бы это было?
• Доверие. Что вызывает сомнения и недоверие?

Оценка конверсии целевой страницы

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

[Количество посещений, содержащих событие конверсии] / [Всего посещений]

Чтобы правильно оценить конверсию, вы должны анализировать только:

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

Отслеживайте показатели эффективности с помощью Яндекс Метрики и Google Analytics по каждому каналу трафика:

• Поиск (органический трафик)
• Контент-маркетинг (посты в блоге)
• Объявления
• Социальные сети
• Переходы с сайтов

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