Как создать продающий лендинг пейдж: правила разработки и типичные ошибки

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

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

Лендинг (или landing) - это посадочная страница, которая должна мотивировать посетителя купить товар или услугу.

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

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

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

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

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

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

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

  • четко и понять дать понять, какова конечная цель вашего лендинга ; что должен сделать посетитель. Поэтому пишите четко и понятно;
  • использовать один призыв к действию - не надо размещать множество кнопок, ссылок или различных форм, сделайте один заметный призыв, на котором пользователь сможет сконцентироваться;
  • сделать кнопку. Кнопка привлекает гораздо больше внимания, чем просто надпись. Поэтому призыв к действию в виде кнопки будет более заметен и эффективен;
  • добавить причину сделать действие именно сейчас. К примеру, если пользователь зарегистрируется сейчас, то он получит доставку бесплатно (или скидку 10%, или что-то еще). Предложение надо расположить рядом с призывом к действию, чтобы оно могло влиять на принятие решения покупателем.

2. Эффективный заголовок

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

Заголовок должен заинтересовать и заставить пользователя провести на странице как можно больше времени (и выполнить целевое действие).

Ключевой момент - достаточно ли заголовок интересен для того, чтобы дальше просматривать страницу? Если ответ «да», то заголовок придуман удачно; если «нет», то имеет смысл поменять его.

Несколько правил эффективного заголовка:

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

3. Простая структура

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

Чтобы создать эффектную структуру, основывайтесь на следующих принципах:

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

4. Контроль взгляда

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

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

Что можно использовать?

  • Графические элементы : стрелки, иконки, контрастные оттенки, emoji. Все, что может переключать взгляд пользователя от одного элемента к другому.
  • Последовательность элементов . Не только зрительная, но и логическая: представьте, что вы рассказываете историю - логично ли идут блоки, правильно ли раскрывается информация?

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

5. Соответствие рекламе

Если на лендинг ведет реклама, то ее содержание должно полностью совпадать с тем, что вы предлагаете в итоге: стоимость, скидка, вид товара и т.д. Если что-то будет не совпадать, это приведет к обману ожиданий и негативной реакции в целом.

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

6. Доверие

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

Обычно это могут быть такие способы:

  • гарантия на товар;
  • тестовый период (если речь об услуге);
12 сентября 2016

Эффективная посадочная страница (landing page) — чудо инженерной мысли, невероятный конструкторский проект, где нет ничего лишнего и все сделано для того, чтобы человек мог быстро получить полезную ему информацию и совершить нужное вам действие. Скажу сразу, что нет универсального ответа, как сделать на 100% успешный лендинг. Вы можете для начала постараться не повторять ошибок других и тестировать, тестировать, тестировать!

Сегодня мы поговорим о следующих вопросах:

  1. Размер шрифта
  2. Акценты
  3. Типы шрифта и их разнообразие
  4. Длина строк и верстка
  5. Заголовки
  6. Размер блоков текста и их компоновка
  7. Иллюстрации
  8. Иконки и списки
  9. Фон и цвет шрифта
  10. Психология цвета

Мало кто задумывается о том, что успешность посадочной страницы (мы говорим не только о landing page) зависит не только от верного маркетингового предложения, точного попадания в ЦА и правильного контента, но и от грамотного оформления. У вас есть всего несколько секунд, чтобы произвести хорошее впечатление на потенциального покупателя и «зацепить» его. Если точно - 5 секунд.

Какой размер шрифта лучше?

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

Размер экранного шрифта измеряется в нескольких вариантах единиц: пикселях (px), процентах (%) и ems (em). Px - самая известная и старая единица измерения, которая, в отличие от % и em, не дает возможности масштабировать текст для чтения на различных экранах, т. е. это абсолютный размер шрифта, и пользователь не сможет его адаптировать под свои вкусы и предпочтения.

Когда-то стандартным для всех сайтов был размер 12 px, но со временем стало понятно, что для экранов он мелковат, и от него отказались в пользу более крупного шрифта. Сегодня в ходу шрифт не меньше 14-16 px или его аналог в em и %.

1 em = 16 px = 100% Times New Roman (serif).

Обратите внимание, что не все шрифты имеют одинаковый размер: 16 px Arial больше, чем например версия 16 px Trebuchet.

16 px - это оптимальный размер, потому что набранный им текст на экране выглядит примерно так же, как текст, напечатанный в качественной книге (мы не берем карманные форматы и т. д.). И он отлично подходит для людей, имеющих проблемы со зрением, или тех, кто старше 40 и видит уже не так хорошо, как в 20. Например, текст, который вы сейчас читаете, - это Arial 16 px. Если вы распечатаете листок бумаги с шрифтом 10 px и поместите рядом с экраном, то увидите, что размеры шрифтов будут одинаковые. Так что мой выбор это 16 px. Отдельные, не значимые куски текста можно делать 14 px. Многие используют в качестве основного шрифта 14 px, это допустимый вариант, но если ваша ЦА старше 40 лет, то я бы точно выбрал 16 px.


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

