30+ адаптивных лендинг пейдж шаблонов на HTML (бесплатные, премиум)
Готовые лендинг пейдж шаблоны нужны для быстрого запуска нового продукта, его продвижения при помощи LP-страницы или мобильного приложения, либо мотивации пользователей зарегистрироваться / подписаться на рассылку. Для «целевой страницы» крайне важны удобство и простота пользования с грамотным расположением конверсионных элементов. Современные продающие шаблоны лендингов, разрабатываются с прицелом на возможность создания адаптивного сайта с высокой конверсией.
В этой подборке лендинг-шаблонов HTML есть бесплатные и премиум. И те и другие пригодны для успешного продвижения сервиса/продукта онлайн, при условии правильности оформления и соответствия вашему продукту. Среди премиум HTML5 LP-шаблонов выбор достаточно широк, в отличии от тех, что скачивают бесплатно. Наверняка найдется подходящий и для вашей ниши / специфики.
Итак, семь бесплатных лендинг пейдж шаблонов на HTML и 20+ «премиальных» – с доп. опциями и отличным адаптивным макетом.
Бесплатные шаблоны Landing Page на HTML
Bent – Free App Landing page
Snow – A Free Bootstrap Landing Page Theme
Чистый Bootstrap шаблон для демонстрации нового продукта, сервиса. Этот бесплатный шаблон лендинга способен ускорить маркетинговую кампанию по продвижению вашего сервиса.
Landy – Free Landing Page Template
Простой адаптивный LP шаблон отлично подойдет для рекламы или продаж приложений, софта, розничного продукта или сервиса. Он разработан на bootstrap с применением только бесплатных шрифтов Google Fonts. Код содержит комментарии на случай кастомизации шаблона.
Legend: One Page Free Responsive landing Template
Legend — 2-й основанный на бутстрап, бесплатный LP-шаблон. На нем можно создать лендинговую страницу, креативное онлайн-портфолио и даже бизнес-сайт.
Flexbox Responsive Landing Page
Адаптивный шаблон лендинг пейдж создан на основе CSS Flexbox. Созданный без каких либо фреймворков, шаблон будет проще редактировать / кастомизировать.
App Landing Page Website Template
App Landing идеально подойдет разработчику софт-продукта или приложения, а также для целей продвижения малым бизнесом приложений и продукции iPhone, iPad, Android. Адаптивный и готовый к Retina шаблон на Foundation CSS фреймворке имеет одну страницу, использует иконочный шрифт, оптимизирован для SEO и рекламы.
HTML Business App – Free Landing Page Template
BusinessApp – это бесплатный Landing Page шаблон, основанный на HTML5 / CSS3 и созданный для продвижения Android и iOS приложений.
Адаптивные премиум Landing Page шаблоны HTML
Kane
Html шаблон Landing Page для сайта и мобильного приложения, подходящий для целей бизнес продвижения. Для стиля лейаута (темный и светлый с фото-видео бэкграундом и mailchimp поддержкой, делают LP-шаблон серьезным инструментом конверсии.
Crossway – Startup Landing Page Template
Ультра-современная HTML5 тема на Bootstrap 3.1.1. Поставляется с 4 макетами: одно/много страничник, варианты панели навигации. Легкий эффект параллакс-прокрутки интегрирован в тему лендинга, адаптированную под мобильные и получение органического трафика (SEO).
DotSquare
Html landing page шаблон для веб и мобильных приложений, нацелен на легкую генерацию лидов. Обладает быстрой загрузкой и валидным html, css кодом. В верхней части одностраничника продублирована форма контактов с призывом к действию.
Primo Responsive Landing Page Template
Одностраничный HTML5 лендинг-шаблон с CSS3-эффектами. Имеет трехколоночный каркас, создан на Bootstrap 3. Подойдет для продаж iOS/Android-приложений. В шаблон включено 2 лейаута (с Parallax и без), Ajax формы контактов, PrettyPhoto лайтбокс и 5 цветовых схем. Легок в настройке: смените hex-коды и связанные элементы окрасятся в новый цвет. PSD в комплекте.
Hype – App Landing Page
Современный, готовый к Retina шаблон для мобильных приложений предлагает 8 вариантов цветов, опции для изображений / видео бэкграунда.
Gotte Multipurpose Landing Page
Многоцелевой лэндинг шаблон в плоском стиле поставляется с 3 вариантами index, 6 цветовыми схемами. Шаблон создан на twitter bootstrap3, включен PHP скрипт формы контактов и загрузки.
Slander – Responsive Bootstrap HTML5 Landing Page
Slander – идеальный вариант для стартапа и компаний, подходит профессионалам или индивидуальному проекту. Отзывчивый дизайн с Bootstrap и HTML5 / CSS3 включает адаптивный слайдер, слайдер вкладок, форму новостной подписки и пр.
Appster – Ultimate Clean App Landing Page Template
Адаптивный App лендинг шаблон под рекламу и продажи. Создан на основе последних html5 / css3 техник. Имеет элегантный, чистый и минималистичный дизайн, включает все необходимое для успешного маркетинга.
Cloud – An Easy To Use App Landing Page
Элегантный, чистый и минималистичный HTML5 / CSS3 шаблон лендинг пейдж с отличным функционалом. Шаблон разработан под страницу Coming Soon (скоро запуск), идеален для создания страницы приложения и сайта-витрины.
OnEvent – Special Event Landing Page
Адаптивный лэндинг-шаблон для спец. мероприятий. Имеет секции под фотогалерею, коммерческое видео, расписание событий, список гостей.
Appreative Responsive Landing Page Template
Appreative – адаптивный шаблон, предназначенный для краткого информирования. Подходит для различных типов задач.
SaptaApp Landing Page Template
Вам будет достаточно изменить основной цвет сайта/шаблона изменяя шестнадцатеричный код цвета, как все связанные элементы примут новый оттенок. Это упрощает настройку/редактирование шаблона.
Entry – Startup Landing Page
Простой и быстрый LP-конструктор поможет вам создавать и редактировать лендинговые страницы в считанные минуты – просто изменяя позиции блоков, цвета, удаляя ненужные блоки. Шаблон включает 18 блоков под все лэндинговые нужды.
Stylio – Responsive HTML5 App Landing Page
Одностраничный шаблон лендинга адаптивен и готов к retina – протестирован для основных портативных устройств. Главной изюминкой шаблона является многослойный слайдер со скриншотами и различными сценариями. Другие особенности шаблона: построен на Bootstrap 3.0 с шириной модульной сетки 1200 px, включает несколько лейаутов и видео версию, гладкие HTML5 & CSS3 переходы/анимации, иконочные шрифты Font Awesome 4.0.
NRG – Responsive Landing Page
NRG – одностраничное решение для развивающегося стартапа или небольшой студии. Шаблон включает все необходимое, чтобы обозначить свое присутствие в WEBе. Главные собенности: фокус на юзабилити, пегковесная структура, 100% валидный код и сжатая графика.
EventLand Landingpage
Красиво оформленный одностраничный HTML5 шаблон для лэндинга, идеально представит бизнес мероприятия, торговые выставки, конференции, семинары. EventLand располагает интегрированной рассылкой новостей, лид-формой для регистрации клиента, эффективной одностраничной навигацией с грамотно расположенными вкладками, стильным слайдером. В составе: иконочные шрифты Font Awesome, карта Google Map и др. полезные опции.
Off the Shelf – Responsive E-Book Landing
Шаблон разработан для демонстрации и продаж электронных изданий e-book авторов. Хотите сделает вашу книгу заметной? Off the Shelf профессионально и быстро справится с этой задачей.
Neue – App Landing Page
Neue это новейший лендинг пейдж шаблон из этой подборки. Он оснащён впечатляющим функционалом, имеет великолепную поддержку.
EduTime – Online Courses & Education Landing
EduTime ориентирован на в область образования и продвижения онлайновых учебных курсов.
Plaza – Education – Hotel – Dating Landing
Универсальный лендинг-шаблон подойдет следующим типам проектов: ресторан отеля / сайт знакомств / образовательные курсы. Его гибкий адаптивный макет основан на Bootstrap фрейворке.
SpiceHub Restaurant Responsive Landing Page
Одностраничный ресторанный-шаблон на HTML5/CSS3 порадует корпоративным стилем и сочными цветами. Использует jQuery/AJAX, анимационные эффекты, совместим с Bootstrap 3.x. В составе: 2 лейаута (с параллакс и без), иконки Glyphicons/Font Awesome, PSD файлы. Дополнительно, SpiceHub предлагает WordPress тему под сайт ресторана / кафе / бара.
Katemi – Clean Product and App Landing Page
Шаблон предназначен для продвижения товаров/сервисов и приложений. Полностью адаптивный и чистый HTML5/CSS3 дизайн Katemi Landing Page v2.0 создан на Bootstrap 3.0.3. Ключевые особенности: SEO дружественная стуктура и код, стратегическое оформление первого экрана, CSS анимации.
Лендинг Пейдж Шаблоны | Landing Page Templates |TemplateMonster
Адаптивный дизайн
Ваш сайт будет легко приспосабливаться к любым размерам экрана устройства, на котором отображается. Все значимые элементы будут показаны, а второстепенные скрыты. Это делает взаимодействие с сайтом более удобным для пользователя, а также улучшает SEO, т.к. все пользователи попадают на одну и ту же версию сайта.
Bootstrap
Кроссбраузерность
Вам больше не потребуется тестировать каждое изменение в разных браузерах и на разных платформах. Вы можете быть уверены, что ваш сайт будет одинаково выглядеть в любом браузере. Ваш лендинг пейдж будет выглядеть всегда привлекательно! Лендинг пейдж примеры сайтов доступны в демо-версии к каждому шаблону.
Иконки шрифтов
Все иконки заменены на иконки шрифтов. Все они по своей природе векторные, а шрифт – довольно четкий и масштабируемый. Будьте уверены в том, что вы получите высокое качество иконок, которые будут прекрасно отображаться на различных дисплеях. Заказать лендинг и получить решение для демонстрации своего предложения онлайн будет лишним, поскольку вы уже имеете готовые решения для посадочных страниц. Все лендинг примеры сайтов готовы к использованию и редактированию.
PSD файлы включены
Все PSD файлы включены в шаблоны лендингов. Вы сможете беспрепятственно работать с ними и редактировать по своему усмотрению. Лучшие лендинги только в TemplateMonster! Создать лендинг сможет каждый.
TM дополнения
Практически во все Landing Page шаблоны, так же как и в шаблоны Joomla и другие решения, интегрированы поиск, формы контактов и подписки. Инструкции по их использованию вы сможете найти в документации к шаблону. Чтобы купить лендинг, теперь не нужно искать отдельный функционал для расширения возможностей Landing page. Примеры этих решений можно посмотреть в демо и уж после принять решение о покупке. Поэтому посмотрите наши Landing Page примеры сайтов, чтобы найти необходимый шаблон.
Необходимая документация
Каждый наш продукт дополнительно сопровождается документацией. Это краткие руководства и подробные инструкции по установке и настройке дизайнов. Кроме того, из документации вы сможете узнать о возможностях продукта и о том, какие плагины и другие дополнения могут быть использованы в шаблоне лендинга.
10 бесплатных шаблонов лендингов в PSD
Я редко пишу про разработку UX/UI, а зря. Прототипирование и разработка веб-интерфейсов — важнейшие этапы разработки сайта, и самые главные при разработке целевых, посадочных страниц, лендингов.
Можно купить много рекламы, посетителей, вывести сайт по всем запросам в топы поисковиков, но кривой, или просто непродуманный интерфейс сайта может очень негативно сказаться на результатах. Конверсия сайта сильно зависит от его юзабилити, внешнего вида.
Недоработки в части дизайна могут обходиться очень дорого.
Сегодня я хочу представить десять бесплатных шаблонов лендингов в формате PSD, с которыми можно не только ознакомиться, но и взять за основу при разработке UX/UI, позаимствовать структуру, элементы.
PSD — растровый формат хранения графической информации, использующий сжатие без потерь, созданный специально для программы Adobe Photoshop и поддерживающий все его возможности.
Axit — PSD лендинг
PSD-шаблон лендинга с чистым современным дизайном. За счёт грамотной организации слоёв, легко поддаётся кастомизации.
СкачатьAppz — PSD лендинг для приложений
PSD-шаблон лендинга, который отлично подойдёт для презентации мобильных приложений. Дизайнер Michael Reimer.
СкачатьWoo — шаблон лендинга
Современный шаблон целевой страницы с чистым адаптивным дизайном для демонстрации приложений, услуг или цифровых товаров.
СкачатьTake — шаблон лендинга мобильного приложения
Шаблон целевой страницы для презентации мобильных приложений, автор Blaz Robar.
СкачатьNew Providence — бесплатный лендинг в PSD + HTML
Бесплатный шаблон целевой страницы с чистой цветовой гаммой, сбалансированной типографикой и высококачественной графикой.
СкачатьКорпоративный лендинг
PSD-шаблон корпоративного лендинга в минималистичном стиле, автор Al Rayhan.
СкачатьЛендинг в PSD
Бесплатный PSD-шаблон лендинга с открытой лицензией, допускающей коммерческое использование.
СкачатьFun Weather — шаблон лендинга для приложения
Бесплатный PSD-шаблон лендинга для приложений, связанных с погодой, прогнозом погоды.
СкачатьОфисный лендинг
Бесплатный PSD-шаблон обычного офисного лендинга от Vivek Ravin.
СкачатьLand.
io — шаблон лендингаКрасивый набор UI для создания целевых страниц, включает в себя много полезных элементов для использования в проектах. Автор Peter Finlan.
Скачать .SketchИ в качестве бонуса парочка интересных шаблонов от Монстров.
Design Studio Free landing page
Это профессиональный и бесплатный шаблон для создания одностраничных сайтов дизайнерских студий, фотографов и других тематических ресурсов творческих людей. Среди главных особенностей можно выделить:
- чистый дизайн в духе времени. Он поддержит, а не затмит ваши креативные идеи;
- потрясающий параллакс обои;
- набор готовых фото, которые как нельзя лучше поддерживают тематику;
- простое, интуитивно понятное создание сайта своими руками без лишних расходов.
Free Resturant landing page
Бесплатный шаблон для сайтов, работающих с продуктами питания, в том числе ресторанов и кафе. Он адаптивен для мобильных устройств, поэтому и пользуется столь большой популярность у многих пользователей. Среди основных особенностей:
- создание целевой страницы, ориентированной на будущее;
- стильный и минималистичный внешний вид;
- полноразмерный заголовок;
- имеется доступ к значкам с идеальной пиксельной структурой;
- простота редактирования шаблона.
Подпишитесь на мой телеграм и первыми получайте новые материалы, в том числе которых нет на сайте.
Бесплатные макеты Figma для верстки сайта
Полезное 1 min
Привет! Figma уже давно прочно внедрилась в жизнь веб-разработчиков, это довольно удобная программа как для создания дизайна, так и для его использования. Собрал несколько бесплатных макетов для верстки сайта для вас!
Portfolio landing page
Макет портфолио. Сложность низкаяСсылка на макет
Классный сайт для портфолио, лично мне нравится простой и чистый дизайн.
Сложность: низкая
Clean simple landing page
Макет productivity. Сложность средняяСсылка на макет
Довольно простой по дизайну, но не самый простой в плане верстки сайт. Есть что отработать (декоративные элементы, слайдеры и т.д.)
Сложность: средняя
Client chat
Макет client chat. Сложность средняяСсылка на макет
Ооочень похоже на мессенджер Slack 🙂 Но тем не менее, интересно такое сверстать, особенно в плане семантики.
Сложность: средняя
Restaurant template
Макет ресторана. Сложность средняяСсылка на макет
Неплохой одностраничник на тему ресторана. Так же есть немало мелочей, которые можно отработать.
Сложность: средняя
Valorant concept
Макет valorant. Сложность высокаяСсылка на макет
Концепт по недавно вышедшей игре Valorant. В целом, это не совсем макет сайта, но мне дизайн нравится, и в принципе, можно под себя переделать. Для практики — самое то)
Сложность: высокая (только из-за нестандартного макета)
Thrivetalk landing page
Макет Thrivetalk. Сложность низкаяСсылка на макет
Простой лендинг, для отработки сеток (flexbox) самое то)
Сложность: низкая
Пока это все, на самом деле найти адекватные макеты для figma не так уж и просто, но будем стараться) Если же вы хотите еще, или хотите сборник psd-макетов от меня — пишите в комментарии, и все будет!
Всем добра, удачи в верстке макетов)
Об авторе блога
MaxGraph
Автор. Веб-разработчик. Фрилансер. Преподаватель в онлайн-университете.
Портфолио: https://maxgraph.ru/
Добавляйтесь в друзья VK! Каждому добавившемуся и написавшему в личку «хочу полезность» — подарю набор крутых ссылок для верстальщика.
Адаптивные шаблоны лендинг пейдж — адаптивная верстка лендинга от Nethouse.ru
Шаблоны для всех типов устройств
Использование адаптивного шаблона решает несколько задач:
- Ваш сайт всегда выглядит корректно и привлекательно на любых устройствах.
- Красивый и удобный landing page способствует привлечению все большего количества потенциальных клиентов.
- Правильно расположенные кнопки с призывом к действию стимулируют пользователя к совершению действия.
Конструктор сайтов Nethouse предлагает вам удобные шаблоны для посадочных страниц любой тематики. Все они выполнены в различных цветовых вариантах, а цвет блоков можно в дальнейшем менять на свое усмотрение.
Для того, чтобы быстро создать адаптивный сайт на конструкторе Nethouse достаточно совершить три действия:
- Зарегистрироваться.
- Выбрать подходящий шаблон.
- Наполнить сайт текстовой информацией и медиа-контентом (фото и видео).
В результате вы получаете возможность в короткий срок увеличить прибыль вашей компании, разместив в сети красиво оформленный адаптивный лендинг пейдж.
Для одностраничников, выполненных на конструкторе Nethouse, характерны следующие преимущества:
- минимальный срок создания веб-страницы;
- наличие небольшого объема контента, имеющего первостепенное значение;
- яркий, ненавязчивый дизайн;
- быстрое продвижение в сети Интернет;
- наличие блоков с активным призывом совершить конкретное действие – купить товар или воспользоваться услугой.
Шаблоны сайтов бесплатно
Показать / скрыть категории
Разделы
Если вы начинаете развивать бизнес в формате онлайн, то наверняка задумывались над тем, как создать проект в сети. И если раньше для этого приходилось обращаться в агентства или искать фрилансеров, кто бы взял заказ, то теперь вы можете сделать это сами.
Для этого мы оформили шаблоны посадочных страниц. И сразу спешим сообщить две приятные новости: с шаблонами интернет сайтов не нужны профессионалы, а стоить это будет в разы дешевле, чем при обращении агентства. Поговорим обо всем.
Шаблоны сайтов бесплатно
Вы находитесь в каталоге шаблонов сайтов, где представлено более 1300 оформленных макетов. Наши специалисты разработали стильные шаблоны продающих страниц на разные тематики: украшения, туризм и отдых, продукты для домашних животных, электроника, юридические услуги, школы и детские сады, строительные материалы, медицинские услуги и прочее.
Чтобы собрать такую базу, мы взяли наиболее популярные темы, и наши мастера разработали стильные и красивые шаблоны сайтов, чтобы с их помощью каждый мог оформить магазин и сразу же наполнить его контентом.
Причем здесь можно как купить готовые шаблоны сайтов, так и найти бесплатные адаптивные шаблоны сайтов. Если установили бесплатный, то, чтобы с ним работать, нажмите кнопку «Выбрать». И он сразу откроется в режиме редактирования. Можно приступить к наполнению.
Меняйте изображения, видео, шрифты, тексты… Словом, делайте страничку такой, какой видите ее и которая будет соответствовать заявленным требованиям.
Если же перед вами платный вариант, то сначала оплатите возможность использования образца – удобнее всего осуществить это через сервис ROBOKASSA. И после того, как пройдет оплата, можно приступать к редактированию содержимого.
Ниже мы рассмотрим, как сделать сайт с готовыми шаблонами, что для этого необходимо.
Готовые шаблоны сайтов
Как мы уже говорили выше, чтобы запустить свой проект, нет необходимости иметь знания программирования. Вы со всем справитесь сами. Даже если до этого никогда не видели, как это делать. И это так. Ведь все элементы специалисты уже подготовили. Остается только добавить их на страницы шаблона для создания сайта.
И далее поэтапно разберем этапы работы с шаблонами на конструкторе сайтов:
Сначала зарегистрируйтесь. Чтобы этот процесс был удобным для всех, мы сделали его максимально легким: посредством соцсети Вконтакте или через электронную почту. Таким образом, сразу после регистрации макеты станут сразу доступны.
После этого вы сразу переходите в магазин готовых шаблонов сайтов, где есть разделы: от спорта и детских игрушек до продажи предметов для творчества, одежды, бытовой техники и так далее. Зайдя в каждый из них, можно взять любой шаблон сайта на русском языке.
Как только найдете бесплатный готовый шаблон сайта, нажимаете кнопку «Выбрать», и он сразу установится на аккаунт. И начинайте вносить свои корректировки. Но если тот макет, который понравился, платный (можно купить готовые шаблоны сайтов), сначала оплачиваете его, а затем сразу переходите к редактуре.
Работать с шаблонами сайтов онлайн очень удобно. Здесь все интуитивно понятно, поэтому не займет много времени. Даже новичкам хватает три-четыре часа, чтобы шаблон лендинг пейдж превратить в полноценный проект. Так, например, для того, чтобы поменять блоки местами, «захватите» элемент мышкой и перенести его. Точно так же легко можно заменить все тексты, видео, картинки, которые уже были заранее подготовлены для дизайна шаблонов сайтов.
После того, как заполните содержание, расставите фото, впишите контакты, установите корзину и прочее — можно подключать домен. И рекламироваться в поисковиках. Далее предлагаем рассмотреть, что возможно сконструировать при помощи наших простых шаблонов сайтов.
Шаблоны многостраничных сайтов
Сейчас под многостраничниками чаще всего подразумевают именно онлайн магазины. И если вы хотите смоделировать подобный, воспользуйтесь шаблонами интернет магазинов. Это уже наполненные странички, которые помогут вам создать свою продающую платформу.
И при этом вам не потребуется тратить много времени. Потому что конструктор сайтов с готовыми шаблонами уже содержит все необходимое.
Однако если у вас возникнут вопросы, задайте их нам напрямую по почте. Или воспользуйтесь Справочным центром — здесь имеются инструкции с ответами на часто возникающие вопросы: по подключению домена, настройке Яндекс Директа или SEO.
Простые шаблоны сайтов на русском языке
Одностраничники, или лендинги, состоят всего из одной страницы. Начать работать с шаблоном одностраничного сайта так же легко, как с любым другим — вы выбираете тот, который нравится, устанавливаете его на свой аккаунт и затем редактируете его и вносите изменения.
Новые шаблоны сайтов
Наши специалисты всегда держат руку на пульсе, чтобы полностью учесть вкусы и запросы клиентов компании — именно поэтому мы опирались на запросы пользователей. Поэтому у нас одна из самых богатых библиотек. В базе большой ассортимент лучших шаблонов сайтов. И мы не собираемся останавливаться на достигнутом результате — регулярно дизайнеры компании обдумывают новые идеи, усовершенствуют образцы и добавляют виджеты.
Нам важно, чтобы пользователи не только оставались здесь, но и могли сразу же перейти к созданию страничек. Поэтому большинство из представленных образцов — бесплатные. Наши шаблоны сайтов легкие в обращении и при этом очень удобные.
Итак, как мы смогли убедиться, чтобы собрать полноценный ресурс, возьмите понравившийся вариант и с его помощью попробовать начать создание личной платформы. А если что-то не будет получаться, в любое время можно обратиться в техподдержку.
Шаблон Figma «SIRIUS» для создания дизайн макетов Landing Page.
Шаблон «Sirius 1.0» — это комплект материалов для Figma, который поможет веб-дизайнеру создавать макеты Landing Page быстрее и проще.
В комплект включено 24 раздела (Wireframe). С помощью этих материалов вы можете создать сначала черновую структуру сайта, без цвета и картинок. Затем за пару кликов добавить цвет и поработать над вставкой изображений.
Множество разделов имеют функцию Auto Layout, что поможет перестраивать дизайн автоматически и экономить ваше время.
Какие дизайн макеты можно сделать из этих материалов?Ниже реальный пример дизайн макета лендинга, который был сделан на основе этих материалов. Вы тоже можете сделать аналогичный макет с помощью видео урока на 60 минут, который я для вас подготовил.
Шаблон Figma. Что включено в бесплатную версию «SIRIUS 1.0»? 1. Шапки (headers) и подвал сайта (footer) Шапки для создания лендингов в FigmaВы получите набор из 4 шапок, в которых есть логотипы, дескрипторы (краткое описание деятельности), меню, номера телефонов с иконками, контактная информация (email, адрес компании).
Также есть 1 элемент для подвала сайта, так называемый футер (footer).
2. Разделы с контентом слева и справа Разделы с контентом слева и справаВ комплект включены разделы с текстовым описанием, иконами, буллитами, кнопкой, контактной формой. Акцент сделан на типографике. Заданы правильные отступы и создана правильная иерархия для того, чтобы текст читался легко.
Если вставить на место серых прямоугольников ваше изображение, фотографию или иллюстрацию, то все будет смотреться отлично. Большая часть работы уходит имено на композицию и работу с текстом.
Профессиональный дизайн лендинга отличается от дизайна новичков работой с текстом. Вы можете сэкономить ваше время, если будете использовать готовы заготовки с расположенными элементами и продуманной иерархией и композицией.
Можно использовать эти разделы для первого экрана или любого другого раздела сайта.
3. Разделы с контентом по центру Разделы с контентом по центруЭти разделы могут быть полезны как для описания чего либо, так и для первого экрана лендинга. Если вы добавите хедер, то будет смотреться отлично.
4. Контактные формы. Шаблон figmaКонтактные формы, или так называемые формы захвата. Вертикальный и горизонтальный вариант. Вертикальная форма имеет функцию Auto Layout. Если вы продублируете поле нажав на комбинацию клавиш «Ctrl + D», то форма увеличится в размерах и ничего не придется перестраивать.
5. Разделы лендингов с иконками Иконки (разделы лендингов)Блоки с иконками можно легко редактировать. Эти разделы также имеют функцию Auto Layout. Если вы дублируете какой-то раздел, то он будет увеличен в размерах. Иконки можно заменить очень быстро простым перетаскиванием.
6. Блок с цифрамиМожно использовать этот блок для описании компании в цифрах или предоставить другие факты, которые важны для людей из целевой аудитории.
7. ВидеоЗаготовка для видео плеера. Раздел подойдет для лендинга, где важно показать какое-то видео.
8. Каталог товаров Каталог товаров для лендинговРаздел с каталогом товаров. Можно использовать его также для таких разделов как: наши услуги, функции, цены и т.д. Просто проявите фантазию.
9. Контент с цифрами Цифры. Контент для лендинга.В эти разделы можно вставить какие либо изображения и изменить описание. Все имеет функцию Auto Layout, что будет удобно использовать в работе над проектами.
10. ОтзывыОтзывы — это социальное доказательство. Они нужны на сайте, чтобы повысить доверие людей из целевой аудитории. В непонятной ситуации люди смотрят на то, что делают другие и повторяют за ними.
Поэтому используйте этот раздел, чтобы повысить эффективность лендинга. Вставляйте в заголовок самую интересную фразу, которая будет вызывать эмоции у человека.
10. Галерея, портфолио. Галерея, портфолио для лендинга.Чтобы быстро вставить в эти разделы изображения можно воспользоваться функцией «Place Image». Выберите его в панели инструментов или нажмите на 3 горячие клавиши «Shift + Ctrl + K». Выберите фотографии на вашем компьютере и вставьте их в прямоугольники.
10. Дополнительные элементы Дополнительные элементыЕсть дополнительные элементы, которые можно использовать. Это заменители логотипов, кнопки, элемент для имени и фамилии, переключатели, иконки телефона и email.
Как получить комплект материалов бесплатно?Просто нажмите на кнопку ниже. Вас перенаправит на специальный сайт комплекта. Там вы сможете скачать этот шаблон и получите видео урок, с помощью которого сможете сделать дизайн макет Landing Page.
Автор комплекта: Владимир Чернышов
Дизайн посадочной страницы Вдохновение для вашего следующего макета
Имеет ли значение красота? Что ж, когда дело доходит до дизайна целевой страницы, он определенно может повлиять на восприятие вашего предложения. В конечном итоге, если ваши целевые страницы не выглядят хорошо или не соответствуют рекомендациям, ваши конверсии могут пострадать.
Целевые страницы с хорошим дизайном часто конвертируются лучше, чем плохие, и разница может быть значительной. Если все сделано правильно, дизайн должен поддерживать текст на вашей странице и работать со всеми другими элементами, побуждая посетителей к действию.
Но сначала: каковы некоторые передовые методы проектирования?
Ниже мы собрали множество примеров отличного дизайна целевой страницы от клиентов Unbounce. Но прежде чем поделиться ими, давайте рассмотрим некоторые характеристики, которые мы обычно видим на хороших страницах:
Они сверхфокусированы
Хорошая целевая страница имеет только одну цель: побудить посетителей выполнить одно действие, которое вы хотите, чтобы они сделали, и перерабатывать. Вот почему на многих целевых страницах нет меню или тонны внешних ссылок. — вы хотите, чтобы ваш посетитель выполнил призыв к действию, а не ушел и не отвлекся.
Они продолжают прокрутку до минимума
Было бы здорово включить дополнительную информацию о вашем предложении на страницу, но посетители должны иметь все необходимое, включая кнопку CTA, без прокрутки в течение дней. Хотя длинные целевые страницы могут конвертироваться в случае сложных предложений, рассмотрите возможность использования лайтбоксов для демонстрации дополнительной информации вместо добавления множества разделов страницы.
Они используют релевантные привлекательные визуальные эффекты
Для удивительного дизайна требуются яркие изображения.Независимо от того, насколько технически ваше предложение (см. Пример Panoply ниже), вам нужно что-то, чтобы разбить текст. Ваши изображения должны быть интересными, актуальными и соответствовать вашему бренду. . Они также должны побуждать посетителей сканировать целевую страницу и останавливаться на кнопке с призывом к действию.
Они поддерживают единый брендинг
Дизайн вашей целевой страницы должен соответствовать вашему общему виду , чтобы посетители могли мгновенно узнать и связать ее с вашим брендом.Обычно это означает использование той же цветовой схемы и элементов дизайна, что и на вашем обычном веб-сайте. Однако это может быть непросто, потому что целевые страницы должны выглядеть иначе, чем ваш веб-сайт в целом — они, как правило, проще и не включают, например, навигацию. Тем не менее, брендинг и цвета часто остаются прежними.
Они используют шаблоны F или Z
Исследования показывают, что глаза большинства людей перемещаются по веб-сайту по шаблону F или Z . Лучший дизайн целевой страницы обычно учитывает эти закономерности.Например, наличие вертикального визуального элемента слева с заголовком вверху справа и кнопкой CTA немного ниже справа позволяет посетителям следовать шаблону F и в конечном итоге смотреть прямо на ваш CTA.
Не уверены, способствует ли конверсиям ваш текущий дизайн? Попробуйте наш анализатор Unbounce Landing Page Analyzer и посмотрите, как ваша целевая страница оценивается по девяти различным категориям эффективности.Само собой разумеется, что красота — не единственное, что нужно учитывать при оценке дизайна целевой страницы.Вы хотите, чтобы страницы выглядели хорошо, но они также должны конвертироваться. Всегда сочетайте привлекательный внешний вид с исследованиями поведения посетителей, чтобы создать эффективных страниц.
Вот здесь-то и начинается тестирование. В зависимости от вашей отрасли мы действительно наблюдали невероятно простые и недооцененные страницы, работающие безумно хорошо — никаких изменений дизайна не требуется.
А теперь давайте посмотрим на несколько красивых дизайнов!
Лучшие примеры дизайна посадочных страниц
1.Индокитай
Изображение любезно предоставлено Indochino. (Щелкните изображение, чтобы увидеть полную страницу. )Если вы создаете красивую целевую страницу, это помогает иметь привлекательный продукт, о чем уже рассказала компания Indochino. Страница, созданная с помощью Unbounce выше, является примером того, как Indochino предлагает не только сшитые на заказ костюмы, но и красивые целевые страницы.
Вот что, по нашему мнению, делает дизайн этой целевой страницы потрясающим:
- Отличные визуальные эффекты : Если у вас есть привлекательный продукт, продемонстрируйте его.Здесь мы можем увидеть модели костюмов Indochino, а динамическая поза помогает посетителям увидеть, насколько учтиво выглядит продукт в контексте использования.
- Использование места : Не менее важно, что посетители имеют всю необходимую информацию без тонны прокрутки. Кнопка CTA заметна и сфокусирована. Дизайн этой страницы простой и сдержанный, но он выполняет свою работу.
- Фирменный : текст заголовка здесь набран шрифтом, похожим на логотип компании, что помогает создать ощущение единообразия бренда.
Страница, которую мы видим здесь, создана специально для мужчин в Калгари и призвана побудить их к действиям вне сети. (Хорошо, сначала нужно записаться на прием через Интернет, а затем физически посетить новый выставочный зал.) Часть успешного дизайна целевой страницы — это создание предложений, ориентированных на определенную аудиторию, что в Индокитае уже освоено.
Это целевая страница на самом деле , поэтому адаптирована так, чтобы мелкие детали не имели смысла для тех, кто не живет в Калгари.Вы можете пропустить, например, что Chinook Center — это торговый центр, но эта страница предназначена для тех, кто это уже знает.
2. Зола
Изображение любезно предоставлено Золя. (Щелкните изображение, чтобы увидеть полную страницу.)Если вы работаете в свадебной индустрии, например, в интернет-магазине / магазине подарков Zola, вы знаете, что дизайн имеет значение. Пример страницы выше демонстрирует дизайнерскую смекалку компании, предлагая простую и элегантную целевую страницу для невест и будущих женихов.
Вот что делает страницу Zola привлекательной:
- Единый брендинг : Это не сразу видно, если вы первый раз, но бренд Zola использует оттенки голубовато-серого (см. Сердечки на логотипе компании).Фон сохраняет эти цвета, а также обеспечивает отличный контраст для изображений — этот белый свадебный торт нуждается в контрастном фоне, чтобы выделяться.
- Simplicity : Главный сайт электронной коммерции Zola довольно загружен. Если целевая страница включала какую-либо из стандартных элементов навигации, посетители могли отвлекаться, щелкая мышью вместо запуска своего реестра, что и является целью страницы. Сохранение простоты означает, что больше посетителей завершат действие, вместо того, чтобы бесцельно бродить по веб-сайту.Эта страница идеально подходит для направления их платной рекламы, чтобы снизить цену за клик.
3. Lujo
Изображение любезно предоставлено Lujo. (Щелкните изображение, чтобы увидеть полную страницу.)Целевая страница с Z-образным шаблоном, разработанная для Lujo гуру по конверсии в цифровом агентстве KlientBoost, предоставляет массу контекста, но при этом не является ошеломляющей. Вы можете возразить, что здесь есть два призыва к действию — покупка коллекции и просмотр видео. Луджо это сходит с рук, потому что видео представлено так незаметно, как продолжение фотографий продукта.Понятно, что самый важный призыв к действию на этой странице — проверка коллекции шезлонгов.
Вот что нам нравится на этой странице:
- Потрясающие (и согласованные) визуальные эффекты : не только отличная фотография продукта, но и поддержка Z-шаблона дизайна целевой страницы, усиливающая посыл бренда. Слоган Луджо — «поставить жизнь на паузу», и все, что есть в визуальных эффектах на этой целевой странице, усиливает этот бренд — от шляпы от солнца, покоящейся на видеобоксе, до туфель на палубе и чая со льдом. Дизайн должен работать рука об руку с обменом сообщениями, чтобы текст и изображения объединялись для создания общего впечатления, которое имеет смысл. У Lujo это хорошо получается на этой целевой странице.
- Очевидно USP : Прямо под фотографиями Lujo формулирует — с текстом и элементами дизайна — три уникальных аргумента: бесплатная доставка, пятилетняя гарантия и новозеландское мастерство. Поиск способа тонко воплотить эти три идеи в дизайн означает, что посетителю, возможно, не нужно будет продолжать изучение, прежде чем нажимать эту кнопку с призывом к действию — они видят эти основные преимущества, и это может заключить сделку.
4. Panoply
Изображение любезно предоставлено Panoply. (Щелкните изображение, чтобы увидеть полную страницу.)В отличие от некоторых других примеров, инструмент анализа данных Panoply не имеет особо привлекательного продукта, который можно было бы продемонстрировать — я имею в виду, в конце концов, это аналитическое программное обеспечение, а не шикарный костюм. Но целевая страница Panoply (разработанная Directive Consulting) является великолепным свидетельством того факта, что дизайн и красота важны даже для технических продуктов и услуг B2B.
Это то, что, по нашему мнению, делает эту целевую страницу красивой (и эффективной):
- Умные визуальные эффекты : Творческая демонстрация пользовательского интерфейса Panoply в тонкой (но понятной) форме — одна из самых больших побед этой целевой страницы. . Интересные визуальные эффекты всегда важны, даже если продукт не подходит для фотографии.
- Социальное доказательство : Включая в первую очередь отраслевые награды и отзыв от GoDaddy — и делая это таким образом, чтобы он соответствовал общему дизайну, — еще один замечательный штрих.Посетителю не нужно никуда переходить на целевой странице, чтобы знать, что отраслевые эксперты доверяют Panoply.
5.
Daily Harvest Изображение любезно предоставлено Daily Harvest. (Щелкните изображение, чтобы увидеть полную страницу.)Использование изображений для вызова сильной эмоциональной реакции может быть не проще для любого продукта, чем для еды. (Людям достаточно одного взгляда, чтобы понять, хотят ли они положить что-то в рот.) К счастью, Daily Harvest предлагает великолепную линейку здоровых закусок, и они сделали правильный выбор дизайна, чтобы продемонстрировать это на этой площадке. страница.
Вот что нам нравится на этой странице:
- Анимированные изображения : Daily Harvest было бы легко использовать здесь статичное изображение одного из своих смузи, но бренд пошел еще дальше. Этот анимированный снимок героя очень увлекателен — смузи выглядит так, как будто я мог бы съесть прямо сейчас, если бы не этот проклятый экран компьютера, — а инструкции в формате GIF помогают мне сразу понять, как работает эта служба.
- Примеры продуктов : Остальная часть целевой страницы заполнена множеством прекрасных изображений продуктов.Одно дело сказать мне, что у вас огромный каталог питательных угощений, другое — показать мне реальные примеры блюд, которые я могу заказать после регистрации.
6. Greats
Изображение предоставлено компанией Greats. (Щелкните изображение, чтобы увидеть полную страницу.)Мода — это социальная идентичность, и для брендов важно демонстрировать атрибуты, которые потребители хотят приписывать себе: такие вещи, как подлинность, качество и круто .Эта целевая страница обувного бренда Greats (созданная компанией WITHIN) отлично справляется с задачей создания бренда с помощью дизайна, при этом побуждая посетителей к конверсии.
Вот почему мы думаем, что это (о нет, не говорите этого) «отличный» пример дизайна целевой страницы:
- Великолепное видео : вся эта целевая страница довольно гладкая, но что действительно выбивает ее о парке — видео чуть ниже сгиба. Мало того, что стиль анимации остановки выглядит потрясающе, он также дает великим шанс подробно рассказать о своем уникальном торговом предложении — по одному стежку за раз.Посмотрите это на YouTube ниже.
- Правило трех : Greats применяет правило трех во всем этом макете, делая заявления о преимуществах визуально поразительными и легко усваиваемыми.
- Для мобильных устройств : эта целевая страница выглядит так же хорошо на мобильных устройствах, как и на компьютерах. Учитывая, что к 2021 году на мобильную связь, по прогнозам, будет приходиться 54% всех продаж электронной коммерции, как никогда важно, чтобы потребители находились в пути.
7. Unbounce
Изображение предоставлено Unbounce. Эй, это мы! (Щелкните изображение, чтобы увидеть полную страницу.)Если мы так говорим, эта недавняя целевая страница нашего бренда отлично показывает, а не говорит. Мы все замедляли работу веб-сайтов и сразу же уходили с них — но что это значит для маркетологов? Конечно, мы могли бы объяснить с помощью кучи текста, но анимация в правой части этой страницы действительно дает понять, почему быстрая загрузка целевых страниц обязательна.Дизайн этой целевой страницы соответствует эффективному F-образцу, и трудно отвести взгляд от падения коэффициента конверсии в анимации.
Вот то, что, на наш взгляд, выглядит здесь отлично:
- Анимация : Время загрузки целевой страницы — не самая простая вещь, которую можно показать на статическом изображении (как мы обнаружили), но это очевидно, если добавить анимацию.
- Визуальная иерархия : Встраивание наиболее важной информации в этой анимации в общий макет F помогает посетителям читать.Анимация — и содержащиеся в ней визуальные элементы — помогают сделать то, что в противном случае могло бы быть довольно скучной целевой страницей, более динамичным и интересным.
- Текстовые функции : Мы забили эту целевую страницу статистикой, чтобы подтвердить наши заявления о медленной загрузке страниц, и мы хотим, чтобы эти цифры появлялись, поэтому они часто выделяются жирным шрифтом. Если на целевой странице много текста, разбейте его на отдельные абзацы и выделите важную информацию жирным шрифтом. Это облегчает посетителям сканирование и принятие мер.
В конце концов, когда дело доходит до создания красивых и эффективных целевых страниц, речь идет о сочетании чувства дизайна с пониманием того, как люди ведут себя при просмотре веб-страниц. При разработке своей следующей целевой страницы используйте лучшее из обоих миров, наблюдая за размещением призывов к действию, выбирая фотографии и визуальные эффекты продуктов, балансируя текст заголовка и обеспечивая, чтобы элементы вашего дизайна выглядели хорошо и приводили к конверсиям.
Больше примеров отличных целевых страниц (связанный контент)
Если вы все еще не чувствуете вдохновения после всех этих великолепных примеров, у нас есть еще больше целевых страниц, созданных с помощью Unbounce. (Что мы можем сказать? Наши клиенты действительно хороши в этом.) Взгляните на некоторые из функций ниже:
- Доказательство в пудинге. Ознакомьтесь с коэффициентами конверсии, советами инсайдеров и более красивым дизайном, прочитав 12 целевых страниц с высокой конверсией (которые заставят вас пожелать, чтобы вы их создали).
- Все еще не чувствуете? Мы тебя прикрыли. Вы найдете массу вдохновения и новых идей для целевых страниц в разделе «Лучшие примеры целевых страниц, которые вы должны сохранить для своего файла Swipe».
- Иногда создание целевых страниц для мобильных кампаний — это совсем другое дело. Вот примеры мобильных целевых страниц, которые вам не по зубам.
- Наконец, если вы продвигаете приложение для iOS или Android, не ищите ничего, кроме этих невероятных примеров целевых страниц для мобильных приложений, прежде чем начинать создавать свои собственные.
9 обязательных элементов для идеальной посадки Страница
Следующая статья представляет собой отрывок из нашей новейшей электронной книги 25 Веб-сайт «Must Haves» для привлечения трафика, потенциальных клиентов и продаж. Вы можете бесплатно скачать полную электронную книгу здесь .
Целевые страницы — один из самых важных элементов лидогенерации, но большинство компаний используют их недостаточно — или вообще не используют. Вместо этого часто уделяют больше внимания главной странице веб-сайта.В конце концов, это первая комната в вашей виртуальной витрине, когда посетители «проходят» через дверь.
Удивительно, но исследования показывают, что средний коэффициент конверсии для веб-сайта составляет от 1% до 3%, что означает, что он конвертирует лишь крошечную часть трафика сайта. Почему при таком плохом исходе компании по-прежнему полагаются на домашнюю страницу, чтобы делать тяжелую работу?
Целевая страница (также называемая страницей для сбора потенциальных клиентов) является обязательным элементом любого веб-сайта, поскольку она обеспечивает целевую платформу для преобразования более высокого процента посетителей в потенциальных клиентов.Фактически, у целевых страниц коэффициент конверсии 5-15% в среднем . Тем не менее, их часто затмевают домашние страницы или страницы других продуктов.
Это связано с тем, что в течение многих лет маркетологи были сосредоточены на привлечении людей на веб-сайт компании, не имея четкого представления о том, как посетители попали туда и куда их направить дальше. Сегодня мы используем электронный маркетинг, социальные сети, рекламу с оплатой за клик (PPC) и другие онлайн-каналы, которые позволяют маркетологам отправлять трафик в определенные места (целевые страницы), содержащий нужные сообщения для каждой аудитории.
Задача целевой страницы — точно сообщить вашим посетителям , что вы хотите, чтобы они сделали и , почему они должны это сделать . Домашние страницы, хотя и являются важным элементом веб-сайта, обычно в меньшей степени ориентированы на конкретную задачу, поскольку служат широким массам. Домашние страницы отлично подходят для прямого трафика , но когда вы можете контролировать, как посетители попадают на ваш сайт, целевая страница — лучшее место для их отправки. Если все сделано правильно, целевые страницы могут очень положительно повлиять на генерацию потенциальных клиентов.
Хотя целевые страницы работают лучше, чем основные страницы сайта, с коэффициентом конверсии 5-15%, они могут работать с намного лучше , если использовать передовые методы, описанные ниже. Фактически, многие клиенты HubSpot, которые реализовали эти советы, имеют коэффициент конверсии 30-45% ! Это безумно выше среднего!
Для сравнения: если вы привлекли 10 000 посетителей на свою домашнюю страницу, вы получите примерно 300 потенциальных клиентов. Если вместо этого вы отправите их на целевую целевую страницу со средним коэффициентом конверсии 30%, вы сможете сгенерировать 3000 потенциальных клиентов .Какой из них вы бы предпочли?
Хотите знать, что нужно, чтобы получить звездную конверсию целевой страницы? Ознакомьтесь с приведенными ниже советами по созданию идеальной целевой страницы.
1. Никогда не используйте свою домашнюю страницу в качестве целевой страницыКак упоминалось выше, на домашних страницах обычно слишком много сообщений, что заставляет посетителей чувствовать себя потерянными. Мы также рекомендуем не использовать главную страницу продукта сайта. Даже если у вас отличная домашняя страница и дополнительные страницы, специальная целевая страница (с использованием этих советов) будет лучше преобразовывать посетителей в потенциальных клиентов, поскольку они сосредоточены на одной задаче.
2. Целевые страницы должны содержать следующие элементы- Заголовок и (необязательно) подзаголовок
- Краткое описание предлагаемого
- Как минимум одно вспомогательное изображение или короткое видео
- (Необязательно) подтверждающие элементы, такие как отзывы, логотипы клиентов или значки безопасности
- Самое главное, форма на самой целевой странице для сбора информации. Если по какой-то причине вы не можете разместить форму на целевой странице, используйте большую кнопку с призывом к действию (CTA), чтобы направить посетителей к следующему шагу.
Целевая страница используется только для одной цели — побудить посетителя совершить одно конкретное действие. Когда посетители попадают на страницу, мы хотим удерживать их там, пока они не выполнят это действие. Выход из режима навигации может побудить их продолжить блуждание. Удалите со страницы основную навигацию по сайту, чтобы они не сдвигались с целевой страницы.
4. Держите цель простой и яснойНе пытайтесь размещать на целевых страницах слишком много информации.Дайте понять , о чем идет речь на странице, и , что вы хотите, чтобы посетитель сделал . Ограничьте количество копий, изображений, мультимедиа и ссылок только тем, что необходимо, и организуйте свой контент в надлежащей структуре, чтобы объекты располагались в логическом порядке. Особенно важно, чтобы призыв к действию (CTA) был максимально понятным для посетителя.
Пример целевой страницы, которая может улучшить CTA:
5. Сопоставьте контент с предыдущим источником посетителя
Независимо от того, приходит ли посетитель через PPC-рекламу, электронную почту или призыв к действию из другого источника, убедитесь, что сообщения совпадают на всем пути конверсии.Если в вашем PPC-объявлении говорится: «Загрузите нашу электронную книгу по маркетингу», на целевой странице должно быть написано то же самое или что-то подобное. Если в ваших сообщениях происходит отключение, посетители будут чувствовать себя так, как будто они не в том месте, и, скорее всего, нажмут кнопку «Назад».
6. Уменьшить трениеТрение вызывается объектами (или отсутствующими объектами) на странице, которые мешают посетителю предпринять какие-либо действия. Это может включать в себя предоставление слишком большого количества информации (добавление сложности), отвлекающую анимацию, отсутствие подтверждения или безопасности клиента и т. Д.Сделайте так, чтобы ваши посетители были уверены в своем выборе и предоставлении информации. Чтобы уменьшить трение, сделайте страницу простой (не требуйте, чтобы посетители читали слишком много), включите элементы доказательства, такие как отзывы клиентов, количество загрузок / продаж (чтобы указать на принятие со стороны других), значки безопасности (если вы имеете дело с конфиденциальные данные, такие как информация о кредитной карте), и, как упоминалось выше, убедитесь, что обмен сообщениями соответствует на протяжении всего пути конверсии.
7. Сосредоточьтесь на ЗНАЧЕНИЕНе создавайте целевую страницу для загрузки информационных бюллетеней (никогда не помещайте их в форму). Сделайте создайте целевую страницу для ценного технического документа. Не используйте целевую страницу для «Свяжитесь с нами», но действительно используйте ее для полезного руководства, бесплатной пробной версии, демонстрации или оценки. Предлагая что-то ценное, вы сможете привлечь больше потенциальных клиентов, чтобы вы могли развивать их с течением времени, пока они не будут «готовы к покупке».
Пример отличной целевой страницы, обеспечивающей ценность:
8. Спрашивайте только то, что вам нужноКогда дело доходит до веб-форм, не существует волшебного ответа на количество полей формы, которые должны быть обязательными.Но вот одно простое практическое правило: спрашивайте только о том, что вам или вашей команде продаж действительно нужно . Если вам не нужен их цвет волос, не просите об этом. Постарайтесь также держаться подальше от деликатной или конфиденциальной информации. И никогда, никогда не используйте слово «Отправить» на кнопке формы. Всегда используйте язык для того, что они получают взамен. Например, используйте «Загрузить сейчас», «Получите бесплатную оценку» или «Присоединяйтесь к нашему списку рассылки».
9. Создайте много целевых страниц
Для каждой новой кампании или предложения создавайте новую целевую страницу.Чем больше у вас целевых страниц, тем больше возможностей для преобразования большего трафика в потенциальных клиентов.
БОНУС: сделайте ваши целевые страницы общедоступнымиЭто необязательно, но это еще один отличный способ привлечь больше посетителей на ваши целевые страницы. Включите ссылки для совместного использования в социальных сетях или виджет для обмена в социальных сетях на своих целевых страницах, чтобы посетители могли легко делиться этим контентом в своих личных сетях и, в свою очередь, открывать больше возможностей для преобразования потенциальных клиентов.
Оцените свои целевые страницы и используйте эти передовые практики в качестве контрольного списка для создания идеальной страницы.Эффективные целевые страницы — это то, что превратит ваш сайт в машину для генерации лидов. И не забудьте протестировать свои целевые страницы, чтобы узнать, какие из них подходят вам лучше всего!
Какие другие передовые методы работы с целевыми страницами вы бы порекомендовали?
Наука, лежащая в основе правильного сочетания конверсий
Макеты целевых страниц в наши дни — вещь прекрасная, и есть много советов, как их создавать. Для начала задайте следующие вопросы, которые помогут вам решить, в каком направлении должна двигаться ваша страница и какие разделы наиболее важны для включения:
- Для какого бизнеса вы создаете страницу? Это компания B2B, предлагающая сырье или услугу? Это компания B2C?
- Что продает бизнес?
- Какое отношение имеет УВП к тому, что продает бренд?
- Это физический продукт? Если да, то какая часть продукта будет наиболее важной для демонстрации на главном изображении? Людям нужно знать, что они получают, иначе они не предоставят информацию о потенциальных клиентах.
- Как они продают?
- Следит ли за продажами? Через 24 часа? В течение часа? Обязательно сообщите об этом своим зрителям. Ясность — ключ к успеху.
Чем более подробно и легче понять эти детали в вашем копирайтинге , тем удобнее посетителю будет предоставлять свою информацию.
Однако важно не давать слишком много информации, чтобы она отпугивала зрителя. Например, вы не хотите говорить им: «Заполните форму ниже, чтобы мы могли вам позвонить.«Многие люди не хотят, чтобы им звонили по телефону. Вы можете связаться с ними по телефону, но им не нужно об этом знать. 😉
Но этот телефонный звонок — источник изображения
Вместо этого скажите: «Расскажите нам больше о себе, чтобы мы могли дать вам индивидуальное предложение». Это говорит о том, что вы уделяете внимание важности зрителя и что он получит индивидуальную цитату, соответствующую их потребностям. И вы все равно можете позвонить им, если потребуете ввести номер телефона.🙂
И разговор продолжается и продолжается. Чем лучше вы понимаете своего клиента, тем проще будет создать страницу с высокой конверсией.
Рассмотрев все эти вопросы, сегодня мы собираемся сосредоточиться на целевой странице двух собственных клиентов KlientBoost, CareChoice и EZBind. Мы поймем, что у них сработало и почему их страницы успешны.
Теперь поищем всех графических дизайнеров с классическим образованием.
Объявление дизайнера
Разработка целевых страниц — это не то же самое, что создание нового логотипа для нового бренда.Иногда необходимо использовать уродливый неоново-зеленый цвет (особенно для кнопок с призывом к действию), но это нормально. Обещать.
Отпусти. Отпусти ситуацию. — источник изображения
Лучше привлечь внимание нового потребителя, чем быть красивой. Сейчас вы сосредоточены на конверсиях.
Это может показаться излишним, чтобы вас предупредить, но, как дизайнер, я должен был научиться отказываться от некоторых вещей, таких как неоново-зеленый цвет. Если вы работаете с интересным брендом, у вас будет возможность создать несколько классных страниц.А если вы работаете с не очень успешным брендом, постарайтесь поговорить со своим клиентом о том, чтобы немного отойти от бренда. У вас все еще есть возможность создать что-то чистое и красивое, что приведет к отличным результатам.
Итак, давайте рассмотрим компоненты целевой страницы, которые идеально подходят для увеличения числа конверсий.
Мы прерываем ваше обычное программирование, чтобы преподнести вам этот очень важный урок анатомии !
Анатомия идеальной целевой страницы:
Теперь, прежде чем мы перейдем к на самом деле , нам нужно взглянуть на основную анатомию целевой страницы.
Дизайн целевой страницы состоит из семи основных частей, поэтому давайте разберем его:
- Трафик — не весь трафик создается равным. Отслеживайте свои поисковые запросы и критерии таргетинга, чтобы избежать эффекта айсберга и получить самый качественный трафик для потенциальных клиентов или кампаний электронной коммерции.
- Призыв к действию — это самый важный элемент любой хорошей целевой страницы. Отразите температуру вашего трафика на угрозе вашего CTA. Обычно это самая быстрая процедура, которую вы можете протестировать, чтобы увидеть самые впечатляющие результаты.
- Заголовок и подзаголовок — здесь вы говорите своим посетителям, чего они могут ожидать (подсказка: отразите конечную цель посетителя), а затем поддерживаете это.
- Hero Shot — Используйте визуальное оформление в сочетании с контекстом использования, чтобы ваши посетители знали, чего они могут ожидать от вашего продукта или услуги. Ознакомьтесь с этим подробным руководством, которое мы создали, если вам нужна дополнительная помощь. Преимущества и особенности
- — Здесь вы убеждаете своих посетителей, ПОЧЕМУ они должны совершать конверсию на вашей целевой странице, четкая копия является ключевым моментом.
- Social Proof — Увеличьте вероятность конверсии, выделив отзывы клиентов, которые выдвигают возражения.
- Страница подтверждения и что будет дальше — начнем с благодарности. Но то, что сделка сделана, не означает, что ваша работа на этом остановится. Вы хотите создать постоянного клиента, который будет продолжать покупать или кричать ваш бренд с крыш о том, какой вы классный (слишком много? Ну, обзора или тематического исследования тоже может хватить).
Посмотрите эту графическую картинку ниже, чтобы увидеть забавный пример использования вышеуказанных 7 атрибутов
Помните:
«Важно знать, что делать на целевой странице, чтобы сделать ее более здоровой, сильной и, что более важно, более высокой конверсией.”
Помните, ключ к успешной целевой странице — это постоянное тестирование, чтобы вы могли вносить улучшения и развивать свой бизнес еще быстрее.
… А теперь вернемся к программированию регулярного расписания 🙂
Целевая страницаРазбивка CareChoice
Теперь мы рассмотрим каждый раздел целевой страницы CareChoice и объясним, почему одни элементы важнее других.
Наиболее распространенными разделами целевой страницы являются раздел героев, раздел социальных доказательств, раздел функций, раздел «Как это работает» и, как правило, завершение страницы нижним колонтитулом.Некоторым страницам не нужны все эти разделы, но чем больше вы знаете о каждом разделе и информации, которую он передает пользователю, тем лучше вы сможете решить, что должно и не должно принадлежать вашей странице. Мы подробно рассмотрим каждый из этих разделов ниже.
Для начала я расскажу немного о CareChoice . CareChoice — это компания B2C, которая подбирает для вас или вашего любимого человека лучшее жилье с обслуживанием в районе Атланты, штат Джорджия.
Теперь, когда у вас есть небольшая предыстория CareChoice, давайте сначала займемся разделом Hero.
Раздел героев
Ниже приведены два варианта недавнего раздела о героях CareChoice. Первый вариант имеет заголовок, который больше ориентирован на читателя (и для этого используется второе лицо), но обратите внимание, что призыв к действию «Начать работу» немного расплывчатый.
Вариант изображения героя CareChoice 1
Второй вариант больше ориентирован на то, чтобы дать потребителю знать, что CareChoice имеет «базу данных» ожидающей его информации. Призыв к действию более сфокусирован здесь: «Получите доступ к объявлениям.”
Угадайте, какой вариант, по вашему мнению, выиграл?
Вариант изображения героя CareChoice 2
И победил… Вариант 2. Но это интересно.
Почему? Потому что обычно страница с более высокой конверсией больше ориентирована на потребителя, используя более персонализированный язык, например, выбирая слово «Вы» вместо, скажем, «Бренды», чтобы привлечь внимание.
Однако победил второй вариант с более сфокусированным призывом к действию. Это помогает нам сделать вывод о важности того, чтобы люди знали, что произойдет на следующем этапе.
Можно предположить, что трафик, переходящий на эту страницу, немного теплее, потому что поиск дома престарелых специфичен. И если кто-то это ищет, скорее всего, он уже решил, что эта услуга им нужна. Так что сказать им, куда они пойдут дальше, очень важно, особенно если они уже знают, чего хотят.
Одним из наиболее важных аспектов раздела «Герой» является текст заголовка.
Помните, что у вас есть всего около 5 секунд до того, как ваш потенциальный клиент решит остаться или покинуть вашу страницу.
В этом втором варианте копия проясняет, что, выбрав CareChoice, у вас под рукой будет множество информации, готовой к поиску лучшего медицинского учреждения.
Можете ли вы представить себе, какой будет отличный дополнительный тест для этой страницы? Копия теста.
Поскольку мы находим, что людям нравится слово «база данных» (т. Е. Кажется впечатляющим, что у нас есть много разного рода информации, ожидающей вас…), и рекомендуется использовать слова, ориентированные на потребителя, Отличным новым заголовком будет: «Получите доступ к нашей базе данных, чтобы у ВАС была самая лучшая помощь в жизни в Грузии.
И, как вы могли догадаться, уточняющие вопросы тоже важны. Уточняющие вопросы могут помочь клиенту получить информацию, которую ему необходимо знать о своем клиенте, но, что, возможно, еще важнее, уточняющие вопросы используются в качестве психологической техники, чтобы вовлечь потребителя и заставить его поверить в то, что вы заинтересованы в том, что ОНИ нуждаются.
Видите? Еще один пример сосредоточения разговора на них, а не на себе.
И последнее: убедитесь, что изображение героя дает вам хорошее представление о том, что вы пытаетесь продать.Хороший тест при определении того, есть ли у вас успешное изображение героя, — это посмотреть на изображение без копии, чтобы увидеть, можете ли вы определить, в чем смысл страницы.
Если вы не можете, вы, вероятно, не выбрали отличное изображение .
Ладно … фуууу. Здесь есть над чем подумать, и, конечно же, это только начало. Переходим к разделу социальных доказательств.
Социальное доказательство Раздел
В этом разделе интересно рассмотреть то, что существует множество способов найти хорошее социальное доказательство .Некоторые сложности, с которыми я столкнулся с клиентами, заключаются в том, что, когда вы запрашиваете социальное доказательство, они могут ответить, что у них его нет.
Тем не менее, вам следует работать еще сильнее. Потому что, даже если они не думают об этом, у каждого есть какое-то социальное доказательство. Они просто могут этого еще не осознавать.
Что касается CareChoice, поскольку они работают не напрямую с другими компаниями, а с отдельными лицами, нам пришлось подумать о способе связать их с другими хорошо известными компаниями.
Когда мы изначально начали поиск отзывов клиентов, мы поняли, что в Facebook, Google и The Real Yellow Pages было опубликовано около 20 отзывов клиентов в каждом месте с рейтингом 5 звезд.
Разве не здорово ?!
Несмотря на то, что CareChoice не работает напрямую с хорошо известными компаниями, у нас есть возможность связать их с другими хорошо известными компаниями.
Важность этого опять же психологическая. Многие люди могут узнать эти три логотипа и знать, что это хорошие, устоявшиеся компании.
Добавление звезд визуально под ними добавляет еще один бонус.
Коммуникация носит визуальный характер, и сообщение быстро доходит до потребителя:
«Вы можете доверять CareChoice, потому что эти авторитетные компании связаны с нами, и наши клиенты оставили нам хорошие отзывы на своих страницах.”
Социальное доказательство CareChoice
Цитаты довольных клиентов также являются очень важной частью вашей страницы.
Подумайте об этом, вы бы предпочли поговорить с таким покупателем, как вы, чтобы проверить, хороша ли эта услуга, или с кем-то, с кем вы не можете общаться, например, с продавцом из этой компании (который явно предвзято, потому что они пытаются продать товар / услугу)?
Конечно, от кого-то вроде тебя.
Потребители с гораздо большей вероятностью совершат конверсию, когда увидят, что кто-то вроде них рекомендует услугу или продукт.Как видите, наличие этих отзывов на вашей странице делает ваш сервис более убедительным и заставляет вас казаться более привлекательным и представительным.
Давайте сосредоточимся на разделе отзывов дальше…
Свидетельство Раздел
Этот раздел отзывов также важен, потому что это хороший способ поддержать раздел социальных доказательств.
Давайте взглянем на 4 вещи, которые вы можете найти в хороших цитатах:
- Довольные клиенты, говорящие положительно
- Проблема клиента объясняется, а затем решается услугой, предоставляемой указанной компанией
- Данные (хотя у нас нет приведенных ниже отзывов, это всегда высококачественный способ показать потенциальным клиентам, что ваш продукт или услуга хорошо зарекомендовали себя для других)
- Видео-отзывы, точка.Людям нравится видеть настоящее лицо и слышать настоящий голос. Если у вас есть возможность разместить на своей странице видео, в котором кто-то объясняет, почему им так нравятся ваши услуги или продукт, скорее всего, эти конверсии будут стремительно расти.
Раздел отзывов CareChoice
Мы обсудили верхнюю половину страницы. Давайте перейдем к более подробным разделам, в которых объясняются услуги, предоставляемые CareChoice.
Здесь мы переходим к разделу «Что мы делаем».”
Что мы делаем Раздел
Поскольку CareChoice — это услуга, добавление этого раздела важно для общения с потенциальными клиентами, что именно представляет собой эта услуга. Этот раздел дает пользователям уверенность в том, что вы делаете, и объясняет, ПОЧЕМУ вы им нужны.
Обратите внимание еще раз, что большая часть языка написана от второго лица с «You» и «Yourself». Опять же, всегда максимально сосредотачиваясь на потребителе.
В будущем отличным тестом для этого раздела будет включение пошагового описания процесса поиска нужного объекта.
Отдел услуг CareChoice
При поиске услуги у людей обычно возникает много вопросов о том, что они получат от этой услуги. Итак, еще один отличный раздел для включения на страницу обслуживания — это раздел часто задаваемых вопросов. Поскольку этот сайт специально ориентирован на услуги престарелых, лучше всего отвечать на те вопросы, которые помогают людям понять, что такое вспомогательное проживание, и, опять же, ПОЧЕМУ им это НУЖНО.
Раздел часто задаваемых вопросов
Наличие раздела часто задаваемых вопросов также полезно для вашего отдела продаж.Если ваш потенциальный клиент прочитает раздел часто задаваемых вопросов, когда он начнет разговаривать с представителем, ему не придется объяснять столько, потому что ваш клиент будет лучше знать, что вы продаете и как это работает.
Следующие вопросы могут быть полезны людям, которые могут ответить, в частности, для CareChoice:
- Как мне узнать, какое проживание с уходом лучше всего соответствует моим конкретным потребностям?
- Какие услуги предоставляет помощь при проживании?
- Сколько стоит вспомогательное проживание?
- Как мне платить за вспомогательное проживание?
Раздел часто задаваемых вопросов о CareChoice
Раздел нижнего колонтитула
И последнее, но не менее важное: у нас есть нижний колонтитул.Этот раздел дает вам последний шанс убедить зрителей в том, что они должны быть заинтересованы в ваших услугах. Это должно быть мотивационным и продвигать зрителя вперед при нажатии на эту кнопку с призывом к действию. Я скажу еще раз, речь всегда идет об использовании языка, который позволяет зрителю понять, что все дело в них.
Нижний раздел CTA CareChoice
Этот раздел должен включать логотип компании и ссылки на любую другую важную информацию. например, Политика конфиденциальности, Условия использования и т. д.
Нижний колонтитул CareChoice
Имейте в виду, что есть много других разделов, которые вы можете добавить на страницу:
- Раздел «Преимущества», в котором рассказывается о положительных результатах использования ваших услуг или продуктов.
- Раздел «Как это работает» может рассказать потенциальному покупателю, как он может ожидать от вашего продукта или услуги работы.
- Раздел «Функции», в котором может отображаться список того, что включено в продукт или услугу.
На этом мы в основном завершаем изучение целевой страницы CareChoice. Надеюсь, это даст вам несколько хороших идей для вашей собственной страницы и поможет вам достичь этих целей.
Мы будем праздновать вместе с вами, когда эти конверсии произойдут.
Вот как мы это делаем. — источник изображения
Разрушение целевой страницы EZBind
Еще один клиент, с которым мы работали, — EZBind. EZBind — это компания B2C, которая продает страхование подрядным строительным компаниям.
Раздел героев
Вот два снимка раздела героев EZBind:
EZBind вариант героя 1
EZBind вариант героя 2
Эти два варианта очень похожи.
Самая большая разница здесь — это призыв к действию «Получить мое бесплатное предложение» и «Начать работу».
Я расскажу вам о грядущем секрете… Мы в KlientBoost замечаем, что чем больше мы экспериментируем с кнопками CTA, тем лучше было использовать более расплывчатый CTA, например «Начать».Причина — это низкое обязательство CTA . Если вы можете заинтересовать своего зрителя настолько, что нажмите «Начать», тогда вы продаете его на шаге 2.
Страница, на которой был главный раздел «Начать», в конечном итоге выиграла, и конверсия выросла на 8%. Итак, мы перешли к новому тесту в разделе героев.
Заявление об отказе от ответственности при тестировании под кнопкой CTA
Мы создали небольшой тест и добавили заявление об отказе от ответственности под кнопкой CTA, в котором говорится: «Кредитная карта не требуется.”
Этот тест увеличивает конверсию до 9%. Что мы можем узнать из этого теста, так это то, что зрительская аудитория озабочена предоставлением информации о кредитной карте, и иногда небольшой тест может иметь большое значение для вашей страницы.
Поскольку мы уже некоторое время работаем с EZBind и оптимизировали страницу так, чтобы она находилась в хорошем месте, создание небольших микротестов — хороший способ продолжить оптимизацию страницы, которая уже имеет высокий коэффициент конверсии.
Результаты тестирования отказа от ответственности
Итак, имейте в виду, когда ваша страница работает хорошо, создавайте меньшие (дымовые) тесты.Никогда не знаешь, какой тест повысит конверсию.
Давайте перейдем к следующему разделу, чтобы узнать больше о том, как дать ответ на вопросы клиента «Почему?».
Раздел «Почему EZBind»
Естественно, у людей возникнет много вопросов о причинах, по которым они должны выбрать EZBind для страхования своих подрядчиков. Подобно разделу «Что мы делаем» на странице CareChoice, этот раздел для EZBind убеждает потребителя, почему EZBind — лучший вариант.
Раздел «Почему EZBind»
Опять же, при написании текста для этого раздела убедитесь, что он ясен и краток. Запишите наиболее важные преимущества и продолжайте переписывать и разъяснять. Чем яснее и лаконичнее ваше сообщение, тем легче кому-то будет принять решение о конверсии.
Еще одна важная вещь, которую следует учитывать, — это пункты маркированного списка под заголовком над описанием. Зрители могут никогда не прочитать ваше описание.Убедитесь, что ваши подзаголовки просты для понимания и привлекают внимание.
Теперь, когда мы обсудили раздел «Преимущества», давайте пройдемся по отзывам.
Свидетельство Раздел
Как я уже говорил в отношении CareChoice, очень важно получать положительные отзывы клиентов. Внутри этого один из самых сильных отзывов — это тот, который находится слева, который напрямую обращается к EZBind и благодарит его за их «быстрый ответ».
Это лучший способ показать зрителям на странице, что EZBind — лучший вариант.Кто-то другой, как они, выражает добро в EZBind, и это выражение оказывается на странице, которую мы создали.
Раздел отзывов
Раздел нижнего колонтитула
Этот последний раздел заканчивается тем же призывом к действию, что и раздел героев. У вас есть два варианта. Вы можете либо сразу связать нижний призыв к действию со страницей второго шага, либо связать его, чтобы прокрутить вверх до раздела героев.
Если вы выберете последний вариант, не забудьте добавить на свою страницу скрипт smooth scroll .
В противном случае ваши клиенты могут почувствовать себя так:
Помогите мнееееее. — источник изображения
Нижний колонтитул
Завершение макета целевой страницы
Итак, в заключение, вот несколько моментов, которые следует запомнить:
- Хотя эстетически привлекательные страницы приятно смотреть, визуальная ясность важнее. Вспомните 5-секундный тест.
- Копия — самая важная часть вашей страницы. Возможно, ваш заголовок в разделе о героях — , — самые важные.Убедитесь, что вы знаете, что UVP.
- Отличные обзоры и социальные доказательства — большая поддержка делу, которое вы указали в разделе о героях. Убедитесь, что эти отзывы положительны, и покажите зрителям, почему вы лучше всего соответствуете их потребностям. Разделы часто задаваемых вопросов
- и Преимущества дадут вашим зрителям дополнительный толчок к конверсии, если они все еще не уверены. Убедитесь, что эти небольшие подзаголовки привлекают внимание и помогают в процессе принятия решений.
Ищете еще несколько отличных примеров лучших целевых страниц? Проверь их здесь .
Спасибо, что присоединились ко мне в этом путешествии по целевой странице.
До следующего раза.
54 вдохновляющих идеи дизайна посадочной страницы
Целевые страницы определяют успех маркетинговой кампании: именно они превращают посещения в продажи. Сложно разместить одну веб-страницу! Вот почему так важно придумать отличные идеи дизайна целевой страницы до того, как вы начнете. К счастью, мы здесь, чтобы помочь вам избежать аварийных посадок. Вдохновленный правильным дизайном целевой страницы, вы можете вывести свой проект на новый уровень.
Но обо всем по порядку: что такое целевая страница? Он похож на веб-сайт, но обычно на нем отсутствует навигация или ссылки. Вместо этого он часто будет иметь жирный заголовок, ориентированный на действия, а при прокрутке будет содержать некоторые ключевые моменты, чтобы подчеркнуть ценность продукта или события. Обычно это завершается каким-либо методом преобразования посетителей в потребителей и участников — часто с помощью захвата электронной почты или метода покупки. Звучит просто, правда? Но есть много способов создать целевую страницу, и только некоторые из них подойдут для вашего проекта.
Ниже мы выделили некоторые из самых популярных стилей и собрали некоторые выдающиеся идеи для дизайна целевой страницы, которые помогут вам добиться успеха!
Минимальные, целевые страницы только для типа
—
Самый простой стиль дизайна целевой страницы — это только ввод текста или отсутствие изображений. Этот тип целевой страницы создает разнообразие и эстетическую интригу, прежде всего за счет выбора шрифта, размера шрифта, выбора цвета и типографского макета. Этот стиль дизайна посылает прямое сообщение и понравится клиентам, которые думают логически и методично, или тем, кто ценит простые и понятные сообщения.
Дизайн целевой страницы от malziПрекрасным примером этого стиля является целевая страница «Место за столом» для молодежной конференции по экологическому просвещению, которая ищет спонсоров и участников. Заголовки на этом сайте набраны крупным рукописным шрифтом, который придает странице ощущение молодости. Отсутствие изображений добавляет простоты сообщения, которое направлено на упрощение нашего образа жизни или уменьшение нашего воздействия на окружающую среду. Что касается ритма прокрутки, в дизайне используется простая трехсторонняя цветовая палитра.Некоторые разделы страницы имеют не совсем белый фон, а другие — насыщенно-бирюзовый. В конечном итоге дизайн прост, и использование только текстового дизайна гарантирует, что не упустят внимание любых потенциальных посетителей, которые хотят зарегистрироваться.
Неоновые дизайны посадочных страниц
—
Нет лучшего способа сделать вашу целевую страницу популярнее, чем использовать неон. Светящиеся яркие цвета на целевых страницах ниже действительно заставляют их спрыгивать с экрана.
Но когда дело доходит до цвета, совсем не обязательно выкладываться.Иногда использование неоновых цветов в качестве акцентных цветов для важных элементов на странице может быть столь же эффективным. Посмотрите на привлекательную неоновую вдохновляющую страницу для целевой страницы ниже:
Темные дизайны посадочных страниц
—
Многие дизайны целевых страниц стараются сделать вещи светлыми и яркими, но может окупиться, если пойти другим путем. Целевые страницы в темном режиме с серым и черным фоном и лишь изредка всплывающими цветами могут создать загадочно крутой, но элегантный эффект. Их поразительная смелость делает их идеальными для брендов, которые хотят выделиться среди всех остальных.
Посмотрите, как представленные ниже идеи темной целевой страницы производят неизгладимое впечатление на посетителей:
Дизайн целевой страницы Джо Б.Дизайн посадочных страниц с коллажем
—
Некоторые маркетинговые кампании нуждаются в дизайне, который говорит как визуально, так и визуально — дизайн, который привлекает посетителей, которые менее склонны читать текст. Один из способов добиться этого — использовать коллаж или стиль изображения «вырезать и вставить». Другими словами, изображения, относящиеся к конкретному продукту, могут быть объединены в «сюрреалистическую» среду, специально созданную для продукта или события.Сопоставление этих изображений работает вместе, чтобы создать более глубокий смысл.
Целевая страница по сливочному крему momentum by eeeh_aarrhНа целевой странице для события успеха клиента Pulse, коллажены три элемента: мост Золотые Ворота, улыбающаяся женщина и логотип Pulse. Здесь использование коллажа позволяет женщине выглядеть так, как если бы она жестикулировала в сторону Сан-Франциско и приветствовала вас — то, что было бы дорого и сложно сделать на простой фотографии. Посетители, которые эмоционально связаны с этими тремя объединенными изображениями на этой странице, скорее всего, зарегистрируются.
Целевые страницы с плоскими иллюстрациями
—
Плоские иллюстрации сейчас очень популярны, когда речь идет о целевых страницах, потому что они чрезвычайно универсальны. Плоский дизайн может придать вашим целевым страницам современный вид, простой и красочный, а также его можно адаптировать практически для любой отрасли, которую только можно вообразить. Вот несколько отличных идей для создания целевой страницы с использованием плоских и полуплоских иллюстраций:
Дизайн целевой страницы от DreamMaster Дизайн целевой страницы BespokeDesignФотографические целевые страницы
—
Фотографии создают эмоциональную связь с аудиторией.Пробуждение желаемых эмоций у потенциального покупателя может заставить его правильно настроиться на покупку. Иногда достаточно простой фоновой фотографии, чтобы посетители почувствовали себя знакомыми или нужными.
Дизайн целевой страницы от 2ché Дизайн целевой страницы от PrismonlineНа страницах приложения безопасности Guard My Shit просто изображена фотография человека, держащего телефон рядом с компьютером. Посетители, у которых есть телефоны и компьютеры, увидят это и автоматически расскажут.
Однако не все фотографические целевые страницы должны быть такими буквальными.Посетите страницу для однорангового кредитования Pylon. На нем просто изображены двое молодых людей, стоящих над городом. Мы можем интерпретировать это сообщение о том, что Pylon позволяет пользователям чувствовать, что они находятся на вершине мира. Фотография создает ощущение свободы. Это вдохновляет. Люди, попадающие на эту страницу, хотят это почувствовать, и это побуждает их подписаться.
Требуется ли на вашей целевой странице демонстрация продукта, который можно легко показать на фотографии? Или вам нужно метафорическое представление вашего продукта, как на странице Pylon? Этот стиль целевой страницы может подойти вам!
Градиентный дизайн целевой страницы
—
Градиенты — это прекрасный способ придать вашей целевой странице цвет, энергию и движение, не перегружая дизайн и не отвлекая внимание от призывов к действию и заголовков.Тенденция градиентного дизайна чрезвычайно разнообразна в зависимости от используемых вами цветов. Взгляните на приведенные ниже идеи для целевой страницы, в которых градиенты используются по-разному.
Дизайн посадочной страницы от ivaЦелевые страницы с изометрическим дизайном
—
Изометрический дизайн — отличный способ объяснить сложные идеи с помощью графики на целевой странице. Изометрические рисунки дают вам больше перспективы на предмет. Возможность видеть верхнюю и боковую стороны дизайна на целевой странице заставляет посетителей хотеть узнать о нем больше.Целевые страницы с изометрической графикой также позволяют отображать больше деталей с меньшим беспорядком, что делает их идеальными для брендов, которые хотят показать, что они доступны, прозрачны и заслуживают доверия. Взгляните на некоторые отличные идеи для целевой страницы с изометрическим дизайном:
Дизайн посадочной страницы от ivaЦелевые страницы с компьютерной и технической графикой
—
Рынок компьютерных технологий и отраслей, связанных с наукой, для клиентов, испытывающих чувство страха и впечатленных технологическими достижениями.Чтобы вызвать это чувство удивления, многие технологические компании выбирают стиль дизайна, основанный на компьютерной графике. Подумайте о 3D-рендерингах, графиках, интерпретациях данных и представлениях компьютерных компонентов. Такой стиль визуального оформления часто производит впечатление на зрителя и вызывает чувство благоговения на техническом уровне или на продвинутых характеристиках продукта или услуги компании.
Возьмем, к примеру, целевую страницу Renerauld, на которой представлена чрезвычайно оцифрованная интерпретация земного шара.Это графический стиль, созданный с помощью передового компьютерного программного обеспечения. Простое использование графики в этом стиле может дать вашим клиентам ощущение того, что вы обладаете расширенными возможностями, что, в свою очередь, заставит их захотеть принять участие.
В более минималистичном дизайне целевая страница Stratejos использует тонкий фон «материнской платы» с не совсем оранжевым оттенком. Этот дизайн менее технический с точки зрения дизайна, но он все же ясно дает понять, что эта компания предлагает продукт, связанный с компьютерным оборудованием и / или программным обеспечением.В конце концов, это наверняка произведет впечатление на покупателя, который менее знаком с компьютерами, и может просто вдохновить его щелкнуть мышью!
Иллюстрированные целевые страницы
—
И последнее, но не менее важное, это широко универсальный стиль иллюстраций целевой страницы. Здесь мы говорим об иллюстрации в целом, поэтому любой стиль подходит. Вы можете использовать все, что угодно, от трехмерных иллюстраций или штриховых рисунков до нарисованных от руки дизайнов — просто выберите стиль, который лучше всего отражает индивидуальность вашего бренда.
Эти рисунки часто дружелюбны и красочны, и в них используются вымышленные персонажи, которые во многих отношениях часто кажутся более доступными, чем настоящие люди (которые иногда бывают неудобными).Если ваш бренд выступает за доступность или если ваша услуга требует особого удобства, вам может подойти иллюстрированная целевая страница.
Целевая страница буя от theink3dskullВозьмем, к примеру, целевую страницу Move’n’Cash, на которой изображена веселая команда иллюстрированных грузчиков, которые проводят лучший день в своей жизни! Это кажется доступным, и тот факт, что они проиллюстрированы, кажется почти таким, как будто вам никогда не придется даже иметь с ними дело.
Иллюстрация также может позволить компаниям визуально продемонстрировать моменты, которые было бы трудно выразить в других стилях.На целевой странице буя рука утопающего тянется к бую. Эти изображения используются, чтобы намекнуть на идею, что компания Buoy помогает вам оставаться на плаву, если вы чувствуете, что тонете в финансовом отношении. Иллюстрация — отличный выбор, учитывая, что любое реалистичное изображение тонущего человека может показаться слишком интенсивным. Этот дизайн определенно покажется беззаботным, дружелюбным и полезным для тех, кто на самом деле тонет в долгах.
Время создать свой собственный уникальный дизайн целевой страницы
—
Итак, вот и все: множество удивительных идей для дизайна целевой страницы и некоторые из основных стилей дизайна целевой страницы, которые вдохновят вас.Осталось только спросить, что пытается донести ваш стартап или компания. Если это простое сообщение, используйте простую типографику. Телевизионная реклама? Используйте коллаж. Ищете знакомство и комфорт: попробуйте большой снимок. Все о передовых технологиях? Почему бы не использовать компьютерную графику. Не забываем про иллюстрации для ярких и дружелюбных образов. Пришло время привлечь новых клиентов!
Ищете идеальный дизайн целевой страницы?
Работайте с нашими талантливыми дизайнерами, чтобы это произошло.
Эта статья изначально была написана в феврале 2017 года и была дополнена новыми изображениями и информацией.
21 отличный пример целевой страницы (+ как сделать свою собственную!)
Это сообщение в блоге было обновлено для 2020 года.
Что такое целевые страницы? Целевая страница — это страница, на которую посетитель попадает на ваш веб-сайт после нажатия на объявление (например, текстовое объявление Google или медийное объявление). Неопытные маркетологи часто направляют весь свой PPC-трафик на свою домашнюю страницу, но это может быть большой ошибкой.Конкретные целевые страницы, адаптированные к различным предложениям, необходимы для обеспечения качественного обслуживания посетителей и увеличения числа конверсий с помощью целевого сообщения, которое соответствует потребностям каждого пользователя.
Но не стоит просто проверять полученные рекомендации по работе с целевыми страницами. Что делает отличной целевой страницей ? Как сделать отличные целевые страницы с необычными показателями конверсии? Мы расскажем, что вам нужно знать, чтобы это произошло.
Перед созданием целевой страницы
Прежде чем создавать свою целевую страницу, сначала спросите себя…
1.Какая цель? Что в идеальном мире сделали бы посетители, достигнув вашей целевой страницы? Купят ли они что-нибудь? Заполнить форму? Подпишитесь на рассылку новостей? Скачать электронную книгу? Откинуть в сторону их клавиатуру, зажать губную гармошку и сыграть сладкий блюзовый рифт? Первый шаг любой стратегии — определение целей. (Вы должны определить конверсии, прежде чем сможете отслеживать конверсии.)
2. С кем я соревнуюсь? На самом деле это три вопроса: с кем я соревнуюсь, как они преуспевают и как я могу скопировать их успех? Подражание — это самая искренняя форма лести, поэтому, если ваши конкуренты делают что-то, что работает, вы должны идти вперед и последовать их примеру.Они будут вам благодарны (хотя это не обещание…)!
Вы можете попробовать Кирби. Можешь попробовать.
3. Кто моя аудитория? А каковы их надежды, мечты и стремления? Как бы глупо это ни звучало, в некоторой степени это правда — чем лучше вы понимаете свою аудиторию, тем лучше вы можете удовлетворить их желания и потребности. Если вы не знаете, кто ваши идеальные клиенты, будет очень сложно написать убедительную копию в голосе клиента.Так что войдите в голову своей аудитории, в стиле Ганнибала Лектера.
4. Как они попали на мою целевую страницу? Подумайте о том, чтобы изменить свое сообщение в зависимости от того, откуда приходят ваши пользователи — для пользователей, перешедших на вашу целевую страницу, может подойти другое сообщение из Google, а не из Twitter или Facebook. Компании с большим количеством целевых страниц (30+) привлекают в 7 раз больше потенциальных клиентов, чем компании с небольшим количеством, поэтому их ценность нельзя отрицать. В идеале вам нужна индивидуальная целевая страница для каждой группы объявлений, но это довольно сложная задача, так что начните с того, где можете.Попробуйте начать с одной настраиваемой целевой страницы для каждой кампании и добавлять оттуда для отдельных групп объявлений, когда позволяют ресурсы.
Как сделать отличные целевые страницы, конвертирующие
Теперь, когда мы рассмотрели основные вопросы перед целевой страницей, давайте обсудим, как сделать потрясающих убедительных целевых страниц. Вы также можете посмотреть выпуск подкаста по этой теме! Подкаст Head to Goal Talk, эпизод 13: Анатомия целевой страницы, приносящей прибыль.
Отличные целевые страницы…
Короткие, милые и лаконичные. Целевая страница должна предлагать всю необходимую информацию, но не настолько, чтобы ошеломлять (и, как следствие, отпугивать) посетителя. Предоставьте важную информацию, которая заинтересует вашу аудиторию, и не более того (посмотрите этот пост, чтобы получить вдохновение для целевой страницы).
Предоставляйте высококачественный контент, вызывающий доверие. Мы только что обсудили, как вы не хотите задушить посетителей информацией, но это не значит, что вы должны экономить на своем контенте — напротив, предоставляйте богатый и полезный контент, если он актуален.Хороший, уверенный контент вызывает доверие.
Все дороги ведут в Рим. Отличные целевые страницы внимательно отслеживают все пути входа и выхода на их страницу. Важно ограничить количество точек выхода (в данном случае гиперссылок), покидающих вашу страницу. Цель состоит в том, чтобы направлять посетителей по желаемому пути, и если ссылки служат отправной точкой воронки, их следует использовать с осторожностью.
Другой, более вкусный вид воронки. (Изображение из Держатель концессии )
Сделайте преобразование простым. Цель состоит в том, чтобы сделать конверсию посетителей максимально простой, обеспечивая минимальное расстояние и минимальное количество препятствий между точками A и B. Следующий шаг всегда должен быть очевиден. Эта стратегия варьируется в зависимости от желаемой конверсии. Если это отправка формы, сделайте ее неотразимой конфеткой для глаз. Если он загружается, сделайте кнопку, на которую нужно щелкнуть.
Имеют безупречный дизайн. Здесь играет роль информационная архитектура, так как важно, чтобы целевая страница имела ясный, четкий дизайн, который дает ответы на все вопросы, не вдохновляя на новые.Навигация должна быть очевидной и простой, должна быть предоставлена вся необходимая информация, и между посетителем и конверсией не должно быть ничего (иначе говоря, никаких всплывающих окон!). По возможности посетители должны иметь возможность конвертировать в один клик. Пусть каждый дополнительный щелчок будет давить на вашу совесть, как бьющееся сердце под половицей.
Очень крутая иллюстрация Tell-Tale Heart от Daniel Horowitz .
Имейте четкий призыв к действию. Призыв к действию может присутствовать в тексте заголовка, а также в тексте кнопки (например: «отправить» или «загрузить бесплатное маркетинговое руководство»). Не должно быть никаких сомнений в том, какие дальнейшие шаги необходимы — расскажите своим посетителям, что именно вы хотите, чтобы они делали, крупным жирным шрифтом. Для Kajabi изменение текста кнопки с «Посмотреть планы и цены» на «Начать работу сегодня» увеличило конверсию на 252%!
Создавайте привлекательные заголовки. Большинство хороших целевых страниц используют основной заголовок для подтверждения предложения и используют подзаголовок для дополнительных объяснений или ценностного предложения (например, почему ваше предложение потрясающее).Примером может быть: «Бесплатная электронная книга по маркетингу в Facebook (заголовок). Узнайте, как получить больше подписчиков, лайков и вовлеченности в Facebook от наших гуру маркетинга (подзаголовок)». В приведенных ниже примерах вы увидите множество отличных заголовков целевых страниц, и вы увидите, что некоторые их инвертируют, так что ценностное предложение становится заголовком.
Содержит привлекательную копию. Kiss Metrics предлагает использовать определенные «гипнотические» слова входящим посетителям. Использование слова «вы» заставляет посетителей воспринимать вашу копию как личную и позволяет вести интимную беседу.Слово «воображать» побуждает читателей визуализировать использование вашего продукта и увеличивает желание. Включение слова «потому что» объясняет посетителям, почему они должны предпринять определенные действия. Попробуйте эти умопомрачительные слова на своей целевой странице.
Сделайте это о посетителе. Не надоедайте посетителю, слишком много рассказывая о себе (это правило применимо ко многим сферам жизни). По правде говоря, посетителей не волнуют ваши цели или стремления. Они ищут только №1. Продемонстрируйте , что вы можете сделать для них и как вы можете улучшить их жизнь.В конце концов, мы эгоистичные существа.
При необходимости используйте видео. Целевые страницы с видео могут сделать сложные продукты более доступными и в то же время развлечь ваших посетителей.
Отличное предложение. Самый простой способ получить конверсию — просто сделать невероятное предложение. Убедитесь, что ваше предложение достаточно заманчиво для пользователей и что они действительно этого хотят. Расскажите, почему ваше предложение круто, и все готово.
Легко сканировать с первого взгляда. Крайне важно, чтобы посетители могли уловить суть вашего предложения с первого взгляда. По оценкам, у вас есть около 8 секунд, чтобы убедить пользователей остаться на вашей странице, поэтому ценностное предложение должно быть быстрым и убедительным. При создании целевой страницы упростите сканирование, выделив основную мысль в заголовке, используя подзаголовки и маркеры для дополнительной информации. Используйте шрифты и цвета для обозначения иерархии информации. Как отмечает Якоб Нильсен, посетители вашей страницы — это дикие обезумевшие животные, которые ищут быстрой еды, так что подавайте ее быстро!
Содержите актуальные качественные изображения. Яркие, привлекательные изображения делают страницу более привлекательной и удобнее для пользователей. Подумайте о добавлении визуальных подсказок, которые подсказывают посетителю, что им делать дальше. Вы можете пойти очевидным путем со стрелками или попробовать что-нибудь более тонкое, например, сделать яркую кнопку центром внимания на странице.
Выглядите великолепно и стильно. Внешний вид — это еще не все, но он имеет значение в дизайне целевой страницы. Почему привлекательный мужчина может поладить с женщиной, используя ту же фразу, которая может назвать менее эстетичного парня «ползучим»? На самом деле, несмотря на то, чему мы учим детей, внешний вид меняет восприятие.Ваша целевая страница не должна выглядеть жутко, она должна выглядеть супер классно. Если посетитель — цыпочка в баре, вы хотите поразить ее и отвезти домой…. для увлекательной игры в Эрудит!
Соответствует тексту объявления. В отличных целевых страницах используются те же ключевые слова, что и в тексте контекстной рекламы — связь должна быть очевидной, а последовательность убеждает посетителей в том, что они на правильном пути. Не отправляйте никого на страницу о палатках для кемпинга, если в вашем объявлении были спальные мешки.И не отправляйте их на общую страницу и не заставляйте их искать продукт, который они искали.
Спрашивайте только ту информацию, которая им нужна. Этот совет также появляется в нашем посте по созданию убийственных целевых страниц «скоро». Чем больше полей вы просите посетителей заполнить в вашей форме, тем меньше у вас шансов, что они заполнят ваше предложение. Если для вашего преобразования требуется форма, получите минимум того, что вам нужно — вы всегда можете запросить дополнительную информацию на странице с благодарностью, как только дело будет сделано.Хотя у большинства пользователей нет проблем с указанием своего имени и адреса электронной почты, запрос информации о номерах телефонов и дате рождения может привести к тому, что процент отказов от них вырастет до 50%. Практическое правило — не включать более семи полей в форму для генерации лидов на целевой странице.
Используйте цвет в своих интересах. Любой студент, изучающий искусство, может объяснить силу цвета в изменении человеческого восприятия. Пикассо не прошел через синюю фазу, потому что он был таким беспечным парнем.
Это похоже на картину, написанную кем-то, кто любит жизнь?
В книгах по дизайну интерьера часто предлагаются разные цвета для разных комнат и настроений — бодрящий красный для столовой, вдохновляющий на динамичную беседу, желтый для веселой, непринужденной кухни. Та же самая теория цвета должна быть реализована в дизайне вашего сайта. Многие маркетологи утверждают, что определенные цвета кнопок, такие как зеленый или красный, увеличивают конверсию целевой страницы, но в конечном итоге вы хотите сосредоточиться на контрасте цвета кнопки по отношению к цвету вашего фона.У Пола Олислагера есть хорошее руководство по кнопкам CTA, которое стоит проверить. Попробуйте разные цвета, места размещения и размеры, чтобы увидеть, что работает!
Имеют интерактивные кнопки общего доступа. Многие люди более чем счастливы сообщать о недавней покупке или делиться ресурсом, который они сочли полезным. Добавление кнопок общего доступа увеличивает ваши шансы на распространение вашего контента в социальном пространстве, а на отличных целевых страницах эти кнопки широко используются. Также разумно добавить кнопки социальных сетей на страницу благодарности, поскольку пользователи с большей вероятностью поделятся вашим отличным предложением с другими после того, как они сами зарегистрируются.В качестве дополнительного бонуса отображение ваших «лайков» и подписок также может служить подтверждением из уст в уста.
Показать восторженные отзывы. Молва была и всегда будет движущей силой успеха. Виртуальная молва приходит в виде лайков, отметок +1 и отзывов клиентов в Интернете (желательно из надежных источников, таких как крупные бренды). Если ваша компания в прошлом получала блестящие комплименты, не забудьте продемонстрировать их.
Мобильны. Наличие сайта, который хорошо работает с мобильными устройствами, может удвоить ваши конверсии. Если вы хотите узнать больше, ознакомьтесь с нашим руководством по созданию веб-сайтов, удобных для мобильных устройств.
В завершение — страница с благодарностью. Страница благодарности — отличный способ направить посетителей к другим связанным материалам на вашем веб-сайте, которые могут быть им интересны. Добавление этой дополнительной информации на исходной целевой странице отвлекало бы и могло бы увести посетителей от совершения конверсии. . Однако теперь, когда вы заключили сделку, страница с благодарностью является идеальным местом для предложения сопутствующих товаров, руководств и информации, которые могут оказаться полезными для вашей аудитории, или ссылок на другие разделы вашего сайта, например блог вашей компании.
Рассылка сигналов доверия. Знаки доверия, такие как логотипы известных компаний, с которыми вы ведете дела, полученные вами награды и ассоциации, в которых вы состоите, укрепляют доверие в сознании посетителя. Хорошая целевая страница делает все возможное, чтобы успокоить и успокоить посетителей, чтобы они могли уверенно совершить конверсию.
Быстры, как Феррари. Скорость важна, так как время загрузки оказывает огромное влияние на показатель отказов.Отличная целевая страница построена как пуля, поэтому возьмите секундомер и заставьте целевую страницу двигаться быстрее. Сократите время загрузки, не увеличивая размеры файлов изображений, используя инструменты кеширования и быстрый веб-хостинг (некоторые из них намного быстрее, чем другие).
Фото Джейсон Голдинг
Пройдено много раундов A / B-тестирования. Тестирование и исправление — это то, как мы учимся и становимся лучше.A / B-тестирование вашей целевой страницы (настройка отдельных элементов и проверка их эффективности по сравнению с предыдущей настройкой), вероятно, является самым мощным инструментом для создания отличных целевых страниц. Не уверен, где начать? «Сигнал против шума» — прекрасный пример хорошего A / B-тестирования, который легко читать. Всегда есть вещи, которые можно улучшить, так что никогда не прекращайте тестирование!
Относитесь к посетителям как к диким животным. Звучит безумно, но это правда — посетители вашей страницы — обезумевшие существа, ищущие быстрой и легкой еды.Ключевым моментом является то, чтобы вашу страницу было легко сканировать, указав главное в заголовке, при этом используя подзаголовки, маркеры, а также различные шрифты и цвета для обозначения иерархии информации.
Включено отслеживание конверсий. В WordStream мы много говорим о важности отслеживания конверсий, и это один из лучших методов, который мы пропагандируем в нашем новом модуле оценки целевой страницы. Убедитесь, что вы правильно настроены, чтобы отслеживать, как работают ваши страницы. В противном случае вы будете тратить деньги в темноте.
21 пример отличных посадочных страниц
У нас есть несколько примеров отличных целевых страниц, чтобы лучше проиллюстрировать, почему успешная целевая страница способствует конверсиям.
Short Stack помогает компаниям организовывать и управлять рекламными акциями Facebook и другим персонализированным контентом Facebook. Посмотрим, что здесь хорошо выглядит.
- Яркие цвета, хорошо сочетающиеся друг с другом
- Эта страница чистая и не загромождена минимальным количеством текста, но все же объясняет ценностное предложение.
- Содержит интерактивное видео для более подробного описания Short Stack
Прочтите этот пост, чтобы получить более подробные советы по целевым страницам Facebook.
Gift Rocket — еще один сайт с хорошей целевой страницей. Что делает Gift Rocket правильно?
- Сильный графический элемент привлекает внимание Заголовок
- объясняет в нескольких коротких словах, что такое Gift Rocket.
- Небольшие маркированные информационные блоки под заголовком можно легко сканировать
- Кнопка CTA четкая и удобная
- Социальные кнопки присутствуют
- Дополнительную информацию можно найти, прокрутив страницу под сгибом
- Сигналы доверия и отзывы существуют ниже сгиба
Kiss Metrics имеет настраиваемую целевую страницу для посетителей, интересующихся набором своих маркетинговых инструментов.Что здесь работает?
- Четкий заголовок, объясняющий коммерческое и ценностное предложение
- Минималистичная форма, запрашивающая только адрес электронной почты
- Яркая красочная кнопка
- Множество сигналов доверия
Social Sprout (представленный в нашем руководстве по инструментам управления социальными сетями) — еще один пример мощной целевой страницы. В нем есть несколько элементов, которые действительно работают в его пользу, например:
- Сильный заголовок, объясняющий, что такое Social Sprout, без всякой ерунды.
- Визуально привлекательный дизайн, подчеркивающий эстетику самого программного обеспечения с помощью снимков экрана
- Отзывы представлены в нижней зеленой полосе
- Зеленая пробная кнопка расположена по центру и доминирует на странице, с заманчивым призывом к действию и пометкой «кредитная карта не требуется» под кнопкой для дополнительного поощрения.
С программным обеспечением, аналогичным Social Sprout, HootSuite — еще один веб-сайт с хорошей целевой страницей, хотя и использует другой подход.Это хорошо работает, потому что это:
- Обеспечивает возможность входа в HootSuite из других доверенных сетей, что означает, что посетителям не нужно заполнять столько полей формы, поскольку большая часть информации предоставляется при входе в
- Подчеркивает, что программное обеспечение можно бесплатно начать с
- Имеет очень очевидные и заметные свидетельства доверия и отзывы
Pinterest отличается тем, что они не тратят много времени на объяснение того, что такое Pinterest, поскольку могут предположить, что большинство людей уже слышали о них.Вместо этого при каждом посещении сайта показывается другой пример ценности Pinterest с более широким объяснением Pinterest (найдите и сохраните все, что вас вдохновляет), которое находится под основным заголовком. Что здесь делает Pinterest?
- Легко начать — просто нажмите одну из двух кнопок
- Pinterest подчеркивает, насколько легко зарегистрироваться, говоря, что это занимает всего 45 секунд
- Использует базу пользователей как фактор доверия. Любой сайт с более чем 25 миллиардами элементов пользовательского контента должен что-то делать правильно
Airbnb позволяет легко снимать дома или комнаты у людей со всего мира в условиях все более ориентированной на акции экономики.Что здесь хорошо смотрится?
- Заманчивые фотографии, которые сразу же вызывают восторг у посетителей от перспективы путешествия
- Краткая и простая форма ввода, позволяющая посетителям сразу находить места для проживания
- На этой странице мало что происходит, кроме функции поиска места назначения / отметки на рейс, поэтому посетители не потеряются и не будут ошеломлены.
Lyft — альтернатива Uber для совместного использования пассажиров.
- В заголовке явно выделяются конкретные цифры, на которые естественным образом обращено внимание.
- Использует схему дизайна с F-образным рисунком, чтобы привлечь посетителей сайта в нижнюю часть страницы, где они могут конвертировать
- Не перегружает посетителя сайта слишком большим количеством копий
- CTA-кнопка четко выделяется на монохромном фоне
Constant Contact — это программное решение, которое помогает малым предприятиям проводить маркетинговые кампании по электронной почте.
- Облегчает преобразование super — все, что требуется, — это адрес электронной почты
- CTA-кнопка гарантирует посетителю сайта, что конверсия не будет стоить ему денег
- Хотя копии немного, она отправляет очень заманчивое сообщение.
LeanBox продает интеллектуальные холодильники на рабочем месте, которые используют машинное обучение, чтобы определять, какие предметы нравятся сотрудникам больше всего.
- Кратко обращается к общей проблеме в заголовке
- Короткое анимационное видео дает посетителям сайта увлекательный способ узнать больше
- Цитата из признанной на национальном уровне газеты является убедительным социальным доказательством
- Форма не слишком длинная, поэтому преобразовать
Wix помогает как частным лицам, так и компаниям создавать простые и красивые веб-сайты.
- Минимальная копия позволяет невероятно легко понять, что предлагает Wix.
- Посетителям сайта не нужно предоставлять какую-либо информацию, чтобы начать работу
- Кнопка CTA находится по центру и отчетливо окрашена
- Пример встроенной целевой страницы позволяет посетителям сайта представить, что они могут создать.
Blue Apron — это служба подписки на питание, которая доставляет ингредиенты прямо к дверям потребителей.
- Заголовок посвящен распространенной проблеме недостатка времени, необходимого для приготовления хорошей еды
- Кнопка CTA предлагает конкретную скидку, а копия прямо под ней создает дефицит
- Таблички справа и слева от кнопки CTA привлекают посетителей возможностями
- Нижняя половина страницы демонстрирует простоту процесса
Flock — это приложение, которое упрощает общение между сотрудниками, работающими в одной компании.
- Заголовок подчеркивает необходимость централизованной и эффективной коммуникации на рабочем месте \ Подзаголовок
- подчеркивает разнообразные функции, доступные в приложении
- С одним информационным полем преобразование не может быть проще
Squarespace, как и Wix, помогает частным лицам и компаниям создавать веб-сайты.
- Элегантный креативный дизайн и минимальное количество копий для очень приятного визуального восприятия
- Копия заголовка устанавливает авторитет в отрасли
- Посетителям сайта не нужно предоставлять какую-либо информацию перед началом работы
- Пример встроенного веб-сайта приглашает посетителей представить собственные возможности
Shopify продает программное решение, которое помогает частным лицам и компаниям создавать интернет-магазины для своих веб-сайтов.
- Заголовок и подзаголовок лаконично и точно соответствуют намерениям посетителя сайта
- Визуальный креатив показывает 1) что покупатели Shopify могут создавать и 2) что магазины Shopify работают на всех устройствах
- Относительно долгий период бесплатного пробного предложения заманчиво
- Для запуска процесса требуется только адрес электронной почты
Trendy Butler — это служба подписки на одежду, которая использует машинное обучение для индивидуализации гардероба потребителей.
- Заголовок выделяет специальное предложение
- F-образный узор направляет взгляд посетителя на кнопку с призывом к действию Подзаголовок
- усиливает болевую точку, которую решает Trendy Butler
- Информация не требуется, чтобы начать работу
Harry’s — это служба подписки на туалетные принадлежности, которая доставляет потребителям на дом все необходимое для бритья.
- Заголовок отражает чувство собственного достоинства посетителя сайта Подзаголовок
- гарантирует удобство по запросу, необходимое потребителям.
- Минимальная копия позволяет использовать изображения продуктов для обмена сообщениями
- Невероятно легко преобразовать
Exact Data представляет собой программное решение, которое централизованно хранит маркетинговые данные предприятий.
- Обратный отсчет до конца специального предложения создает ощущение срочности
- Наиболее заметная часть заголовка отражает то, что ищет посетитель сайта
- Резкий контраст между цветом фона и цветом кнопки CTA
- Форма не требует много информации
Smart Sheet помогает частным лицам и предприятиям максимизировать эффективность с помощью программного решения для планирования.
- Заголовок сразу обращается к цели посетителя сайта
- Для запуска бесплатной пробной версии требуется только адрес электронной почты
- Статистика клиентов и логотипы служат убедительным социальным доказательством
Bloomsy Box — это служба подписки для дома и сада, которая доставляет собранные вручную цветы к дверям потребителей.
- Великолепное фоновое фото вызывает у посетителя покупательское настроение Подзаголовок
- удовлетворяет спрос на устойчивые решения
- Обеспечивает экономящую время вторую кнопку CTA для тех, кто пытается купить подарок.
21 лучший пример целевых страниц для изучения из
Этот пост последний раз обновлялся 10 июня 2020 г.
После того, как вы открыли свой бизнес и успешно создали свой веб-сайт, пора начать привлекать потенциальных клиентов.Итак, каков наиболее эффективный способ получить ценную информацию или заинтересовать посетителей вашего сайта? Целевые страницы, также известные как LP. Почему? Потому что их легко создать, они доступны по цене и чрезвычайно эффективны.
В отличие от традиционного веб-сайта, где посетителям предлагается просматривать несколько страниц и категорий, целевая страница является одностраничным веб-сайтом. Причина этого очень проста: целевая страница служит одной цели и только одной цели. Он должен содержать одно четкое сообщение, подкрепленное описательным заголовком, несколькими привлекательными визуальными эффектами и увлекательным CTA (призывом к действию).Будь то продажа продукта, привлечение новых подписчиков по электронной почте или регистрация на мероприятие, этот мощный инструмент онлайн-маркетинга может стимулировать конверсию для любых целей, которые могут вам понадобиться.
В отличие от стандартного веб-сайта, на который посетители попадают с разных маршрутов и с разными целями, целевые страницы являются скорее маркетинговым активом. Компании продвигают свои целевые страницы через социальные сети и платную рекламу в Google. Думайте об этой странице как о месте, куда «попадают» потенциальные клиенты, когда они нажимают на вашу ссылку Google Рекламы.
Из-за разнообразия отраслей, в которых используются целевые страницы, не говоря уже об огромном количестве целей, которым они служат, не существует волшебной формулы, которая гарантированно работает для всех (к сожалению). По этой причине лучше обратиться к существующим примерам, чтобы узнать и понять, какие основные ингредиенты необходимы для создания успешного LP. После этого вы можете использовать конструктор целевой страницы, чтобы создать собственную эффективную целевую страницу.
Вот 21 из лучших примеров целевых страниц, которые вы найдете:
21 лучший пример целевых страниц
От электронной коммерции до гостеприимства и от веб-дизайна до интернет-маркетинга, давайте рассмотрим некоторые из лучших примеров целевых страниц. .Мы объясним, почему каждая целевая страница эффективна и что вы можете изучить и реализовать при создании своей собственной.
01. Wix.com
Начнем с чего-нибудь знакомого. Если вы еще не знаете, Wix — это платформа для создания веб-сайтов, которой пользуются почти 200 миллионов человек по всему миру, от владельцев малого бизнеса до блоггеров, художников, владельцев магазинов и т. Д.
Эта целевая страница — одна из многих, используемых Wix для привлечения потенциальных клиентов, которые хотят начать свое онлайн-путешествие.Первая часть включает в себя все основные элементы, которые вы ожидаете найти при создании мощной целевой страницы: логотип компании, простой и информативный заголовок, одно последовательное сообщение, привлекательные и подходящие визуальные эффекты и заметный призыв к действию.
Давайте подробно рассмотрим некоторые из этих элементов.
Что вы можете узнать из целевой страницы Wix:
Включите заметный CTA: CTA должен быть героем вашей целевой страницы. Не бойтесь выражаться прямо в формулировках и выделять цвета жирным шрифтом.Сообщение «Начать сейчас» четкое и передает легкую срочность, в то время как синий цвет выделяется на светло-оранжевом фоне. Вот еще несколько советов по созданию конверсионных призывов к действию:
Делайте это кратко, от двух до четырех слов.
Используйте ориентированные на действие глаголы, такие как «Get» и «Subscribe».
Добавьте тонкий намек на убеждение и срочность.
Используйте язык, соответствующий идентичности вашего бренда.
Будьте как можно более прямыми. Пользователи должны точно знать, чего ожидать после того, как они нажмут на ваш CTA.
Используйте привлекательные визуальные эффекты: Wix украсила свою целевую страницу увлекательной и запоминающейся цифровой иллюстрацией, которая продолжается по всей длине страницы. На верхнем изгибе изображена гора, вершина которой указывает прямо на CTA, привлекая взгляд посетителей прямо к кнопке.
Изображения гор связаны с идеей достижения новых высот, возможно, путем создания веб-сайта.Изображение (или изображения), которое вы выбираете для отображения, должно быстро и эффективно отражать цель вашего продукта или услуги.
Свернуть прокрутку: Вся важная информация должна отображаться «над сгибом» (часть веб-сайта, которую можно просмотреть на экране до того, как посетителям придется прокрутить вниз). Этот контент должен приветствовать вашего посетителя с того момента, как он перейдет по вашей ссылке.
В этом примере логотип, заголовок, призыв к действию и визуальные элементы доступны зрителю в верхней части страницы.Если ваша целевая страница требует больше информации и, следовательно, больше места, вы можете использовать направленные визуальные подсказки, такие как стрелки, чтобы предложить им прокрутить вниз. В этом случае водный мотив — это то, что побуждает посетителей продолжать прокрутку, связывая вместе различные элементы целевой страницы.
02. Vimeo для бизнеса
Vimeo — это сайт видеохостинга, созданный группой кинематографистов для профессиональной аудитории. Компания предоставляет создателям инструменты и технологии для размещения, распространения и монетизации видео.Они предлагают различные планы в соответствии с различными функциями, которые могут понадобиться пользователям, от базовых до премиальных.
Этот тип целевой страницы специально нацелен на пользователей, которым нужны видеорешения для своего бизнеса. Неудивительно, что каждая функция показана с помощью видео вместе с кратким описанием и характеристикой каждой из них. Заявление о миссии выделено жирным и ясным шрифтом, за ним следует прямой призыв к действию: «Получите Vimeo Business».
Что вы можете узнать на целевой странице Vimeo:
Знайте свою аудиторию: Поскольку целевые страницы не являются универсальными -подходит для всех, при написании контента для веб-сайта важно понимать свою аудиторию.Тон и содержание текста на этой странице в значительной степени адаптированы для крупных компаний. Это видно в заголовке «Больше взаимодействия, больше сотрудничества, больше роста вашего бизнеса», а также в других разделах на странице. Они поняли, чего хотят достичь компании, и четко изложили это.
Исключите всю другую навигацию: Ваша целевая страница должна иметь четкую цель: превращать посетителей в потенциальных клиентов. Поэтому удалите все ссылки, которые потенциально могут отпугнуть ваших посетителей.Нет необходимости включать меню веб-сайта, ведущее на несколько страниц. Vimeo включает только один последовательный призыв к действию на всей странице, чтобы повторить одно и то же сообщение: «Получите Vimeo Business».
03. Udemy для бизнеса
Udemy — это глобальный рынок онлайн-курсов всех форм и размеров. От науки о данных до графического дизайна и маркетинга в социальных сетях доступны тысячи программ для обучения и преподавания в Интернете. Предоставляя людям возможность учиться, не выходя из дома, Udemy стремится помочь людям улучшить свои навыки и реализовать свои видения.
Хотя пользователи могут индивидуально записаться на курсы, эта целевая страница продвигает бизнес-план Udemy. Он предлагает компаниям платформу, с помощью которой они могут обучать и обучать своих сотрудников, предоставляя им дополнительные возможности и знания по ряду тем. Это может помочь предприятиям поддержать своих сотрудников при удаленной работе и дать им возможность продолжать карьеру.
Используя открытый текст и фотографию, чтобы задать тон, Udemy мгновенно объясняет, в чем суть их решения для бизнеса.Верхний сгиб светлый и просторный, по сравнению с остальной частью страницы, имеющей более динамичный дизайн, благодаря чему посетители остаются вовлеченными во время прокрутки.
Что вы можете узнать на целевой странице Udemy:
Создайте интересный опыт: Благодаря динамическому фону каждая складка выглядит немного по-другому, создавая захватывающий опыт прокрутки. В то же время Udemy постаралась сохранить общую эстетику, придерживаясь цветов своего бренда и определенного макета.Включение изображений, видео и отзывов, которые появляются в формате слайд-шоу, удерживают посетителей на экране.
Оптимизация для мобильных устройств: Ваша целевая страница должна быть оптимизирована для мобильных устройств — здесь нет двух вариантов. Фактически, учитывая количество людей, использующих мобильные устройства, мобильная версия вашей целевой страницы может даже привлечь больше трафика, чем версия для настольных компьютеров.
Этот LP идеально оптимизирован для мобильных устройств, с фиксированными CTA, которые следуют за читателем, когда он перемещается по сайту.Они оставили только самую важную информацию в верхней части своего мобильного веб-сайта, исключив изображение, но обеспечив, чтобы призыв к действию был хорошо заметен.
04. Mondaine
Хотя большинство целевых страниц состоят из одних и тех же ключевых элементов, на этой странице используется несколько иной подход. Созданный для Mondaine, коллекции часов, вдохновленной знаменитым шрифтом Helvetica, сайт раскрывает мыслительный процесс, лежащий в основе дизайна.
Вместо заметных призывов к действию, которые появляются в верхней части страницы, здесь используется более осторожный метод.Прокручивая страницу вниз, вы обнаруживаете все, от сходства между шрифтом и часами до незавершенных эскизов продуктов Mondaine. Такой подход помогает привлечь посетителей, пробуждая их любопытство и вовлекая их в предысторию, а не только в конечный продукт.
Несмотря на то, что визуальной и текстовой информации много, она разбита на управляемые фрагменты благодаря продуманной прокрутке и включению анимации веб-сайтов.Сохраняя верность классическому формату целевой страницы, вы найдете ряд кнопок, разбросанных по всему сайту, приглашающих посетителей просмотреть полный каталог. В верхней части экрана также есть фиксированное гамбургер-меню со ссылками, которые перенаправляют вас на веб-сайт компании.
05. Deliveroo
Компания по доставке еды Deliveroo, основанная в Великобритании, теперь работает во многих городах мира. В то время как их центральный веб-сайт ориентирован на клиентов, доставляющих еду, эта целевая страница предназначена для ресторанов, которые хотят сотрудничать с Deliveroo.
Очевидно, что компания определила потребности своего целевого рынка и определила главную цель своей целевой страницы. Это помогает отличить их основной веб-сайт от этого. Каждая копия и дизайнерское решение были адаптированы к их цели.
Вместо фотографий аппетитных салатов и свежих пирогов с заварным кремом, общий дизайн больше ориентирован на бизнес. Видео вверху посвящено ресторанам и доставке, а не клиентам.Есть также короткое пояснительное предложение, которое мгновенно подчеркивает, что рестораны могут получить от сотрудничества с Deliveroo. Простая статистика помогает усилить это сообщение.
Что вы можете узнать на целевой странице Deliveroo:
Используйте онлайн-формы: Онлайн-формы, часто используемые на целевых страницах, могут помочь компаниям собрать важную информацию о клиентах. Однако, если они будут слишком длинными или сложными, клиенты, скорее всего, оттолкнутся. В этом случае Deliveroo включил только самые важные детали и упростил заполнение формы благодаря удобным раскрывающимся спискам и четкой маркировке.
Включите политику конфиденциальности: Если в вашей форме запрашивается конфиденциальная информация, вы должны убедить посетителей в том, что их информация в безопасности, выделив свою политику конфиденциальности. Таким образом, они будут более склонны подчиняться. Deliveroo добавила ссылку на свою политику конфиденциальности прямо под кнопкой «Отправить», что сделало ее более заметной для посетителей своих сайтов.
06. Epicurrence
Веб-сайт этого мероприятия Epicurrence продвигает их двухдневную конференцию для креативщиков.Это единственное в своем роде мероприятие, объединяющее приключенческие виды спорта и занятия с интимными интерактивными обсуждениями, прекрасно отражено в этом уникальном примере целевой страницы.
В дизайне сочетаются элементы классической целевой страницы с интригующей копией, атмосферными иллюстрациями и, казалось бы, сделанными вручную диорамами, которые намекают на само событие. Несколько смелых, хорошо подобранных слов задают тон верхней части страницы. CTA остается на месте, пока вы прокручиваете страницу вниз, приглашая посетителей купить билет, но не слишком настойчиво.Небольшие, но продуманные дополнения, такие как виджет для контроля времени дня на заснеженной горе, приглашают пользователей взаимодействовать и задерживаться немного подольше.
Просмотр веб-сайта больше похож на то, как будто вы уютно завернулись, слушая историю у костра, чем прокручивая вниз то, что в конечном итоге является маркетинговым активом. Благодаря тонкому эффекту прокрутки параллакса, тонкому тексту и мечтательным полноэкранным иллюстрациям, общее впечатление захватывающее, благодаря чему дополнительные призывы к действию внизу сайта кажутся совершенно естественными.
07. Dropbox Paper
В основном известная своей службой хостинга файлов, Dropbox предлагает ряд дополнительных инструментов и функций. Этот пример целевой страницы продвигает Dropbox Paper, рабочее пространство для совместной работы для команд любого размера. Платформа, позволяющая удаленным командам эффективно работать вместе, включает в себя инструменты для мозгового штурма, инструмент, помогающий проводить более эффективные встречи, и многое другое.
Dropbox использовал чудеса визуальной иерархии на всей целевой странице, особенно в верхней части страницы.Этот раздел, состоящий всего из нескольких слов, прекрасно отражает суть их продукта. Благодаря использованию крупного текста внимание посетителей сайта мгновенно привлекается, помогая им понять, о чем идет речь в продукте. Микрокопия меньшего размера дает больше подробностей о продукте, а анимация помогает прояснить сообщение.
Далее по сайту очень чистый и просторный дизайн сочетается с пояснительным текстом и видео, плюс четко определенные кнопки и фиксированное меню, которое гарантирует, что вы можете легко зарегистрироваться в любой момент.Они также включили отзывы различных команд и компаний, наглядно демонстрируя посетителям, что их команды могут получить от использования платформы. Использование слова «рассказы» вместо «отзывы» делает тон более понятным, благодаря чему текст кажется ценным и заслуживающим доверия.
Что вы можете узнать из целевой страницы Dropbox:
Добавьте пустое пространство: Независимо от цели вашей целевой страницы, она должна быть эстетичной. Пробел — это термин, обозначающий расстояние между различными элементами.
Добавление пробелов в макет вашего веб-сайта имеет решающее значение, так как это позволяет вашему контенту дышать, и в то же время гарантирует, что ваши посетители не будут чувствовать себя перегруженными информацией. Dropbox достигает этого, создавая просторный дизайн и добавляя слайд-шоу, которые помогают распределить контент.
08. Синий фартук
Планирование и приготовление трехразового питания может быть сложной задачей, особенно когда ваш распорядок дня до краев заполнен другими задачами и занятиями. Введите: Синий фартук. Эта служба доставки на дом позволяет вам выбрать еженедельное меню для вас и вашей семьи.Затем доставка свежих ингредиентов и рецептов будет доставлена прямо к вашей двери. Это решение поможет вам сэкономить время и свести к минимуму потери пищи.
Эта целевая страница нацелена на пользователей, впервые использующих Blue Apron, поскольку они стремятся привлечь новых потенциальных клиентов с помощью привлекательного вступительного предложения. Их логотип, заголовок и призыв к действию можно найти спереди и в центре первого сгиба. Кроме того, вся их информация окружена восхитительно выглядящими высококачественными фотографиями еды.
По мере дальнейшего изучения объяснение того, как работает их служба, отображается на временной шкале изображений и текста.Далее следуют все причины, по которым вам стоит попробовать Blue Apron, и отзывы покупателей — все очень убедительно.
Важно отметить, что их призыв к действию остается неизменным на всей странице. Он появляется несколько раз, гарантируя, что, когда посетитель убежден и принял решение заявить о своем предложении, ему не нужно будет слишком много прокручивать, чтобы нажать на этот важнейший CTA.
Что вы можете узнать на целевой странице Blue Apron:
Представьте заманчивое предложение: Blue Apron представляет собой предложение, от которого не может устоять большинство людей, ищущих простое решение для приготовления пищи.После того, как они объяснили вам все причины, по которым вам нужно попробовать их услуги, Blue Apron предлагает скидку в размере 60 долларов. Под предложением небольшая линия (или легкое подталкивание), объясняющее, что сделка не продлится долго. Строка «Не пропустите» играет на чувстве FOMO (страха пропустить), которое эффективно, но не слишком напористо или продажно.
Сохраняйте ясность при обмене сообщениями: При разработке любого веб-сайта важно учитывать малую продолжительность концентрации внимания. Когда дело доходит до целевых страниц, особенно важно зацепить посетителей за пару секунд.Чтобы превратить посетителей веб-сайта в клиентов, ваше сообщение должно быть кристально ясным. Blue Apron освоили копию своего веб-сайта, сделав его простым, но не упрощенным. Их текст дружелюбный, понятный и легко просматриваемый — идеально подходит для современного обычного интернет-браузера.
09. Ferretly
Этот технологический подход к найму использует искусственный интеллект для выявления потенциальных рисков, связанных с присутствием кандидата в Интернете. Целевая страница Ferretly, одного из лучших бизнес-сайтов, нацелена на другие компании, которые могут быть заинтересованы в их передовых решениях по найму.
Сайт Ferretly, созданный на Wix, включает в себя ряд профессиональных функций. Использование живого чата позволяет посетителям с легкостью связаться с вами. Когда вы прокручиваете сайт вниз, виджет живого чата остается на месте, так что он всегда под рукой.
Верхняя часть страницы отвечает на любые начальные вопросы, которые могут возникнуть у посетителя, с полужирным заголовком, дополнительными пояснениями и призывом к действию. Остальная часть страницы разбита на небольшие разделы, так как Ferretly объясняет преимущества и особенности своей платформы.Их четко определенная цветовая схема остается неизменной на всем сайте, а важные элементы, такие как CTA, выделяются благодаря яркому оттенку зеленого.
10. Spotify для подкастеров
Платформа потокового аудио Spotify создала целевую страницу для своих услуг хостинга подкастов. В то время как их основной веб-сайт посвящен общему сообщению — «Слушать — это все», эта целевая страница специально предназначена для подкастеров, которые ищут платформу для обмена своим контентом.
Яркий цветовой контраст делает акцент на типографике. В тексте четко указывается цель страницы и подчеркивается главное преимущество платформы для подкастеров. Эта страница отличается от приложения Spotify яркой цветовой палитрой с характерным зеленым цветом. Это помогает указать посетителям, что эта целевая страница служит другой цели.
На этой странице вы познакомитесь с преимуществами Spotify с использованием цифровых иллюстраций и удобоваримых, практичных копий. Эта выигрышная комбинация отражает атмосферу, одновременно доступную и профессиональную.
Наконец, они добавили вдохновляющий контент в виде отзывов от других подкастеров и инсайдерских советов о том, как начать подкаст, заказать интервью для вашего шоу и многое другое. Чтобы закрыть все, целевая страница заканчивается разделом часто задаваемых вопросов, показывая пользователям, что бренд готов ответить на все их вопросы и запросы.
11. GT America
Этот пример целевой страницы был создан специально для шрифта GT America литейной компанией Grilli Type. Этот шрифт, вдохновленный традиционными американскими и швейцарскими шрифтами, предлагает более современный вариант классической эстетики.Благодаря шести доступным стилям это один из лучших шрифтов для логотипов, поскольку бренды могут адаптировать его универсальный вид к своему бренду.
Целевая страница использует минимальную цветовую палитру для максимального эффекта. Красная ссылка в верхней части страницы ведет на основной сайт Grilli Type, предоставляя им удобный способ продвижения своего сайта. Ссылка действительно выделяется на фоне окружающего ее синего текста.
Далее по сайту посетители сталкиваются с забавными анимациями и взаимодействиями, которые приглашают вас поиграть с шириной и весом персонажей.Это создает по-настоящему увлекательный опыт, поскольку вы узнаете историю, лежащую в основе шрифта. Здесь также кнопки с призывом к действию размещены в нижней части сайта, что позволяет вам лучше понять шрифт, прежде чем принять решение о его покупке.
12. Uber для бизнеса
С тех пор, как в 2009 году начался бизнес по совместному использованию поездок, бренд расширился с однорангового обмена до частных поездок, услуг по доставке еды и даже системы совместного использования велосипедов.
Еще одна глава в их развитии — Uber для бизнеса.Это решение дает компаниям возможность планировать вывоз для своих клиентов, гостей или клиентов. Эти поездки можно заказать на месте или запланировать заранее. Все, что вам нужно для организации поездки, — это имя вашего гостя, его номер телефона и место назначения. В отличие от вас, как пользователя, вашему гостю не нужно приложение, чтобы успеть на поездку.
Хотя целевая страница Uber для бизнеса немного отличается от других страниц Uber, она по-прежнему хорошо узнаваема как часть бренда Uber.Первый сгиб страницы включает в себя суть предложения, а также призыв к действию «Начать работу», который повторяется в других местах целевой страницы. По мере прокрутки отображается более подробная информация.
Что вы можете узнать на целевой странице Uber:
Делайте текст кратким: Ваши посетители наводнены информацией. Вот почему большинство пользователей Интернета привыкли бегло читать. Чтобы с этим бороться, делайте текст кратким и приятным, как это сделал Uber.Хотя в них содержится много информации, она разбита на интервалы, предложения сохраняются краткими, с одной-двумя строками каждое, а фотографии используются для закрепления сообщений.
Следуйте F-образцу: Еще один метод, используемый для того, чтобы поймать этих беглых читателей, — это так называемый «F-образ». Ключевым моментом здесь является привлечение внимания зрителей к тем областям, к которым их глаза естественным образом тяготеют. Это было разработано благодаря обширным исследованиям, проведенным в области отслеживания движения глаз.
Вот как это работает:
Представьте, что кто-то нанес на вашу целевую страницу букву «F».Какие бы области ни были включены в его строки, вы захотите вставить всю наиболее важную информацию и фразы в свой текст.
Горизонтальные линии F-шаблона — это области, где вы можете разместить заголовки, которые быстро объяснят читателю, что он может ожидать найти на вашей странице. Uber добивается этого, размещая «Uber для бизнеса» в верхнем левом углу. После этого ваше внимание привлекает CTA, за которым следует следующий фрагмент текста, начинающийся слева: «Совместная работа, чтобы помочь сдвинуть с места самое важное.’
После сканирования верхней горизонтальной части страницы читатель, естественно, обратится к вертикальной линии , идущей вниз с левой стороны. Ваша задача будет заключаться в том, чтобы заполнить это пространство интересными функциями, которые сразу появляются на странице. Это побуждает читателей следовать оставшейся части предложения. Лучше всего использовать маркированные списки, цитаты или избранные изображения, чтобы немного разбить ваш контент. Uber повторяет свой призыв к действию слева.CTA, выполненный в белом цвете с черным текстом, выделяется на темном фоне.
Важно отметить, что хотя этот конкретный LP следует F-образцу, большинство целевых страниц следуют Z-образцу. Это связано с тем, что в LP обычно мало текста и много таких элементов, как кнопки, формы и короткие пояснения. Вы также можете найти эти шаблоны, применяемые во многих дизайнерских шаблонах целевых страниц Wix, которые вы можете полностью настроить в соответствии со своими потребностями.
Вот как составить целевую страницу с помощью Z-шаблона:
Идея состоит в том, что кто-то может примерно нарисовать букву «Z» на вашей странице, начиная с левого верхнего угла и заканчивая в правом нижнем углу. углу и охватите все этапы потока, который вы создали для своих посетителей.
Верхняя часть вашего «Z» (левый угол) — это место, куда глаза ваших читателей будут естественно стремиться, что делает его идеальным местом для добавления вашего логотипа.
Диагональная часть (наклонная линия), которая проходит через страницу от верхнего правого угла до нижнего левого угла, предназначена для быстрого переноса посетителей с верхней панели в следующий раздел, который вы хотите. сконцентрироваться. Все, что вы здесь разместите, должно сразу привлекать внимание.В случае вашей целевой страницы вы можете разместить здесь свое предложение, мощную копию, изображения, видео или форму.
Двигаясь оттуда к концу письма, это ваше место, чтобы привлечь тех посетителей, которых вам удалось зацепить. Завершите это убедительным призывом к действию. Это может быть приглашение подписаться на рассылку новостей, запросить демонстрацию, купить продукт или записаться на прием.
13. Ed5M
Sparx, организация, стоящая за инициативой Ed5M, создала эту целевую страницу на Wix, чтобы привлечь внимание к своей миссии: улучшить мир с помощью образовательных технологий.Они считают, что этот новый научно доказанный подход к обучению и обучению может внести значительные улучшения в этот сектор, помогая улучшить жизнь как учителей, так и учеников.
В верхнем сгибе целевой страницы, с черным фоном, заголовком и рисунками, присутствует ощущение таинственности. Во время прокрутки веб-сайта передается четкое повествование. Сочетание ярких образов с шокирующей статистикой и жирными заголовками помогает донести мысль о необходимости изменений в системе образования.
Как и на любой классической целевой странице, CTA остается на месте, когда вы заходите на сайт. Приглашая посетителей «Присоединяйтесь к путешествию», текст привлекает внимание, а самое главное — кнопка всегда под рукой.
14. LinkedIn Business Solutions
LinkedIn — это платформа социальных сетей, специально предназначенная для общения профессионалов и предприятий. Его можно использовать для создания страниц компании, а также отдельных учетных записей. Пользователи могут продемонстрировать свои бизнес-навыки, достижения, запуски, сотрудников и многое другое.
Поскольку это платформа с большим количеством пользователей и активностей, она также стала местом, где рекламное пространство оказалось ценным и успешным. Эта целевая страница предназначена для компаний, которые хотят привлечь новых клиентов с помощью рекламы в LinkedIn.
Первая часть включает в себя логотип LinkedIn, который мы все знаем, но с более индивидуальным названием «Решения для бизнеса», несложным заголовком и не одним, а двумя призывами к действию, призывающими к одному и тому же действию — созданию объявления. Затем на целевой странице сразу рассказывается, почему вам нужно использовать рекламу в LinkedIn, а также приводится впечатляющая статистика.
Они выбрали фиксированное меню (это означает, что меню остается на том же месте при прокрутке), которое включает их логотип и CTA. Таким образом, независимо от того, где вы находитесь на их странице, призыв к действию всегда доступен.
Что вы можете узнать из целевой страницы LinkedIn:
Держите это сосредоточенным: Чем более точна ваша страница, тем лучше. Ваша целевая страница должна иметь единственную цель. Здесь речь идет о продвижении рекламы в LinkedIn.Примените тот же принцип к своим собственным целевым страницам: взгляните на свой бизнес-план и определите свою цель для конкретной целевой страницы, следя за тем, чтобы она была единообразной во всем. Избегайте визуального беспорядка и сосредоточьтесь на своем главном призе: желанном призыве к действию (показано здесь с использованием замороженного меню).
Приведите в порядок свою информацию: LinkedIn успешно учла мыслительный процесс своих посетителей. Во-первых, они начинаются с мощного заголовка, за которым следует призыв к действию, предлагающий пользователям создать рекламу.Затем, как будто предупреждая, что у пользователя могут возникнуть вопросы, они представляют список причин, по которым вы должны их выбрать. После этого они более подробно рассказывают о своих функциях, используя короткий текст и изображения реального интерфейса, а также три четких шага для начала работы. После всего этого ценного и убедительного контента они заканчивают свою целевую страницу второстепенным призывом к действию, чтобы заключить сделку.
15. Hootsuite
Инструменты управления социальными сетями к настоящему времени стали неотъемлемой частью маркетинговых стратегий.Hootsuite позволяет вам улучшить свой маркетинг в социальных сетях, позволяя управлять и планировать весь свой контент в одном месте.
С помощью иллюстрированных снимков экрана и текстовых копий их целевая страница игриво объясняет, что именно они предлагают. На странице сочетаются веселая и удобоваримая атмосфера социальных сетей с профессиональным подходом. Hootsuite включает отзывы проверенных клиентов, чтобы завоевать доверие новых пользователей. Каждый сгиб страницы используется для объяснения и подробного описания множества доступных функций.
Что вы можете узнать из целевой страницы Hootsuite:
Подчеркните свою первую складку: Верхняя складка, безусловно, является самым важным элементом вашей целевой страницы (наряду с вашим CTA). Это первое, что увидят посетители, и это может быть решающим фактором при их решении остаться или уехать. Hootsuite попадает в самую точку с этим. Это ясно, смело и по делу. Пользователи сразу понимают, что они предлагают и какую выгоду они могут извлечь.Для оптимального воздействия мы рекомендуем, чтобы ваша первая строчка не превышала 11 слов.
Повторите ваш CTA: Поскольку ваш CTA является шлюзом к конверсии клиентов, убедитесь, что он доступен для них на всей вашей странице. Hootsuite делает это, размещая свой призыв к действию в нескольких местах: в их статическом меню навигации, в верхней части целевой страницы и в средстве выбора пакетов.
16. Echo Echo
Платформа для совместной работы Echo Echo ставит перед собой задачу помочь людям услышать их истории с помощью программного обеспечения для редактирования и обмена аудио.Их платформа позволяет рассказчикам транскрибировать свой звук, редактировать его и экспортировать на выбранную ими цифровую звуковую рабочую станцию или канал в социальных сетях.
Яркий цвет фона, необычный визуальный язык и интригующее изложение вверху страницы мгновенно вызывают интерес у посетителей сайта. По мере прокрутки вниз Echo Echo объясняет их функции, используя сжатый текст вместе с иллюстрациями. Чтобы закрыть его, есть второй призыв к действию внизу страницы в сочетании с мощным, привлекающим внимание вопросом.
Созданная на Wix, эта целевая страница успешно использует иллюстрацию для создания чувства творчества, которое найдет отклик у целевой аудитории Echo Echo. Иллюстрации включают визуальное представление звука, а также рисунок руки, который тонко символизирует командную работу.
17. ARK (Акты произвольной доброты)
Посвященный распространению актов произвольной доброты, ARK ежегодно в декабре проводит мероприятие, на котором людей приглашают явиться и помочь улыбнуться другим членам своего сообщества.
Эта трогательная миссия успешно передана на их целевой странице. Их ценности и сообщения точно отражают курсор в форме сердца и очаровательная анимированная векторная графика в верхней части сайта. Также есть возможность переключить отображение в темный режим, что позволяет посетителям сайта настраивать дизайн в соответствии со своими предпочтениями.
По мере прокрутки меню вверху остается на месте, предлагая вам нажать «Дать» в любой момент во время просмотра. Еще один приятный штрих — это текст внизу страницы, который выглядит дружелюбно и гостеприимно, как и микрокопия на кнопке, говорящая «Да! Давайте сделаем это! »
Что вы можете узнать из целевой страницы ARK:
Добавьте в социальный обмен: Когда вы добавите кнопки социального обмена на свою целевую страницу, ваши посетители могут помочь вам дальше распространять ваше сообщение самостоятельно профили.Кроме того, включите ссылки на профили вашей компании в социальных сетях. ARK включает ссылки на их учетные записи в социальных сетях в нижнем колонтитуле своих целевых страниц, а также предлагает посетителям сайта поделиться твитом или публикацией в Facebook для продвижения своего сообщения и инициативы.
18. Moderne
Цифровое рабочее пространство Moderne предоставляет творческим командам индивидуальные идеи, рекомендации и идеи для их рекламы и кампаний. Идея состоит в том, чтобы помочь командам оптимизировать свои маркетинговые усилия, эффективно сотрудничать и сэкономить драгоценное время на исследованиях, выступая в качестве универсального инструментария.
Все в дизайне этой целевой страницы указывает на то, что она предназначена для творческих профессионалов, от иллюстраций до вариантов типографики. Пользовательские иллюстрации красочные и выразительные, они сильно отличаются от точных векторных иллюстраций, которые часто используются цифровыми брендами. Вместо того, чтобы придерживаться ограниченной цветовой палитры, Moderne выбрала широкий спектр оттенков, который также усиливает чувство свободы и творчества.
Эти нетрадиционные штрихи помогают Moderne донести идею творчества и сотрудничества.Несмотря на этот уникальный дизайн, они по-прежнему придерживаются классических элементов целевой страницы: мощный заголовок, несколько призывов к действию и контент, разбитый на удобоваримые разделы.
19. Airbnb
С момента своего запуска в 2008 году Airbnb предлагает проживание в семье, проживание и другие виды туризма по всему миру.
На главном веб-сайте компании есть различные разделы, предназначенные для разных пользователей, независимо от того, хотят ли они стать хозяином или забронировать проживание. Здесь эта целевая страница предназначена для компаний, которые хотят использовать их услуги, когда им нужно жилье, совместные рабочие места или упражнения для тимбилдинга во время путешествий.
Первый сгиб заполнен большим видеофоном, на котором показаны различные сценарии путешествий, работы и общения коллег. Четкий заголовок, выделенный абсолютно белым цветом, описывает идею, которую Airbnb хочет изобразить. Чтобы начать, посетителям просто нужно ввести свой адрес электронной почты и нажать «Продолжить». Чтобы максимизировать возможности конверсии, тот же CTA повторяется внизу страницы.
Если вы прокрутите вниз, страница заполнится большим количеством изображений и описаний всех ориентированных на работу вариантов и приспособлений.К ним также прилагаются специально разработанные призывы к действию: «Исследуйте готовые к работе места для проживания». Чтобы добавить доверия, есть специальный раздел с отзывами.
Что вы можете узнать на целевой странице Airbnb:
Фон видео: Статистика видеомаркетинга покажет вам, что видео является отличным и увлекательным инструментом для демонстрации продвигаемого вами продукта или услуги. Поскольку у Airbnb есть множество вариантов, мест и услуг, видео — это умный способ показать все сразу.Важно, чтобы визуальный язык на всей странице оставался неизменным. Компания добивается этого, используя только видео и изображения, которые дополняют друг друга с точки зрения освещения, атмосферы и внешнего вида.
Убедитесь, что ваш бренд присутствует: Это может быть ваш логотип, слоган, название компании или любой другой элемент, который поможет вашей аудитории «узнать» вас — независимо от того, как они попали на вашу страницу. Большая часть построения бренда — это повторение, поэтому используйте свою целевую страницу как еще одну возможность показать больше своего бизнеса.Знаменитый логотип Airbnb размещен вверху страницы, выделяясь на фоне видео.
20. Без санкции 3sixteen
Модный бренд 3sixteen производит одежду и аксессуары, гордясь использованием высококачественных материалов и качественного американского производства. В первую очередь, джинсовый бренд, они создали этот мини-сайт, чтобы представить свой уникальный подход к джинсам и рассказать историю своего самого любимого продукта — джинсов.
Возможно, это не типичный пример целевой страницы, поскольку она больше ориентирована на электронную коммерцию, но она, безусловно, служит для продвижения их бренда и заканчивается призывом к действию, ведущим к их интернет-магазину.Структура, похожая на историю, проведет вас через шаги, как намочить джинсы перед тем, как надеть их в первый раз, и подчеркнет, почему несанфоризованный деним — лучший вариант.
Большие фотографии товаров и минималистичный макет говорят о профессионализме и качестве. Вместе с текстом общее впечатление захватывающее и убедительное, но при этом не слишком навязчивое.
21. GT Cinetype
Вот еще одна нетрадиционная целевая страница (или «мини-сайт»), созданная швейцарской литейной фабрикой Grilli Type для демонстрации шрифта GT Cinetype.Вдохновленный ограничениями машины для создания субтитров в кино, лазерная технология которой может двигаться только по прямым линиям, шрифт не содержит кривых.
Выбор видео приветствует вас при входе на веб-сайт, предоставляя вам визуальный контекст для шрифта. Высокоскоростные черно-белые видеоролики на верхнем сгибе незаметно помещают текст на передний план, демонстрируя его во многих различных формах и размерах.
Прокручивая страницу вниз, вы совершаете ностальгическое путешествие по некоторым из самых классических фильмов кино, намекающих на вдохновение для шрифта.Большие видеоролики и цитаты сопровождают вас по всему сайту, вовлекая вас в процесс, пока вы не дойдете до CTA, который появляется только в нижней части сайта. Это помогает придать шрифту ту платформу, которой он заслуживает, при этом делая кнопки очень заметными и удобными для нажатия.
Резюме: лучшие практики для создания эффективных целевых страниц
Давайте подведем итоги. Из этих 21 примера целевой страницы мы извлекли важные уроки о том, как создавать эти элементы веб-дизайна.Независимо от того, используете ли вы шаблон целевой страницы или создаете свой веб-сайт с нуля, крайне важно помнить об этих передовых методах при создании собственной целевой страницы — так что вот полный список:
Сделайте ваш CTA центром внимания .
Используйте привлекательные изображения.
Свернуть прокрутку.
Знайте свою аудиторию.
Отключить всю остальную навигацию.
Создайте увлекательный опыт.
Убедитесь, что ваша страница удобна для мобильных устройств.
Используйте онлайн-формы.
Включите политику конфиденциальности.
Включить пробелы.
Сделайте заманчивое предложение.
Будьте понятны при обмене сообщениями.
Текст должен быть кратким.
Следуйте F-образному или Z-образному образцу.
Держите свою страницу в фокусе.
Сделайте заказ по вашей информации.
Подчеркните заголовок.
Повторите CTA.
Добавить в социальных сетях.
Включить видео.
Убедитесь, что ваш бренд присутствует.
Проверьте свои целевые страницы для повышения конверсии
И последний совет: Когда вы освоите рецепт создания целевой страницы, не останавливайтесь. Всегда есть место для улучшений, которые могут принести вам дополнительных потенциальных клиентов или клиентов.Хотя есть способы разумного использования целевой страницы, не существует волшебной формулы, которая гарантированно работает для всех. Нужно время, чтобы усовершенствовать искусство и найти то, что находит отклик у вашей аудитории.
Есть много факторов, которые могут повлиять на успех вашей страницы, включая время, экспозицию, текст, изображения и многое другое. Хороший способ понять, что работает, а что нет, — провести A / B-тесты. Это относится к методу сравнения двух версий одного и того же фрагмента контента с изменением одного элемента для создания вариации.
При проведении A / B-теста на LP важно, чтобы вы изменили только один элемент, чтобы действительно понять, что вызывает успех или ущерб вашей странице.
Параметры для элементов, которые можно настроить, включают:
Более короткий или длинный текст
Более прямые или срочные сообщения
Цвета фона или текста
Выбор изображения
Неподвижное изображение vs.видео
Размер вашего CTA
Размещение вашего CTA
Общий вид вашей страницы
Ваше предложение
Тайра Сабо
Wix Blog Writer
Автор: Дана Меир
Эксперт и писатель по дизайну
25 лучших примеров лендингов от ведущих компаний для вдохновения
Когда дело доходит до цифрового маркетинга, мы должны смотреть на лучшие примеры целевых страниц ведущих лидеров отрасли, чтобы улучшать их и извлекать уроки.
В конце концов, эти ориентированные на действия, автономные веб-страницы имеют решающее значение для продвижения людей на всех этапах пути к покупке. И если хорошо зарекомендовавшие себя компании используют целевые страницы, то они должны быть неотъемлемой частью любой маркетинговой стратегии, особенно на уровне предприятия.
Ниже вы найдете лучшие примеры целевых страниц 25 ведущих компаний. Прочтите их, чтобы начать учиться у лучших и создать собственную высокоэффективную целевую страницу после клика.Вы также можете щелкнуть название бренда, чтобы найти отдельную статью с еще большим количеством примеров этого бренда.
25 лучших компаний с лучшими примерами посадочных страниц
(Имейте в виду, что для более коротких страниц мы показываем всю страницу. Для более длинных страниц мы отображаем только над сгибом. Вам может потребоваться перейти к примеру целевой страницы, чтобы увидеть некоторые из обсуждаемых нами вопросов. Кроме того, некоторые сайты могут проводить A / B-тестирование своих страниц, что означает, что вам может быть предоставлена альтернативная версия.)
1. Пример целевой страницы Marketo
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок сообщает посетителям, о чем именно идет речь.
- Изображение показывает посетителям, что они могут ожидать, если они решат загрузить отчет.
- Маркированный список позволяет потенциальным клиентам быстро просмотреть страницу, чтобы узнать, что включает в себя отчет.
- Социальное доказательство — отзыв клиента и значки компании — повышает доверие к предложению и компании в целом.
Что проводить A / B-тест:
- Ссылки для выхода — логотип Marketo и ссылка Legal в нижнем колонтитуле — предоставляют посетителям возможность покинуть страницу, не загружая отчет.
- Форма из 5 полей может напугать кого-то на этом этапе рассмотрения покупателя. Удаление «Должности» и «Компания» может побудить большее количество посетителей заполнить форму.
- Цвет кнопки с призывом к действию не выделяется так сильно, как мог бы, потому что он используется в другом месте на странице.
- Копия кнопки CTA расплывчата. Измените его на что-то вроде «Я хочу отчет!» может побудить больше потенциальных клиентов щелкнуть.
- Большой блок выделенной курсивом копии не кажется необходимым, и его удаление может привести к лучшим результатам преобразования.
- Добавление полного имени и портрета к отзыву клиента может повысить доверие к нему.
- Добавление белого пространства поможет странице выглядеть менее загруженной и более эстетичной.
2. Пример целевой страницы Slack
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Уникальный стиль прокрутки позволяет отображать всю необходимую информацию, позволяя посетителям получать информацию без необходимости перемещаться вверх и вниз по странице.
- Форма для захвата лида постоянно отображается, когда пользователи просматривают контент.
- Копия кнопки с призывом к действию убедительна, потому что она короткая, прямая и в ней используется слово «бесплатно».”
- Только одно поле формы дает высокую вероятность того, что посетители заполнят форму.
- Изображения яркие, привлекательные, используют фирменные цвета и относятся к каждому соответствующему разделу.
- Использование социального доказательства может заставить посетителей почувствовать себя обязанными использовать Slack.
Что проводить A / B-тест:
- Есть несколько ссылок для выхода , включая логотип Slack, «Войти», «Просмотреть все приложения», «Посмотреть истории клиентов», «продукт», «цены» и «Enterprise Grid» — что делает его более вероятным. чтобы посетители уходили со страницы без конвертации.
- Отсутствие политики конфиденциальности может помешать потенциальным клиентам передать свой адрес электронной почты.
3. Пример целевой страницы Oracle
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Отчет о формировании спроса Статистика в копии не является «недавней», как говорится в ней, — она датируется периодом до 2016 года, а дата авторских прав на этой странице — 2017 год.
- Изображение информационного документа дает посетителям возможность предварительного просмотра того, что они могут ожидать, загрузив информационный документ.
- Контрастный цвет формы выделяется и привлекает внимание, побуждая посетителей завершить ее.
- Непроверенное поле согласия гарантирует, что потенциальные клиенты, которые согласны, хотят получать электронные письма от Oracle.
Что проводить A / B-тест:
- Логотип компании и элементы навигации в верхней части страницы потенциально могут удалить посетителей со страницы без загрузки официального документа.
- Меньшая копия на полях формы и под ними плохо читается.
- Белая кнопка с призывом к действию не выделяется так сильно, как могла бы, потому что она белая вверху и внизу страницы.
- Ссылки выхода в нижнем колонтитуле предоставляют посетителям еще больше возможностей покинуть страницу.
4. Пример целевой страницы Google Hire
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Логотип Hire в верхнем левом углу немедленно сообщает посетителям, где они находятся, когда они попадают на страницу.Тот факт, что на нее нет гиперссылок, также не позволит людям щелкнуть мышью, что делает ее отличной целевой страницей после щелчка.
- Четкий заголовок говорит о перспективах демонстрации, которая будет включать информацию об инструментах набора персонала.
- Минимальная точная копия позволяет посетителям быстро прочитать и определить, хотят ли они конвертировать предложение.
- Инкапсуляция формы помогает ей выделяться на странице, что, вероятно, увеличивает коэффициент конверсии.
- Ссылка на политику конфиденциальности в нижнем колонтитуле повышает доверие, позволяя потенциальным клиентам чувствовать себя более комфортно при отправке своей личной информации.
Что проводить A / B-тест:
- Соответствие сообщения можно улучшить. Я попал на эту целевую страницу после щелчка по рекламной акции веб-семинара по найму с кнопкой CTA, побуждающей посетителей «зарегистрироваться» на «предстоящем веб-семинаре». Целевая страница после клика вообще не упоминает веб-семинар, а вместо этого продвигает демонстрацию по запросу. Если Google Hire считает их веб-семинар и демонстрацию одним и тем же, увеличение совпадения сообщений между двумя страницами, вероятно, уменьшит путаницу у посетителей.
- 14 полей формы — это много, даже для этапа рассмотрения маркетинговой воронки. Разделение этого на многоступенчатую форму может уменьшить трение формы и привести к большему количеству преобразований.
- Бирюзовая кнопка CTA похожа на другой оттенок синего на странице. Сделав его более контрастным, например, оранжевым, мы сделаем его более ярким.
- Несбалансированная страница . Включение дополнительного элемента целевой страницы после щелчка слева от нижней части формы, такого как отзыв клиента или привлекательное изображение, может сделать страницу более эстетичной.
5. Пример целевой страницы Uber
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Логотип Uber вверху страницы сразу сообщает посетителям, где они находятся. Тот факт, что он не связан с главной страницей, выступающей в качестве ссылки для выхода, также является плюсом.
- 5 полей формы подходят для страницы регистрации, тем более что они не запрашивают очень личную информацию.
- Необязательное поле промокода удобно, потому что оно не появляется до тех пор, пока потенциальный клиент не нажмет на него, а форма ограничена 5 полями.
- Зеленая кнопка с призывом к действию выделяется, потому что на странице нет другого зеленого цвета.
- Стрелка на кнопке с призывом к действию действует как указатель направления, указывая на то, что посетители должны щелкнуть, чтобы увидеть, что находится на другой стороне этой целевой страницы после нажатия.
Что проводить A / B-тест:
- Вряд ли какая-либо копия на странице может вызвать у посетителей чувство неосведомленности и неуверенности.
- Добавление социального доказательства , например, цитируемого отзыва от нынешнего водителя Uber, может вызвать большее доверие у посетителей.
- Копия «Зарегистрироваться» на кнопке с призывом к действию не является оригинальной или персонализированной. «Прокатись прямо сейчас!» более информативный и увлекательный.
6. Пример целевой страницы IBM
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок отчетлив и интригует, побуждая посетителей продолжить вниз по странице, чтобы узнать больше о предложении.
- Минимальная копия дает краткий обзор официального документа, не перегружая его ненужной информацией.
- Предоставление возможности переключения языков — отличная идея в теории. К сожалению, когда посетители выбирают другой язык, они попадают на главную страницу вместо того, чтобы напрямую переводить эту целевую страницу после клика.
Что проводить A / B-тест:
- Навигация по верхнему и нижнему колонтитулам может легко отвлечь посетителей от настоящего предложения и увести их со страницы без преобразования.
- Балансировка страницы путем добавления изображения или отзыва клиента с левой стороны сделало бы ее более привлекательной.
- Кнопку с призывом к действию можно улучшить в соответствии с нашими рекомендациями по использованию целевой страницы после нажатия. Цвет может быть более контрастным и привлекательным, а текст — более ориентированным на покупателя и выгодным.
7. Пример целевой страницы LendingClub
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок выделен жирным шрифтом, чтобы выделить ценностное предложение.
- Заключение формы с помощью цветового контраста делает ее привлекательной.
- Красные кнопки с призывом к действию контрастируют и выделяются на странице, вероятно, увеличивая конверсию.
- Раздел «Инвестирование через LendingClub» предоставляет основные преимущества партнерства с компанией, не заполняя страницу огромным количеством копий. К тому же конкретный процент инвестиций служит социальным доказательством.
- Логотипы компании также служат социальным доказательством и дают посетителям понять, что многие известные бренды признают LendingClub и доверяют ему.
- Несколько кнопок CTA дают потенциальным клиентам несколько шансов на конвертацию предложения.
Что проводить A / B-тест:
- Множественные ссылки для выхода — логотип LendingClub, «Условия использования», «Подробнее», несколько слов мелким шрифтом и навигация в нижнем колонтитуле — могут удалить посетителей со страницы без преобразования.
- Изменение направления глаз человека на фотографии, чтобы посмотреть на форму захвата лида, может подсознательно побудить большее количество посетителей ее заполнить.
- Изменение копии кнопки CTA на что-то более привлекательное и убедительное, например: «Начни инвестировать сейчас и получи прибыль!» может привести к большему количеству конверсий.
- Чрезмерное количество мелкого шрифта внизу страницы пугает и может заставить потенциальных клиентов задуматься, есть ли у компании скрытые планы.
8. Пример целевой страницы домофона
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Юмор , особенно в разделе «Боты сегодня действительно раздражают», помогает наладить тесную, чуткую человеческую связь с посетителями.
- Заголовки разделов с минимальной копией сообщают потенциальным клиентам, что включает в себя Оператор (и как это может принести им пользу), не заполняя страницу ненужным текстом.
- Достаточное свободное пространство делает страницу более удобной и удобоваримой для навигации.
Что проводить A / B-тест:
- Заголовок частично скрыт. Текстовые поля, закрывающие его, можно немного сдвинуть, чтобы был виден весь заголовок.
- Множественные ссылки для выхода — логотип Intercom вверху и внизу страницы, ссылка для входа под первой формой и ссылка «Узнать больше» под второй формой — могут отвлекать посетителей и удалять их со страницы перед преобразованием. .
- Форма и кнопка с призывом к действию сливаются с остальной частью страницы, потому что многие элементы на странице отформатированы одинаково и кажутся интерактивными.
9. Пример целевой страницы Microsoft
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Ориентированный на выгоду заголовок сообщает посетителям, что они могут улучшить мобильную продуктивность своей команды с помощью Office 365, и побуждает их узнать больше с помощью электронной книги.
- Изображение продукта показывает потенциальным клиентам, что они получат, если решат загрузить электронную книгу. Увеличив его и сделав более реалистичным, можно еще больше улучшить результаты конверсии.
- Маркированные с минимальной копией позволяют потенциальным клиентам сканировать страницу для получения соответствующей информации.
- Инкапсулированная форма выделяется, обращая внимание посетителя на ее завершение.
- Зеленая кнопка с призывом к действию привлекает внимание, поскольку хорошо контрастирует с остальной частью страницы.
Что проводить A / B-тест:
- Гиперссылка на логотип Office может увести посетителей со страницы, не увидев предложения и не конвертируясь.
- Изображение мужчины кажется неуместным для предложения. Заменить его на человека, использующего Office 365 или читающего электронную книгу, могло бы быть более эффективным.
- Восемь обязательных полей формы могут напугать кого-то, кто только находится на этапе рассмотрения вопроса о покупке.
- CTA-копия неточна и неточна. Измените его на что-то более индивидуальное и захватывающее, например: «Пришлите мне электронную книгу!» скорее всего, побудит больше потенциальных клиентов щелкнуть.
- «Посмотреть планы и цены» внизу страницы может отвлечь посетителей от основного предложения и помешать им совершить конверсию.
- Добавление социального доказательства , такого как отзыв клиента или печати доверия, повысило бы доверие.
10.Пример целевой страницы Lyft
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Подзаголовок служит социальным доказательством, позволяя посетителям узнать, что другие люди сделали отличные советы, работая с Lyft.
- Только одно поле формы с запросом номера телефона можно быстро и легко заполнить, так что это не отпугнет многих потенциальных клиентов.
- Если вы не отметите поле согласия , кандидаты почувствуют, что выбор полностью за ними.
- «Получите бонус в размере 250 долларов» , вероятно, является убедительным стимулом для многих потенциальных клиентов.
- CTA-кнопка «Подать заявку» — это тег привязки, который выводит потенциальных клиентов вверх страницы для быстрого заполнения формы.
- Функция калькулятора позволяет посетителям определить, сколько денег они могли бы заработать, если бы выбрали Lyft.
- Раздел «Почему Lyft» использует иконографию и минимальную простую копию, чтобы передать основные преимущества работы в Lyft.
- Слайдер «Как работает Lyft Driving» объясняет, как Lyft работает с помощью мобильного приложения.
- «Страховая защита Lyft» и «Рейтинги пассажиров» дает водителям уверенность, когда дело касается вождения в Lyft.
Что проводить A / B-тест:
- Многие ссылки для выхода — включая логотип Lyft и несколько гиперссылок по всему тексту — могут отвлекать посетителей и уводить их со страницы без преобразования.
- Заголовок: Lyft vs.Uber , но на странице нет ничего, что сравнивало бы эти две услуги.
- Белый текст не отображается на фоне белого логотипа на мужской рубашке.
- Перенаправление взгляда человека на форму захвата лида может привести к увеличению числа посетителей, заполняющих ее.
- Копия кнопки CTA , «Далее», настолько скучна, насколько это возможно. Измените его на что-то более увлекательное, например «Начни зарабатывать деньги прямо сейчас!» вероятно, улучшит результаты конверсии.
- Розовая кнопка с призывом к действию не выделяется так сильно, как могла бы, потому что розовый используется так же везде на странице.
11. Пример целевой страницы «Постоянный контакт»
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок и подзаголовок ориентированы на выгоду и хорошо поддерживают друг друга.
- Минимальная копия позволяет посетителям понять предложение, не перегружая себя лишним текстом.
- Оранжевая кнопка с призывом к действию выделяется тем, что хорошо контрастирует с остальными цветами на странице.
- Дизайн с переходом по ссылкам с формой для захвата потенциальных клиентов на следующей странице позволяет посетителям получить всю информацию о предложении, не отвлекаясь и не запугиваясь формой.
Что проводить A / B-тест:
- Гиперссылка на логотип Constant Contact может сразу увести посетителей со страницы, не увидев всего предложения.
- На кнопке с призывом к действию слишком много текста, что делает ее маленькой и трудной для чтения. «Без риска. Кредитная карта не требуется ». можно переместить под кнопкой.
- Отсутствие политики конфиденциальности может заставить потенциальных клиентов не решиться совершить конверсию.
- Добавление социального доказательства , такого как отзыв клиента, скорее всего, заставит кандидатов чувствовать себя более уверенно в своем решении зарегистрироваться с помощью Constant Contact, что повысит коэффициент конверсии.
12.Пример целевой страницы Salesforce
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Первичные и вторичные заголовки убедительны, потому что они признают проблему и предоставляют решение.
- На изображении посетители могут увидеть мобильное приложение Wave Analytics.
- Минимальная точная копия описывает предложение, не заполняя страницу огромным текстом.
- Контрастная инкапсулированная форма помогает ей выделиться и, вероятно, побуждает больше людей завершить ее.
- Стрелки — одна указывает на первое поле формы, а вторая — на кнопку CTA — служат в качестве ориентиров.
- Значки доверия и политика конфиденциальности помогают потенциальным клиентам быть уверенными в том, что их личная информация останется в безопасности и конфиденциальности.
Что проводить A / B-тест:
- Ссылки для выхода — логотип Salesforce, значки доверия, ссылки в социальных сетях и ссылки нижнего колонтитула — позволяют посетителям легко покинуть эту страницу.
- 8 полей формы могут удерживать посетителей от заполнения формы.Удаление ненужных запросов или преобразование их в многоступенчатую форму уменьшит трение и приведет к увеличению количества загрузок.
- Синяя кнопка CTA гармонирует с синей формой. Если вы попробуете использовать более контрастный цвет (например, оранжевый), это привлечет больше внимания посетителей.
- Копию кнопки CTA можно улучшить до чего-то более заманчивого, например «Покажи мне демонстрацию Wave Analytics!»
- Добавление социального доказательства , например отзыва клиента Salesforce, повысило бы ценность доверия у посетителей и поощрило бы больше демонстрационных просмотров.
13. Пример целевой страницы Zoho
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок сразу предлагает два преимущества подписки на бесплатный план Zoho CRM — улучшение отношений с клиентами и предоставление десяти бесплатных пользователей.
- «Бесплатно» используется в нескольких местах на странице — в заголовке, на кнопках CTA и несколько раз во всей описательной копии.
- Несколько красных кнопок CTA хорошо контрастируют с остальной частью страницы, выделяют их и привлекают внимание.Первая кнопка — это тег привязки, который удобно переносит потенциальных клиентов в форму внизу страницы.
- Значок мыши указывает посетителям, что они должны прокрутить страницу вниз, чтобы увидеть дополнительную информацию. Это также тег привязки, поэтому, если они нажимают на него, они немедленно переносятся в следующий раздел без необходимости прокрутки.
- Длинный список функций передает все, что предлагает Zoho CRM.
- Двухэтапный дизайн означает меньшее трение на этой странице, потому что форма не видна до тех пор, пока потенциальный клиент не нажмет нижнюю кнопку с призывом к действию.
- Обводка формы желтым цветом помогает привлечь к ней внимание и, вероятно, увеличит коэффициент конверсии.
- Форма с 3 полями, требующая только имя, адрес электронной почты и пароль, снижает трение.
- Снятый флажок Zoho newsletter означает только искренний интерес; потенциальные клиенты получат контент.
Что проводить A / B-тест:
- Ссылки для выхода — логотип Zoho, «Условия обслуживания» и ссылки на социальные сети — могут отвлекать посетителей и уводить их со страницы, прежде чем они смогут совершить конверсию.
- Изображение рукопожатия имеет отношение к предложению, но использование фотографии двух людей, улыбающихся и обменивающихся рукопожатием, может быть еще более эффективным.
- Копия кнопки CTA в форме «Зарегистрироваться» может быть улучшена. Его даже можно изменить, чтобы скопировать копию на кнопке CTA, находящейся вверху страницы: «Начни бесплатно».
14. AWeber, пример целевой страницы
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок немедленно сообщает потенциальным клиентам, что веб-семинар длится всего 30 минут.
- Кнопка CTA находится спереди и по центру , поэтому посетители обязательно увидят ее сразу после перехода на страницу. Кроме того, текст является описательным и захватывающим, что, вероятно, побуждает потенциальных клиентов щелкнуть по нему.
- Двухэтапный дизайн удаляет форму захвата лида с этой страницы, и потенциальные клиенты видят ее только тогда, когда они нажимают кнопку CTA. Это означает меньшее трение и потенциально больше конверсий.
- Всего 3 поля формы — просто запрашивают дату / время, имя и адрес электронной почты — можно быстро и легко заполнить.
- Копия , выделенная курсивом, сообщает потенциальным клиентам, что даже если они не могут посетить какое-либо из запланированных мероприятий, они все равно могут подписаться на получение записи.
- Снимок в голову и описание Тома Тейта — хорошее включение, потому что потенциальные клиенты могут видеть и узнавать о том, кто будет представлять. Хотя увеличение изображения, вероятно, повысит его эффективность.
- Ссылка на политику конфиденциальности внизу страницы, вероятно, заставит потенциальных клиентов чувствовать себя более комфортно при передаче своей личной информации.
Что проводить A / B-тест:
- Синяя кнопка с призывом к действию должна быть протестирована в цвете, который больше нигде на странице не используется, чтобы сделать ее более привлекательной.
- Другое форматирование , примененное к разделу «Вот что мы расскажем» (отступ в списке, добавление значков или стрелок, использование полужирного шрифта и т. Д.), Сделало бы его более заметным, побудив больше людей его прочитать.
- Две ссылки на домашнюю страницу внизу страницы потенциально могут перенаправить посетителей с этой страницы без преобразования.
- Включение социального доказательства , например отзыва клиентов или статистики AWeber, вероятно, повысит доверие к потенциальным клиентам и повысит коэффициент конверсии.
15. Squarespace
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок «Заявите права на домен» эффективен, потому что он передает ощущение срочности. Потенциальные клиенты должны потребовать желаемый домен раньше, чем кто-либо другой.
- Ссылка «Узнать больше» в подзаголовке — это тег привязки, который отправляет людей дальше вниз по странице, чтобы получить дополнительную информацию о предложении.
- Простой, единообразный шрифт по всей странице придает ей общий профессиональный вид.
- Небольшие фрагменты копии облегчают чтение и усвоение содержимого.
- Сравнение Squarespace с конкурентами позволяет потенциальным клиентам узнать, что они могут извлечь выгоду разными способами, выбрав Squarespace над кем-либо еще.
- Взгляд женщины внизу страницы направлен прямо на заголовок раздела, что, вероятно, заставит посетителей тоже туда заглянуть.
Что проводить A / B-тест:
- Ссылки в верхнем колонтитуле и навигация в нижнем колонтитуле позволяют посетителям легко покинуть страницу, не предпринимая никаких действий.
- Поле домена сливается с остальной частью страницы. Несмотря на то, что он большой, он выглядит как еще один элемент дизайна на странице, и посетители могут его легко пропустить.
- Кнопки с призывом к действию больше «всплывали» на странице, если бы они были более контрастного цвета, например красного или желтого.
16. Пример целевой страницы Mixpanel
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок персонализирован и ориентирован на выгоду, он спрашивает посетителей, готовы ли они развивать свой бизнес.
- Изображение показывает потенциальным клиентам, что они могут просматривать электронную книгу на нескольких устройствах.
- Краткое описание электронной книги дает посетителям краткий первоначальный обзор предлагаемой электронной книги.
- Форму с 4 полями заполнять быстро и легко, что увеличивает шансы посетителей сделать это.
- Копия кнопки CTA использует вид от первого лица, что помогает потенциальным клиентам почувствовать связь с предложением.
- Раздел «Что внутри вашей электронной книги» подробно описывает краткое описание, упомянутое выше, выделяя важные моменты, сделанные в электронной книге, а также то, что руководители продуктов обсуждают их. Включение хедшотов — тоже приятный штрих.
- Отсутствуют ссылки для выхода. делает почти невозможным покинуть страницу без преобразования.Единственный способ покинуть страницу — щелкнуть «X» на вкладке браузера или заполнить форму.
Что проводить A / B-тест:
- Заголовок формы вводит в заблуждение. Это означает, что единственная необходимая информация — это адрес электронной почты, тогда как на самом деле для активации электронной книги необходимы еще три поля формы.
- Синяя кнопка с призывом к действию не выделяется, потому что она гармонирует с остальной цветовой схемой страницы. Тестирование цвета, который больше нигде на странице не используется, может улучшить результаты конверсии.
- Добавление сигналов доверия , чтобы убедить людей в том, что их личная информация будет в безопасности — например, политика конфиденциальности или значки безопасности — может увеличить количество потенциальных клиентов.
17. Пример целевой страницы Infusionsoft
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Социальное доказательство — значки компании вверху страницы и отзывы клиентов внизу страницы — вселяют в потенциальных клиентов чувство уверенности и доверия.
- Заголовок отлично справляется с распознаванием проблемы посетителя, сочувствием к нему и последующим предложением решения.
- Подзаголовок хорошо поддерживает заголовок, обеспечивая некоторые из основных преимуществ работы с Infusionsoft.
- Короткая форма из 4 полей запрашивает только основную информацию, что повышает вероятность того, что потенциальные клиенты потратят время на ее заполнение.
- Копия кнопки CTA сообщает потенциальным клиентам, что они получат, заполнив форму и нажав кнопку.
- Список того, что предлагает Infusionsoft. позволяет потенциальным клиентам узнать о преимуществах, которые они получат, если решат работать с Infusionsoft. Иконки и жирный шрифт помогают привлечь внимание к этому разделу.
Что проводить A / B-тест:
- Добавление функции «Звонок по нажатию» к номеру телефона позволит посетителям быстро и легко связаться с компанией, улучшив общее впечатление пользователя.
- Увеличение кнопки с призывом к действию может привлечь больше просмотров и, вероятно, побудить большее количество посетителей нажать на нее.
- Цвет кнопки CTA можно изменить, чтобы привлечь больше внимания, поскольку зеленый уже используется в логотипе компании и для маленьких значков, перечисленных в разделе под кнопкой.
- Изображение было бы более эффективным для ознакомления посетителей с программой, если бы оно было больше и легче читалось.
- Ссылка карты сайта в нижнем колонтитуле действует как ссылка для выхода. Если посетители прокручивают страницу до конца перед заполнением формы, они могут отвлечься на это и покинуть страницу до преобразования.
18. Пример целевой страницы GetResponse
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок точно сообщает посетителям, что это за предложение.
- Подзаголовок хорошо поддерживает заголовок, давая возможность потенциальным клиентам узнать, как они могут извлечь выгоду из предложения.
- Стрелка действует как указатель направления, указывает прямо на кнопку CTA, заставляя посетителей также направлять туда свое внимание.
- Условия обслуживания, политика защиты от спама и политика конфиденциальности четко сформулированы таким образом, чтобы установить доверительные отношения с передачей личной информации.
- Форма из трех полей обеспечивает низкий барьер для входа и даже не требует заполнения фамилии.
- Цвет кнопки CTA — хороший контрастный цвет, который больше нигде на странице не используется.
Что проводить A / B-тест:
- Логотип связан с домашней страницей и может легко увести посетителей со страницы, не узнав о предложении и не конвертируясь.
- Описательной копии немного. Более подробное описание того, что такое GetResponse и каковы его основные преимущества, может привести к большему количеству конверсий.
19. Оптимизировать пример целевой страницы
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Маркированная копия позволяет посетителям сканировать страницу, чтобы быстро узнать о демонстрации.
- Инкапсуляция формы помогает ей выделиться и, вероятно, способствует большему количеству конверсий.
- Компьютерное изображение в форме дает потенциальным клиентам предварительный просмотр того, как будет выглядеть демонстрация.
- Форма из 5 полей подходит для предложения на этапе принятия решения.
- Копия кнопки CTA использует нехватку и срочность, чтобы убедить потенциальных клиентов подписаться на демонстрацию. «Сохранить мое место» означает, что количество мест ограничено и их необходимо зарезервировать.
- Логотипы компаний служат социальным доказательством того, что посетители знают, что Optimizely пользуется доверием некоторых ведущих мировых брендов.Кроме того, стрелки в этом разделе действуют как ориентиры, подразумевая, что есть еще больше логотипов, которые можно увидеть.
Что проводить A / B-тест:
- Навигация по верхнему и нижнему колонтитулам должна быть удалена, поскольку они могут удалить потенциальных клиентов со страницы и снизить коэффициент конверсии.
- Синяя кнопка с призывом к действию не выделяется так сильно, как если бы она была желтой или оранжевой.
- Кнопки социальных сетей внизу страницы также служат в качестве ссылок для выхода, отвлекая посетителей и уводя их с этой страницы.
20. Пример целевой страницы HubSpot
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Телефонный номер для интерактивного звонка улучшает взаимодействие с пользователем.
- Заголовок страницы сразу же объясняет предложение и дает посетителям понять, какую пользу оно принесет им.
- Короткие абзацы , маркеры и полужирный шрифт делают сканирование этой страницы быстрым, легким и удобным.
- Инкапсуляция формы помогает ей больше выделяться на странице и, вероятно, побуждает больше посетителей заполнять ее.
- Заголовок формы позволяет потенциальным клиентам узнать, что набор инструментов можно загрузить бесплатно. Добавление этого к заголовку страницы также повысит его эффективность.
- Ссылка на политику конфиденциальности рядом с полем электронной почты предоставляет потенциальным клиентам ссылку для быстрого доступа вместо прокрутки вниз страницы.
- Синяя кнопка с призывом к действию привлекает внимание, потому что на странице почти нет другого цвета.
Что проводить A / B-тест:
- Логотип HubSpot в верхнем левом углу связан с домашней страницей, что может немедленно увести посетителей со страницы.
- Повторение заголовка непосредственно под основным заголовком не требуется и добавляет беспорядок на страницу.
- Кнопки социальных сетей также могут удалять посетителей со страницы, снижая коэффициент конверсии.
- Форма из 12 полей слишком длинная и может запугать посетителей. Удаление некоторых полей или создание многоступенчатой формы может побудить больше потенциальных клиентов заполнить ее.
- Копия кнопки CTA расплывчата.Измените его на что-то вроде: «Мне нужен инструментарий!» может заинтересовать и привлечь больше потенциальных клиентов.
- Страница забалансовая . Добавление образца изображения набора инструментов или отзыва от кого-то, кто скачал набор инструментов, уравновесит страницу и, вероятно, увеличит конверсию.
21. Пример целевой страницы MailChimp
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Слово «бесплатно» в заголовке может сразу вызвать интерес у посетителей.
- Вспомогательный подзаголовок сообщает потенциальным клиентам, какую выгоду они могут получить от начала работы с бесплатной учетной записью.
- Форма из 3 полей короткая и не запрашивает очень личную информацию.
- Поле пароля улучшает взаимодействие с пользователем, позволяя посетителям видеть свою запись, нажав кнопку «показать». Кроме того, требования к паролю четко указаны внизу страницы.
- Отсутствие навигации по заголовку и минималистичный нижний колонтитул. позволяет потенциальным клиентам сосредоточиться на цели страницы — подписке на бесплатную учетную запись.
Что проводить A / B-тест:
- Добавление социального доказательства , например отзыва клиента или статистики об использовании MailChimp, скорее всего, приведет к увеличению числа регистраций.
- Прозрачная кнопка CTA не выделяется так сильно, как могла бы. Если сделать его темнее и контрастнее, больше людей будут щелкать по нему.
- Копия кнопки CTA также может быть улучшена, включив в нее более персонализированные и заманчивые формулировки, такие как «Создайте мою бесплатную учетную запись!»
22.Shopify пример целевой страницы
Что страница хорошо выполняет:
- Заголовок и подзаголовок хорошо контрастируют с темным фоном, что делает их привлекательными сразу после перехода на страницу.
- Только одно поле формы над сгибом упрощает действия для посетителей.
- Логотипы компаний и отзыв клиентов служат социальным доказательством, указывающим на то, что есть другие известные компании и довольные клиенты, которые доверяют Shopify.
- Минимальная копия делает навигацию по странице более простой и приятной для посетителей, а маркеры помогают привлечь внимание к основным преимуществам Shopify.
- Изображение дает потенциальным клиентам реалистичный предварительный просмотр приборной панели.
Что проводить A / B-тест:
- Цвет кнопки с призывом к действию следует изменить на тот, который еще не так часто используется на странице.
- Перенаправление взгляда людей на изображении на форму и кнопку с призывом к действию побудило бы больше посетителей посмотреть туда и совершить конверсию.
- Ссылка «Корпоративная электронная торговля» в нижнем колонтитуле действует как ссылка для выхода. Это единственный на странице, поэтому его удаление, скорее всего, увеличит коэффициент конверсии.
23. Пример целевой страницы Eloqua
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок описывает предложение, а подзаголовок поддерживает его, предоставляя дополнительную информацию о том, чего потенциальные клиенты могут ожидать от руководства.
- Маркированная копия позволяет посетителям сканировать страницу и извлекать важную информацию о руководстве. Серая рамка также помогает привлечь внимание к этому разделу.
- Рамка и цветовой контраст вокруг формы выделяют ее на странице.
- Оранжевая кнопка с призывом к действию хорошо контрастирует с остальной частью страницы, что делает ее «популярной» и привлекает посетителей. Кроме того, стрелка на нем служит ориентиром.
Что проводить A / B-тест:
- Текст «Контент недоступен» вверху страницы делает его непрофессиональным.
- Добавление белого пространства вокруг наиболее важных элементов, таких как заголовок, изображение и форма, поможет им больше выделяться и сделает страницу менее загруженной.
- Изображение слишком мало для того, чтобы служить своему назначению. Увеличение и увеличение разрешения сделают его более эффективным.
- Множественные ссылки для выхода в нижнем колонтитуле дают посетителям возможность покинуть страницу без конвертации.
24. Пример целевой страницы Basecamp
покажите мне, как работает Instapage ➔Что страница хорошо выполняет:
- Заголовок служит незамедлительным социальным доказательством, точно сообщая посетителям, сколько человек подписалось на Basecamp только на прошлой неделе.
- Зеленая стрелка , указывающая на поле формы, действует как визуальная подсказка.
- Только одно поле формы наверняка не помешает людям заполнить его.
- Возможность использовать учетную запись Google делает регистрацию еще более удобной и привлекательной.
- Копия кнопки CTA эффективна, потому что в ней используется от первого лица и слово «бесплатно».
- Отзывы клиентов в верхней части, вероятно, заставят потенциальных клиентов чувствовать себя более комфортно с Basecamp.
- График внизу страницы — хорошее дополнение, потому что он показывает посетителям, насколько Basecamp вырос за эти годы.
Что проводить A / B-тест:
- Навигация по заголовку предоставляет посетителям несколько способов покинуть страницу, не просматривая все предложение.
- Кнопки с призывом к действию не выделяются так сильно, как могли бы, потому что остальная часть страницы синего цвета. Их тестирование в оранжевом или красном цвете может привлечь больше внимания.
- Дополнительные ссылки для выхода по всему тексту позволяют потенциальным клиентам покинуть страницу без регистрации.
- Копия малоинформативна. О самом Basecamp в нем ничего не говорится, а просто ответы на три вопроса о пробном периоде. Добавление подробной информации о том, как приложение может принести пользу пользователям, может убедить больше людей зарегистрироваться.
- Изображение устройств следует увеличить, а гиперссылку удалить.Включение его полезно, потому что оно демонстрирует все возможные способы использования Basecamp, но в настоящее время его трудно увидеть и оно служит еще одной ссылкой для выхода.
25. Пример целевой страницы Airbnb
Что страница хорошо выполняет:
- Заманчивый заголовок привлекает внимание посетителей и с самого начала предлагает денежное вознаграждение.
- CTA-кнопка хорошо контрастирует с фоном и находится прямо в центре страницы.
- Снимок головы добавляет личное соединение с другом, который пригласил вас присоединиться к услуге.
- Связанные условия обеспечивают ценность доверия для всех, кто не решается зарегистрироваться.
Что проводить A / B-тест:
- Навигация по верхнему и нижнему колонтитулам отвлекает посетителей и позволяет легко покинуть страницу без конвертации.
- Добавление отзывов клиентов на эту целевую страницу после клика, вероятно, привлечет больше потенциальных клиентов к конверсии.
Можете ли вы превзойти лучшие примеры целевой страницы после клика?
Вот и все — некоторые из ведущих мировых компаний с одними из лучших примеров целевых страниц после клика.