Как создать каркас целевой страницы с советами экспертов

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

Что такое каркас целевой страницы после клика?

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

Rares Cimpean, визуальный дизайнер Instapage, объясняет:

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

Вот несколько примеров каркасных целевых страниц после клика, длинных и коротких:

Каркасный шаблон целевой страницы после клика служит нескольким основным целям:

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

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

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

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

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

Как создать каркас целевой страницы после клика

Нет навигации

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

Многие компании заметили существенные изменения в своих коэффициентах конверсии после удаления панелей навигации:

• В Career Point College коэффициент конверсии вырос на 336% после удаления верхней панели навигации и изменения макета формы.
• Yuppiechef зафиксировал 100% -ное увеличение коэффициента конверсии (с 3% до 6%) за счет удаления панели навигации.
• У SparkPage коэффициент конверсии увеличился с 9,2% до 17,6% в течение месяца, когда они проводили A / B-тестирование, удалив верхнюю навигацию.

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

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

Заголовок и подзаголовок

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

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

Ключ к написанию хорошего заголовка - убедиться, что он передает ваше уникальное ценностное предложение (UVP) или то, что отличает ваш продукт или услугу от конкурентов.

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

Помимо UVP, есть четыре основных типа привлекательных заголовков:

1. Новости: Представьте новое решение потенциальным клиентам
2. Личный интерес: обращение к собственному интересу потенциальных клиентов <
3. Быстрое и простое решение: апеллируйте к стремлению потенциальных клиентов к быстрым исправлениям
4. Любопытство: пробуждает интерес и любопытство посетителей, побуждая их прочитать больше.

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

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

СМИ

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

Типы изображений целевой страницы после клика включают:

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

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

Помимо изображений существует несколько типов видео с целевой страницы после клика:

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

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

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

Копировать

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

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

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

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

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

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

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

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

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

Форма захвата лида

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

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

Напротив, бесплатная пробная версия Autopilot находится дальше по воронке, поэтому запрос дополнительной информации приемлем:

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

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

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

Минимальный нижний колонтитул

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

Посмотрите на все эти пути эвакуации, которые предлагает посетителям Infegy:

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

Пустое пространство

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

• Уменьшает беспорядок
• Повышает удобочитаемость
• Устанавливает визуальную иерархию
• Делает вашу целевую страницу после клика более профессиональной

Сравните следующие целевые страницы после клика от NASM и Acquisio:

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

Все начинается с каркаса целевой страницы после клика.

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

С Instapage маркетологи могут создавать страницы с идеальным пикселем с помощью нашего удобного конструктора, редактора CSS, выравнивания и группировки, горячих клавиш и многого другого. Затем используйте встроенные тепловые карты для A / B-тестирования, чтобы повысить конверсию и масштабировать производство с помощью Instablocks ™. Никакое другое решение не может сравниться. Подпишитесь на демонстрацию Instapage Enterprise сегодня.