Как привлечь внимание к заголовкам?

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

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


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



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

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


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



Подчеркивание в заголовках допустимо только в том случае, если это линк.

Например, так:



Можете экспериментировать с цветами и эффектами (инверсия, цветная плашка и т. д.).


Применяйте в заголовках кавычки - они привлекают взгляд.


Но лучше любой типографики заголовок выделит хороший копирайтинг. Почитайте пару книг и дерзайте! Вот несколько советов:

    Заголовок или подзаголовок в форме вопроса вызовет интерес у читателя.

    Заголовок должен быть не длиннее 140 символов.

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

Какой шрифт выбрать?

Традиционно для веб применяют шрифты, у которых отсутствуют насечки (шрифты семейства sans-serif, или «рубленые»): Tahoma, Arial, Verdana, Trebuchet и аналогичные. Зачем это нужно? Чтобы избавить читателей вашего текста от «лесенок» по краям символов, которые появляются на экранах с низким разрешением.

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

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


Лайфхак: если вы присмотрели какой-то сайт, где вам нравится шрифт, но вы не можете его распознать, зайдите в секретную библиотеку - там есть ссылка на полезное приложение, которое позволит получить всю нужную информацию. (приложение WhatFont для Google Chrome)

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

Всегда помните, что пользователь читает не более трети созданного вами контента, поэтому помогите ему сразу найти нужное! Самый простой способ обратить на что-то внимание человека внутри основной массы текста - выделить это с помощью:

    полужирного написания (bold),

  • НАПИСАВ ВЕРХНИМ РЕГИСТРОМ (ПРОПИСНЫМИ),

    выделив другим цветом.

Полужирное написание

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


Курсив

Курсив в веб - зло. Думаю, вы уже догадались почему. Если нет, вернитесь к разделу про типы шрифта. Курсив создает те самые «лесенки». Если берете курсив, то следите за размером: нет ничего хуже мелкого курсива. Я считаю, что курсив в веб уместен только в оформлении цитат.


Немного о ВЕРХНЕМ РЕГИСТРЕ

Можно, но не злоупотребляйте! Выше я говорил, как наш мозг реагирует на предложения, полностью написанные прописными буквами. Но есть еще один важный аспект. Текст, полностью написанный заглавными буквами, в интернет-среде означает крик. Если в тексте встречается предложение, написанное прописными, - вы его прокричали! Подумайте, уместен ли «повышенный тон» в конкретном случае.

Разряжение

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

Подчеркивание и Ссылки

Хотите подчеркнуть? Только ссылку! Если на сайте есть некликабельный подчеркнутый текст, вы облажались. Убирайте! В веб этот вид выделения принадлежит гиперссылкам. Традиционно гиперссылки оформляются как выделенный голубым подчеркнутый текст. Это устоявшийся в интернете стандарт, и я не рекомендую менять его без веских на то причин. Выделенная другим цветом ссылка выглядит странновато и непонятно. Даже Google и «Яндекс» оставили их именно в таком варианте, хотя могли бы позволить себе задать новую моду.

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


Типичной ошибкой является оформление ссылок в корпоративных цветах компании.




Как правильно оформить Call To Action?

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

Что касается расположения Call To Action, то он всегда есть на первом экране и в конце страницы и может несколько раз повторяться в тексте (это зависит от длины страницы).


Вот некоторые правила оформления «кнопки»:

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

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

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



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



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

Длина строк и верстка: главные правила

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

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



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


Трехколонная верстка, как в примере с клиникой, - путь в никуда, который уместен только для бескрайних просторов интернет-СМИ, которые «продают» своему читателю пару десятков баннеров на каждой странице.

Верно: Не верно:


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

Проблема длины строк становится еще более актуальной с появлением адаптивной верстки и требует от разработчика аккуратности и внимательности: разбег размера экрана сегодня варьируется от 5’’ до 55’’.

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

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


Как оформить текстовый блок?

Структура любой страницы состоит из блоков. Их количество и наполнение зависят от целей сайта.


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


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


Что касается компоновки картинки, заголовка и блока, то тут есть много вариантов, но вот три классических.


