Студия «Tell different»
создание сайтов, поддержка и продвижение

Украина, Полтава, пр-т Вавилова 13/42

тел.: +38-050-1705-777

 

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

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

Конверсия
Показатель эффективности страницы. Показывает соотношение количества посетителей, которые совершили какое-то полезное действие на странице для ее владельца к общему количеству посетителей
Заголовок
Самая верхняя часть лендинга. Обычно здесь размещают логотип, меню навигации по странице, краткие контактные данные, слоган.
Хэдер, слайдер
Найболее значимый блок первого экрана лендинга. Обычно в нем размещают слайдер с описанием предложения для клиентов, возможно форма заявки на продукт или подписки на услугу.
Дополнительные блоки
В этих блоках приводится дополнительная информация, которая помогает мотивировать клиента на приобретение продукта или оформить подписку
Футер
Самая нижняя часть страницы, в которой располагается различная справочная информация.
CTA
Call To Action - призыв к действию. Слоган или просто фраза, которая четко дает понимание клиенту, что ему предлагается и какое действие ему необходимо совершить.

Пять примеров лендингов,
у которых есть чему поучиться


Лендинг компании OROBIND

Компания OROBIND занимается подбор тренеров для клиентов в Индии.

Скриншот лендинга компании Orobind

Ссылка на оригинал лендинга

Покажите клиенту все лучшее, что у вас есть для него

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

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

Исключите сомнения клиента

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

Слоган на лендинге компании Orobind однозначно понятен для посетителя:

Представляем вам самый удобный способ чувствовать себя здоровым

Приведите свое тело в форму / Питайтесь правильно / Чувствуйте себя прекрасно / Просто кликните

Скачать приложение для Android / Что делать если у меня нет Android-устройства

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

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

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

Иконки соцсетей и элементы роста уровня доверия

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

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


Лендинг плагина TweetDis

TweetDis - это плагин для CMS WordPress, который позволяет размещать заготовки твитов с произвольным текстом (обычно это различные цитаты на странице) прямо со страницы сайта.

Скриншот лендинга плагина TweeDis

Ссылка на оригинал лендинга

Покажите посетителю как это работает

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

  • Посмотрите видео, это займет всего 2 минуты
  • Узнайте как поднять эффективность твитов с вашей страницы на 200%
  • Узнайте как получить еще твиты от посетителей

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

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

Помните, что посетители ищут для себя полезный продукт, а не вас

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

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


WPD

Сайт WPD предлагает своим клиентам услугу по быстрому поиску плагинов для CMS WordPress

Скриншот лендинга WPD

Ссылка на оригинал лендинга

Все предельно ясно

Каждый, кто создавал сайт на платформе WordPress, тот знаком с проблемами подбора нужных плагинов для сайта. Их существует огромное множество, десятки тысяч. Поэтому зачастую 3/4 времени разработчики тратят на выбор нужного набора плагинов.

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

Очень многие разработчики оценят услуги этого сервиса за счет ясности и четкости понимания того как им пользоваться.

Не полагайтесь на свое мнение

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

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

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


Лендинг компании Natura Petz

Компания Natura Petz производит органические добавки для питания домашних животных

Скриншот лендинга Natural Petz

Ссылка на оригинал лендинга

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

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

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

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


AdSpike

Лендинг сервиса AdSpike от компании Odoo. Продукт предлагает посетителям оптимизировать их затраты на AdWords

Скриншот лендинга AdSpike

Ссылка на оригинал лендинга

Визуализация - один из способов увеличения конверсии на сайте

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

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

Но вот текст "And get your free performance report" (и получите свободный отчет роста эффективности) - ну явно выполнен слишком мелким шрифтом, что может вызвать раздражение у посетителя. Ведь если это одно из преимуществ сервиса AdSpice, то почему о нем говорят постетителю таким мелким шрифтом?

Выделите важные статические данные цветом

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

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


ИТОГ

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

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

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

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

Оставьте свой комментарий

0
  • Комментарии не найдены

Другие статьи и новости

25 летающих фантазий фотографа Равшана Азалии
Фотоработы узбекского профессионального фотографа Равшана Азалии - это...
Подробнее...
Для кого-то и дым - кисть: 26 изображений спорткаров
Румынский дизайнер Октавиан Миелу является большим поклонником спорткаров и,...
Подробнее...
Лендинги и одностраничные сайты
Лендинг, посадочная страница (англ. landing page) — страница скомпонованная под...
Подробнее...
Столик для кофе, который собирается без единого шурупа или винта
Мы начинаем новую рубрику в своем блоге «Мы верим в дизайн». В статьях с этой...
Подробнее...
Прайс-лист на создание лендингов и одностраничных сайтов
Ниже приведены основные сведения о лендингах и одностраничных сайтах,...
Подробнее...
12 правил создания лендинга
Можно ли легко и просто создать лендинг-пейдж? Можно! Однако создать...
Подробнее...

Нужна наша помощь?

Подпишитесь на новости