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

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

Первый экран

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

Основные элементы которые должны присутствовать на первом экране:

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

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

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

Подзаголовок должен пояснять заголовок или отвечать на вопрос пользователя «Что я получу?»

Логотип

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

Пункты меню

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

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

Кнопка действия

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

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

Список выгод

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

Дизайн первого экрана

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

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

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

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

Блок о проекте

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

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

Блок с преимуществами

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

Однако не ставьте иконки ради иконок. Каждый элемент на сайте нужно тщательно продумать, даже такие мелочи.

Блок товаров или услуг

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

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

Блоки призыва к действию

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

Что ещё включить в структуру лендинга:

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

Отзывы. Смысл тот же: важно показать, что у вас уже есть клиентская база и она рада сотрудничеству с вами. Это может быть даже один отзыв, но красиво оформленный и интересно выделенный.

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

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

Форма обратной связи

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

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

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

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