Картинка слева , блок с заголовком и текстом справа. Очень удачный вариант: картинка привлекает внимание к тексту (eye catch).


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


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

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

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

  1. Помните главное: эффективность лендинга зависит от вашего умения выстраивать гипотезы (что может понравиться пользователям?) и проверять их А/В-тестированиями .
  2. Вначале займитесь созданием прототипа лендинга: продумайте его концепцию (что вы предлагаете? как вы предлагаете? почему ваше предложение выгодно потенциальному клиенту?), поразмыслите над формой подачи информации, выстроите «на бумаге» структуру вашего лендинга, набросайте черновые текстовки - и только после этого начинайте делать лендинг «начисто». Правьте тексты в процессе работы над страницей.
  3. Создавайте предельно четкий оффер - у посетителя не должно возникать вопросов, что именно вы предлагаете: отличные зеленые ковры или все-таки два ковра по цене одного до конца текущего месяца.
  4. Грамотно продумайте размещение на странице основных элементов лендинга: оффер, призыв к действию (Call To Action, СTA), форма заказа, блок с преимуществами, продающие триггеры, социальные доказательства (отзывы, например), визуализация вашего предложения (картинка).
  5. «Обычные» тексты (в стилистике статьи), как правило, не работают в лендингах.
  6. Текст лендинга - предельно лаконичен, предельно информативен, предельно плотен.
  7. А главное - он небольшой по объему.
  8. Ближе всего к правде будет высказывание: в лендинге используются не тексты, а «текстовки».
  9. Но! Не смотря на сказанное в предыдущих трех пунктах, не стоит недооценивать возможности текста. Текст - одна из самых эффективных форм выражения вашего коммерческого месседжа. Что еще для людей более важно, чем язык?
  10. Работайте над текстовками лендинга долго и тщательно, выверяя каждое слово.
  11. Не допускайте ошибок - это «смазывает» впечатление от вашего, может быть (не будь ошибок), превосходно работающего лендинга.
  12. «Не кричите» в лендинге. Кто-то думает иначе: чем креативнее и побудительнее текстовки, чем больше в них «рекламных» выражений и «кричащих» фраз (купите прямо сейчас, другой такой возможности у вас не будет, на всех не хватит, спешите, бегите, отдайте скорее нам ваши деньги!), тем эффективнее лендинг. Да, есть такая точка зрения: вся сила рекламы в яркости, экспрессивности и побудительности. Я же лично считаю, что кричат слабые, сильные - убеждают. Экспрессия и навязчивость традиционной рекламы надоела людям. Их нельзя заставить купить, их можно только убедить. Единственный путь - дать максимум полезной для совершения выбора в пользу вашего продукта информцаии, но не навязывать: все равно не подействует.
  13. Не нужно «заманивать» и «интриговать» - пишите по-человечески, чтобы можно было составить абсолютно точное представление о вашем продукте. Колбасу с каким названием вы предпочтете купить для семейного ужина: «Пикантная Снежана» или «Телячья»? Я лично - последнюю.
  14. Человек хорошо запоминает 80 % из того, что видит, и только 20 % - из того, что читает. Именно поэтому так важна визуальная составляющая в лендинге.
  15. Не пытайтесь дать всю инфорацию в текстовом виде. Такой лендинг вряд ли не сконвертит вам клиентов. Активно используйте потенциал вашего дизайнера.
  16. Используйте для передачи информации не только текст, но и графические элементы (знаки, символы, простые таблицы и т.д)
  17. В дизайне главное - не красота, а его функциональность: все части целого должны работать на общую задачу.
  18. Лендинг существует на стыке копирайтинга,

Которые создаются, чтобы продавать один товар и услугу.

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

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

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

Где сделать прототип лендинга?

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

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

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

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

Создание сайта лендинг пейдж

Что нужно учесть при создании лендинга ещё?

Лучше воспринимается 80% того, что человек видит, и 20% того, что читает. Так что следует также правильно подбирать оформление и делать небольшие по объёму тексты. Просмотрите примеры других страниц, чтобы знать, . Очень помогают сравнительные таблицы.
В современном мире неограниченное количество различных товаров и услуг, и в большинстве случаев, кто-то уже занимается тем же, что и вы. Поэтому вам нужно предоставить свою продукцию в самом лучшем свете. Если вы точно знаете, в чём ваше преимущество, не бойтесь показывать это! Делайте разные инфографики и таблицы с вашими данными и информацией других компаний.

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

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

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

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

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

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

Современная интернет-маркетинговая стратегия практически непредставима без использования целевых страниц (Landing Pages, посадочные страницы, лендинги), которые все чаще встречаются в рекламных кампаниях как крупных брендов, так и представителей SMB-сектора Рунета.

По нашей просьбе специально для пользователей work-zilla.com свои рекомендации относительно того, как создать Landing Page с высокой конверсией озвучил директор по маркетингу LPgenerator Максим Плосконосов. Советы эксперта такого уровня будут безусловно ценны для наших заказчиков и исполнителей, ведь сервис LPgenerator представляет собой ведущее SaaS-решение Рунета по созданию и работе с целевыми страницами.

