Что такое макет лендинга

Как создать идеальный лендинг: структура, контент и изображения

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

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

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

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

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

В будущем описание ЦА также пригодится для настройки контекстной и таргетированной рекламы.

Описание ЦА — фундамент, на котором строится не только лендинг, а весь интернет-маркетинг, без него эффективность продвижения будет существенно ниже.

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

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

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

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

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

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

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

В этой части лендинга обычно размещаются логотип, телефон, ссылки на разделы страницы.

В качестве телефона используйте только городские номера и/или бесплатный 8 (800). Это сработает на формирование доверия к вашей компании. Рядом с телефоном можно указать время работы и кнопку «Заказать звонок» — не все хотят звонить и некоторым комфортней, когда звонят им.

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

Пунктами в меню сделайте ссылки только на самые важные разделы страницы.

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

Благодаря заголовку (офферу) пользователь в первые 3-5 секунд должен понять, на каком сайте он находится и что ему предлагают. Сформулируйте заголовок так, чтобы в нём присутствовала ключевая фраза и уникальное торговое предложение. В первые секунды нужно зацепить пользователя, чтобы он проявил интерес и начал просматривать страницу.

Подзаголовок раскрывает суть вашего торгового предложения. Это короткий текст в 2-3 строки. В качестве подзаголовка можно использовать маркированные списки или списки с иконками.

Задача изображения — показать товар лицом! У изображения должна быть прямая связь с заголовком. Разместить его можно рядом с заголовком или сделать фоновым.

Какие фотографии подойдут:

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

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

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

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

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

Какие фотографии и видео делать:

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

Как доказать качество продукта? Покажите фото сертификатов и опишите, где специалист проходил обучение и чему конкретно научился специалист. Если у вас производство — укажите, на каком оборудовании сделан товар, каким нормам, ГОСТ и требованиям соответствует продукция. Можно использовать галерею выполненных работ и фотографии «до — после» — отдельный блок результатов вашей работы, особенно подойдёт сфере услуг:

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

Расскажите о себе, используя один или несколько из перечисленных форматов:

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

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

Нет универсальной формулы, сколько нужно форм на странице, часто можно встретить такое распределение:

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

На кнопках можно использовать призыв к действию:

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

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

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

Реклама без аналитики — деньги на ветер. Системы аналитики Яндекс.Метрика и Google Analytics должны регистрировать каждое целевое действие на вашем сайте. Целевое действие — то, что приносит вам контакты клиента:

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

Системы аналитики передают достижения целей в рекламные кабинеты Яндекс.Директа и Google Ads. Благодаря этому можно оптимизировать рекламные кампании: специалист по контекстной рекламе будет видеть, какие ключевые слова приносят конверсии, а какие — нет.

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

Источник

Лендинги: для чего нужны, структура, примеры и основные ошибки

Разбираем понятие «Лендинг», чем отличается от сайта, в каких случаях использовать, раскрываем секреты конверсионных лендингов

Что такое лендинг?

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

Чем лендинг отличается от сайта

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

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

Для чего и в каких случаях используется

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

Структура лендинга

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

Ошибки при создании лендингов

Примеры удачных решений на лендингах

Отличный первый экран

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

Наглядная отработка возражений

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

Еще один вариант отработки возражений

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

Вариант оформления социальных доказательств

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

Карта выполненных работ

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

Отличный призыв к действию

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

Сегментирование целевой аудитории

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

Еще один пример отличного первого экрана

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

Примеры ошибок на лендингах

Неудачное цветовое оформление

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

Все хорошо, кроме невнимательности

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

«Перегруженная» форма регистрации

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

Источник

Как сделать лендинг самому. Пошаговая инструкция (2019)

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

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

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

Как сделать лендинг самому — подготовка контента

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

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

Пример лендинга

Работа над контентом при создании лендинга проходит в несколько этапов.

Этап 1. Сформулировать гипотезу

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

Этап 2. Изучить конкурентов

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

Как это сделать? Посмотрите, что предлагают в ответ на запросы поисковики Google или Яндекс.

Поиск вариантов ключевых слов в Google Adwords

Затем введите в строку поиска подходящие ключевые слова и изучите страницы конкурентов:

Рекламные объявления компаний по запросу «беседка для дачи»

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

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

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

Этап 3. Описать целевую аудиторию и выделить сегменты

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

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

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

Как изучить свою аудиторию и найти сегменты:

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

Пример отзыва на сайте магазина настольных игр

Если эти преимущества вы встретите в отзывах несколько раз, то они значимые. Их стоит упомянуть на лендинге.

Этап 4. Написать текст лендинга

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

В его структуре используются несколько стандартных блоков. Сейчас расскажем об основных из них. Шапка лендинга, УТП или оффер, подзаголовок и призыв к действию — блоки первого экрана. Его видит посетитель, попадая на сайт.

Структура лендинга

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

Этап 5. Подобрать картинки, видео, фотографии

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

Фотографии товара можно попросить у поставщика или сфотографировать самому.

Подобрать фотографии в высоком разрешении можно также на платных и бесплатных фотостоках.

Нельзя просто взять фотографию из поиска — это нарушение авторских прав. В лучшем случае автор фотографии напишет вам и попросит заменить или оплатить фото. А может и подать в суд. Бесплатно можно использовать фотографии с лицензией Creative Commons. Подробно о лицензии Creative Commons и ее типах мы писали в одной из прошлых статей.

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

Как сделать лендинг — оформляем текст в конструкторе

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

Сделать лендинг бесплатно можно с помощью конструкторов:

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

Зарегистрироваться на сайте и ознакомиться с подсказками

После регистрации сервис сразу предложит вам создать сайт.

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

Справочные материалы на сайте Tilda

Создать сайт

Придумайте название сайта. Это рабочий вариант, он виден только вам:

Создание сайта в конструкторе Tilda

Выбрать шаблон

Шаблоны в конструкторе сгруппированы по тематике и задачам. Просмотрите несколько вариантов, чтобы увидеть, есть ли там нужные блоки:

Выбор шаблона на сайте Tilda

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

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

Шаблон «Ремонтная компания» для создания страницы

Вставить свой текст и фотографии

На следующем этапе меняем текст-заглушку и фотографии на свои, прописываем текст на кнопках.

Шаблон со своим текстом и фотографией

Опубликовать сайт

Когда все отредактировано, нажимаем «сохранить» и смотрим результат.

Если результат вас устраивает, ссылки работают, можно публиковать страницу в интернете и запускать рекламу.

На бесплатном тарифе адрес страницы будет иметь такой вид:

Бесплатный адрес сайта на субдомене Tilda

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

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

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

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

Email рассылки

Рассылки помогают прогреть посетителей, которые пока не готовы к покупке. Вы можете добавить на лендинг форму подписки из SendPulse. Тогда контакты подписчиков будут сразу попадать в сервис. В справочном разделе Tilda описано, как вставить на страницу форму подписки SendPulse и собирать email адреса потенциальных клиентов.

Автоматические серии писем

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

Чтобы настроить авторассылки, нужно зайти в SendPulse и выбрать раздел «Авторассылки»:

Создание автоматических рассылок в SendPulse

Web push уведомления

Еще один способ повысить конверсию лендинга — настроить web push уведомления. Когда посетитель находится на странице, в браузере появляется предложение подписаться на уведомления:

Предложение подписаться на push уведомления

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

Web push уведомления помогают решить несколько задач:

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

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

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

Регистрируйтесь в SendPulse, чтобы повышать конверсию лендинга с помощью рассылок и push уведомлений и превращать посетителей в покупателей!

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

Источник