Посадочные продающие страницы на практике чаще всего используются для решения следующих задач:

Первая задача - получение контактной информации или лид (lead, «лид»; термин многозначный, означающий как данные, полученные от посетителя email, имя и т. д., так и пользователя, оставившего такую информацию). Такие лендинги называются лидогенерирующими (Lead Capture Landing Page), процесс, происходящий на них - генерация лидов.

Вторая задача - клик, переход или подготовка потенциальных клиентов к завершению конвертации на другой странице; такая целевая страница называется «кликабельной» (Click-through Landing Page) и является частью конверсионных путей или мини-сайта.

Если лид-страница получает данные (посредством заполнения посетителем специальной интерактивной web-формы, так называемой «лид-формы»), то Click-through лендинг, наоборот, предоставляет дополнительные сведения о сути вашего оффера. Конечным пунктом конверсии на CTR-посадочной странице будет переход непосредственно на другой лендинг, где осуществляется покупка или генерация лида.

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

Правила продающего лендинга:

1. «Один лендинг - один оффер»

Уникальное торговое предложение (оффер) есть набор маркетинговых характеристик, описывающий ваш продукт, предлагаемый рынку. Другими словами, оффер есть некий объект, обладающий ценностью в глазах целевой аудитории и предоставляемый вами в обмен на деньги или персональные данные потенциального клиента. Суть УТП выражается через 4 текстовых элемента любого продающего лендинга: основной заголовок; поддерживающий подзаголовок; текст, усиливающий заявление; заключительный аргумент.

Каждая отдельно взятая целевая страница предполагает один конкретный оффер, получаемый посетителем для выполнения конверсионной задачи, поставленной перед ним веб-маркетологом. На решение этой задачи должны быть ориентированы все элементы лендинга: логотип, главное изображение, текстовые составляющие - заголовок, подзаголовок, список преимуществ, надпись на интерактивной кнопке призыва к действию (CTA, Call-to-Action).


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

2. Правило точного соответствия

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

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

Простой и понятный заголовок лендинга - вот ваше главное орудие привлечение внимания посетителей, обладающих крайне низким «порогом внимания» (5-8 сек). За эти считанные секунды даже самый неторопливый пользователь успеет прочесть заголовок лендинга (на этом 80% из них вообще прекращает «исследование» страницы). То есть в заголовке должно обязательно присутствовать ключевое слово, соответствующее вашему УТП.

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

3. Используйте высококачественные изображения и видео

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

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

4. Упоминайте о выгодах оффера (буллеты), а не о технических характеристиках

Не нужно утомлять посетителей перечислением технических характеристик вашего продукта или ваших заслуг - им это нисколько не интересно.

Вы должны рассказать о выгодах вашего УТП, обращаясь к подспудным страхам таргет-группы («страх потери», loss aversion - сильнейший стимул к завершению сделки). Вы можете напрямую обращаться к пользователю, упоминая о прекращении выгодных условий сделки («Только 3 дня - скидка 25%») или же более тонким способом, например так: «Сохрани эти бесценные часы для жизни - посуду пусть моет машина».

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

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

5. Используйте социальные доказательства

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

6. Цель конверсии воплощена в призыве к действию (CTA)

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

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

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

Отсюда следует равнозначная важность обеих составляющих кнопки призыва к действию: ее дизайна и текста призыва. Но хотя эти элементы непосредственно влияют на конверсию, роль они выполняют разную: дизайн привлекает внимание к CTA-элементу, текст же призыва отвечает на главный вопрос пользователя: «Почему я должен нажать на кнопку?»

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

7. Источники трафика

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

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

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

Неплохие результаты показывает email трафик - хорошая конверсия, но он ориентирован на «длинные» маркетинговые стратегии и требует применения особых тактик (сегментация подписной базы, «выращивание» клиентов, так называемый Nurturing).

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

8. Оптимизация конверсии

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

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

Для оптимизации конверсии применяется метод маркетингового исследования известный как сплит-тест (А/Б-тест, A/B/n-тест), заключающийся в сравнении 2 или более вариантов целевой страницы.

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

Для получения практически значимых результатов теста следует придерживаться заранее установленных параметров статистической значимости:

100 достижений конверсии по каждому варианту;
1000 уникальный посетителей по каждому варианту;
минимум 3 недели тестирования.

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

По мнению большинства экспертов по оптимизации конверсии (CRO, Conversion Rate Optimization), подвергать А/Б-тестингу нужно в первую очередь элементы лендинга, оказывающие решающее влияние на преобразование.

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

Главное изображение. Замена изображения может принести драматический прирост конверсии. Можно попробовать заменить фотографию на видео.

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

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

Высоких вам кoнверсий!



Есть вопросы?

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: