Содержание

Примеры лендингов

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

Продажа бензовозов и битумовозов

Пример сайта интернет магазина бензовозов и битумовозов от производителя Сеспель по России и СНГ

Сайт одностраничник татуировок

Пример красивого сайта татуировок и консультация в городе Астрахань

Сайт свадебной выездной регистрации

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

Сайт продажи iphone аксессуаров

Пример современного сайта iphone аксессуаров с продажей по всей РФ.

Сайт по продаже овощей оптом

Пример оптового сайта по продаже картофеля, лука, капусты в г. Саратов

Сайт клининговой компании АкваЭкоХим

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

Сайт агентства сертификации Alfasert

Пример простого сайта сертификации товаров и услуг по всей России.

Пример юридического сайта по ликвидации фирм

Пример одностраничного сайта по ликвидация фирм в Санкт-Петербурге и Ленинградской области.

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

Пример сайта услуг центра красоты в г. Санкт Петербург.

Сайт мобильного роторного снегоукладчика

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

Оптовый сайт продажи ткани VERDI

Пример правильного сайта по продаже штор по всей России оптом со своим производством.

Сайт салона штор VERDI

Пример адаптивного сайта салона штор с доставкой по всей РФ. Собственное производство.

Пример сайта организации с продажей товаров

Пример нового сайта компании, которая занимается продажей акриловых перчаток по всей России и СНГ

Сайт ветеринарной клиники ЛапЛандия

Пример лендинг пейдж ветеринарной клиники ЛапЛадния в Нижнем Новгороде.

Сайт санатория «Aрай Deluxe Thermal Resort»

Пример сайта одностраничника санатория Aрай Deluxe Thermal Resort в городе Сарыагаш.

Сайт продаж Лякутюр

Пример сайта продаж женских костюмов и пальто Exalta оптом по всей РФ.

Сайт одноэкранник Команды F5

Пример одноэкранника по внедрению автоматизации CRM систем.

Сайт бригады ремонта

Пример сайта ремонта квартир, коттеджей и офисов в г. Москва.

Пример сайта товаров ручной работы

Пример сайта ручной работы — чайные домики, которые можно отдекорировать перед применением.

Сайт для продаж бетона от производителя

Пример хорошего сайта для предприятия. Производство, продажа и доставка бетона от производителя.

Сайт металлопроката и изготовления изделий из металла

Пример разработки сайта металлопроката по оптовым ценам от производителя.

Web сайт ARTIDES студия

Пример сайта студия коммерческого дизайна. Комплексные решения для успешного бизнес.

Пример сайта ковров Moldabela

Пример сайта по продаже ковров от компании производителя с доставкой по всей России.

Сайт Сантехремгрупп

Пример личного сайта частного сантехника, занимающегося установкой и ремонтом сантехники.

Пример web сайта по продаже мяса

Пример web сайта по продаже охлажденного и свежемороженого мяса оптом.

Сайт юридической компании ZONT

Пример интернет сайта юридических услуг по защите должников банков и МФО в г. Мурманск.

Сайт оптовой компании Ютвуд

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

Сайт аренды строительной техники

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

Сайт спорткомплекса DOBERMAN

Примеры лендинга для услуг тренажерного зала DOBERMAN. Многопрофильные спортивные залы в Ульяновске.

Интернет магазин купальников

Хороший пример лендинг пейдж по продаже модных купальников из Европы по низким ценам в Новосибирске.

Пример подписной страницы лендинг Цветаны

Сайт для марафона Цветаны Сафроновой по формированию стиля одежды у девушек.

Сайт Цветаны Сафроновой об одежде

Пример лендинга с высокой конверсией — Как стиль в одежде влияет на жизнь женщины.

Сайт по продвижению телефонии

Примеры лендинга по продаже услуг телефонии. Хороший пример современного промо сайта.

Красивый сайт автосервиса в г. Астрахань

Красивый пример сайта автосервиса с полным функционалом работ.

Сайт услуг — Умный дом

Пример одностраничного интернет магазина по продаже системы Умный дом и комплектующих.

Сайт чугунного завода в г. Чебоксары

Сайт для продажи чугунных печей для бань и саун от завода производителя

Одностраничный сайт для заработка

Одностраничный сайт для заработка на подключении телефонии и интернета

Сайт продаж Лякутюр

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

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

Ещё их называют посадочные страницы, продающие сайты, лендинг (или лендинг пейдж), страница захвата.

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

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

Именно поэтому не стоит бояться экспериментировать. А показанные здесь сайты являются отличным показателем данной системы.

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

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

На сегодняшний день есть уже более 800 примеров одностраничников, которые постоянно приносят новых клиентов нашим пользователям. Если вы считаете, что ваш лендинг пейдж достоин пополнить нашу страницу с примерами, напишите нам об этом на [email protected], и мы рассмотрим предложение.

tobiz.net

54 примера потрясающего дизайна лендингов

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

Электронная коммерция
Развлекательные сайты
Лендинги-портфолио
Розничная торговля
Интернет-проекты
Сфера услуг

Электронная коммерция

1. Luhse Tea

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

2. Fit For A Frame

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

3. Shop Locket

Простой, но симпатичный дизайн. Плюс в том, что можно войти на сайт через Facebook, не тратя время на регистрацию.

4. White Lotus Aromatics

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

5. Evel

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

6. Lega-lega

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

7. Urban Originals

Фишка этого дизайна — простота. Простое меню и яркий слайдер отлично сочетаются.

8. Scotch & Soda

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

9. Гироскутеры от LPgenerator

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

Развлекательные сайты

10. Clouds over cuba

Просто и со вкусом. Сразу ясна цель страницы — просмотр документального видео.

11. Universeries

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

12. Jacqui co

Этот сайт выше всех похвал. Блестяще продуманный дизайн и обилие интерактивных элементов никого не оставят равнодушным.

13. Pottermore

В дизайне этой страницы, посвященной франшизе о Гарри Поттере, использованы знакомые фанатам цвета, фразы и имена.

14. Heath Life

Эта страница не только выглядит красиво, она еще и очень функциональна: множество интерактивных элементов, интеграция с Google Maps, использование вкладок.

15. Uncrate

Uncrate и после редизайна не меняет своей традиции расположения всех разделов сайта в удобном верхнем навигационном меню.

16. The good man

Этот сайт демонстрирует всю мощь графического дизайна и веб-разработки. Лучше зайти на него и самостоятельно убедиться в этом.

17. Silktricky

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

18. Magic Leap

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

19. Life and times

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

20. Yogalife от LPgenerator

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

Лендинги-портфолио

21. Hello monday

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

22. Jib

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

23. Ride for the brand

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

24. Andy Patrick design

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

25. This is the brigade

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

26. Built by buffalo

Пример необычного плиточного дизайна.

27. Galpin

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

28. Made by Vadim

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

29. Art&code

Иконки и ничего лишнего. Хороший пример минималистичного дизайна.

30. Riley Cran

Страница-портфолио отображает самое главное — примеры работ.

Розничная торговля

31. Rei

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

32. Austin beerworks

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

33. Jaquet droz

Ничто не отвлекает посетителя от созерцания прекраснейших часов.

34. Italio kitchen

Изюминка этого сайта — слайдшоу в верхней части страницы, на которой продемонстрированы аппетитные кулинарные шедевры.

35. TV safety

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

36. Grey Goose

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

37. Toyota

Toyota сделала сайт в стиле Pinterest для любителей Camry. Здесь можно найти множество фотографий, статей, статистики.

38. Got Milk?

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

39. Buffalo Wild Wings

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

40. Подушки для беременных от LPgenerator

Дизайн выполнен в спокойных светлых тонах, такое цветовое решение идеально подходит предлагаемому продукту.

Интернет-проекты

41. Chrome Web Lab

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

42. Viddy

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

43. Prezi

Вставка видео на лендинг-пейдж — удачный способ показать ваш товар или услугу в деле.

44. Impress a penguin

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

45. СSS piffle

Плавающая красная кнопка в середине экрана делает свое дело: на нее очень хочется нажать.

46. Fannabee


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

47. Автоматизация ресторана от LPgenerator

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

Сфера услуг

48. Captain Dash

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

49. Woodwork

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

50. Sagmeister walsh

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

51. Madwell NYC

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

52. Ryan Edy

Это страница профессионального фотографа, и ее дизайн помогает нам увидеть самое главное — фотографии. Даже меню спрятано в «гамбургер».

53. Oliver Rassel

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

54. Независимая оценка качества образования от LPgenerator

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

Заключение

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

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

По материалам: hubspot.net  

18-06-2016

lpgenerator.ru

Landing page: ТОП-37 примеров разработки дизайна

Стань автором нашего блога. И зарабатывай на этом

СОДЕРЖАНИЕ

99 ФИШЕК С ПРИМЕРАМИ КОРОТКО О ГЛАВНОМ

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

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

99 фишек с примерами

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

1. Сайт – Dogstudio.com

дизайн лендинга dogstudio Dogstudio.com

Интерактивная смена цветов

Цветовой окрас 3D элементов и фона изменяется с прокручиванием колесика мыши.

дизайн лендинга смена цветов Интерактивная смена цветов

Интерактивный 3D дизайн

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

дизайн лендинга интерактинный дизайн Интерактивный 3D дизайн

2. Сайт – Stuart.com

дизайн лендинга Stuart Stuart.com

Фоновое видео

Для эффективного использования пространства landing page используется видео на фоне вместо изображения. Видео способно быстро поведать пользователю информацию о деятельности компании.

дизайн лендинга фоновое видео Фоновое видео

Бегущие контент-элементы

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

дизайн лендинга бегущие контент элементы Бегущие контент-элементы

Несколько кнопок

Такая уловка, как две кнопки с целевым действием на одном экране, способна значительно повысить конверсию. В данном случае эта возможность реализована тремя кнопками “Get started”, “Get in touch” и “Request a delivery”.

дизайн лендинга несколько кнопокНесколько кнопок

Расширенная форма

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

дизайн лендинга расширенная формаРасширенная форма

Счетчик цифр (прямого отсчета)

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

дизайн лендинга счетчик цифр Счетчик цифр (прямого отсчета)

Линейный слайдер

Представляет собой слайд при перелистывании которого переход происходит от одной точки линейки к следующей.

дизайн лендинга линейный слайдерЛинейный слайдер

Слайд-шоу из фото и описаний

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

дизайн лендинга слайд шоу из фото и описанийСлайд-шоу из фото и описаний

Проявление элементов с определенной частотой

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

дизайн лендинга проявление элементов с определенной частотойПроявление элементов с определенной частотой

Интерактивная карта

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

дизайн лендинга интерактивная картаИнтерактивная карта

Фокусировка на выбранной области

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

дизайн лендинга фокусировка на выбранной областиФокусировка на выбранной области

3. Сайт – Lastdaysofivory.com

дизайн лендинга Lastdaysofivory Lastdaysofivory.com

Мультипликация

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

дизайн лендинга мультипликацияМультипликация

4. Сайт – Siftnewstherapy.com

дизайн лендинга Siftnewstherapy Siftnewstherapy.com

Анимированные иллюстрации

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

дизайн лендинга анимированные иллюстрацииАнимированные иллюстрации

Пошаговая двухсторонняя лента с интерактивными элементами

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

дизайн лендинга пошаговая двухсторонняя лента с интерактивными элементами Пошаговая двухсторонняя лента с интерактивными элементами

Меняющееся расположение элементов

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

дизайн лендинга меняющееся расположение элементовМеняющееся расположение элементов

5. Сайт – Craftcms.com

дизайн лендинга Craftcms Craftcms.com

Авторские иллюстрации

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

дизайн лендинга авторские иллюстрацииАвторские иллюстрации

Лента вращается путем перетаскивания мыши

Интересный эффект – горизонтальная лента из превью примеров работ прокручивается перетаскиванием мыши, а не прокручиванием ее колесика.

дизайн лендинга лента вращается путем перетаскивания мышиЛента вращается путем перетаскивания мыши

Плавающие элементы

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

дизайн лендинга плавающие элементы Плавающие элементы

Падающая тень и имитация глубины

Благодаря падающим теням имитируется глубина и нахождение иконок как-бы над остальным контентом.

дизайн лендинга падающая тень и имитация глубины Падающая тень и имитация глубины

6. Сайт – Leafshave.com

дизайн лендинга Leafshave Leafshave.com

Трехмерная графика

3D графика становится все более популярной. Этот элемент дизайна заставляет посетителей дольше оставаться на сайте и детальней его изучать.

дизайн лендинга трехмерная графикаТрехмерная графика

Отображение контента в зависимости от точки клика

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

дизайн лендинга отображение контента в зависимости от точки клика Отображение контента в зависимости от точки клика

3D анимация в 2D дизайне

В настоящем в тренде находятся соединения 3D и 2D графики. В данном случае 3D анимация реализована в 2D дизайне.

дизайн лендинга 3D анимация в 2D дизайне D анимация в 2D дизайне

7. Сайт – Happy.tools

дизайн лендинга Happy tools Happy.tools

Видео во всплывающем окне

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

дизайн лендинга видео во всплывающем окне Видео во всплывающем окне

Удобная форма

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

дизайн лендинга удобная формаУдобная форма

8. Сайт – Rewind.youtube

дизайн лендинга Rewind youtube Rewind.youtube

Hover-эффект при наведении курсора

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

дизайн лендинга Hover эффект при наведении курсораHover эффект при наведении курсора

Смена слайдов при прокручивании колесика мыши

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

дизайн лендинга смена слайдов при прокручивании колесика мышиСмена слайдов при прокручивании колесика мыши

9. Сайт – Amberbridge.ru

in-scale.ru

лучшие примеры [и критический разбор]

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

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

Что же делает дизайн посадочной страницы эффективным?

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

  • Изложение преимуществ должно быть ясным и кратким, чтобы посетители сразу же понимали назначение страницы. Именно по такому принципу построены лучшие продающие одностраничные сайты.
  • Страница должна выражать одну-единственную идею с одним главным призывом к действию (Call to action, СТА).
  • При создании макета посадочной страницы используйте приемы дизайна для выделения своего СТА (пустое пространство, цвет, контраст, направляющие сигналы).
  • При использовании форм для сбора данных старайтесь сбалансировать объем запрошенной информации и ценность предложения, получаемого взамен (отчет, «белая книга» и т.п.)
  • Используйте модальные диалоговые окна для выведения вспомогательной информации (условия, политика конфиденциальности, подробная информация о товаре) вместо перенаправления посетителей на другие страницы (что заставит их свернуть с намеченного вами пути конверсии).

Итак, приступаем к разбору примеров действительно хороших посадочных страниц для E-commerce, мобильных продуктов и услуг, финансовых продуктов и страхования, офлайн-услуг, B2B, спецпроектов, анонсов мероприятий, HR-лендингов и вирусных landing pages.

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

Содержание

E-commerce

Влюбиться в продукт по фото

Крутой баннер с рисованными продуктами

О сервисе за 27 секунд

Крутая анимация первого экрана

Милые (как котики) тексты

Теплый ламповый сайт

Мобильные продукты и услуги

Отвечает на вопросы

Забавная графика

Регистрация в 2 строчки

Начать без регистрации

Проще некуда

Все самое главное в одном экране

Финансовые продукты и страхование

Просто о сложном продукте

Люди. Люди. Люди.

Продать страховку в два экрана

Офлайн-услуги

Call to Action с размахом

Продать любой ценой

Связь

Просто как в интернет-магазине

Экспериментальный минимализм

Спецпроекты

Красивое путешествие

Виральный контент для сложной тематики

Сайты B2B

Кнопка на каждом экране

Легкий дизайн посадочной страницы для сложного сервиса

Веселые картинки для B2B

Анонсы мероприятий и курсов

Точечная анимация и живые отзывы

Сначала история — потом продажи

Поиграли со шрифтами

Лендинг как авангардное искусство

Новый модный русский дизайн

HR-лендинги

Определение ЦА

Страница одного удачного элемента

Хайповые лендинги

Мемы и шуточки для своих

Шутки шутками — но не забываем про продукт

Образцово-показательный лендинг

Дочитали до конца? Круто!

Плюсы хороших лендингов

Минусы ну таких лендингов


E-commerce

Влюбиться в продукт по фото

kitchenceremony.com

Плюсы. В первую очередь — очень аппетитные картинки с налетом luxury. Большая привлекательная фотография на весь первый экран. Аккуратное и понятное меню над ней. Динамика при проскролле в следующем экране.

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

Крутой баннер с рисованными продуктами

ji-fruits.ru

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

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

Удачная иллюстрация процесса заказа — переписка в мессенджере:

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

О сервисе за 27 секунд

partiyaedi.ru

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

Милые уникальные картинки — всегда хорошо:

Очень привлекательные фото готовых блюд и понятно организованное меню (выбор набора «премиум», «фитнес» и т. д.)

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

Крутая анимация первого экрана

satellite-express.ru

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

Все продукты (их четыре) расположены на втором экране:

Процесс использования глюкометра наглядно показан в картинках, выполненных в стилистике сайта:

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

Милые (как котики) тексты

www.kotofabrika.com

Плюсы. Этот сайт выделяется отличным копирайтингом. И если он покажется излишне «ми-ми-ми», то стоит вспомнить, кто является ЦА производителя. А это хозяева котиков, которые покупают для них домики. Достаточно ми-ми-ми?

Нестандартно подписанный блок для связи с консультантом (а ведь на 99% сайтов они абсолютно шаблонные, хотя кастомизировать их совсем не сложно):

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

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

Теплый ламповый сайт

oknaludyam.ru

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

Во втором окне сразу видим кнопку «Рассчитать стоимость» (обратная связь).

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

Можно улучшить: возможно, это была часть задумки «сделано на коленке», но кнопки (шрифт) выглядят не очень удачно (см. «Рассчитать стоимость» выше). Их можно оформить в стилистике сайта (рисунок ручкой), либо сделать максимально нейтральными.

Карта и Васька прекрасны

Еще один минус — текст кнопки «Рассчитать стоимость окон» не оправдывает ожиданий — вместо калькулятора открывается стандартная форма обратной связи.

Инструменты PromoPult для рекламы в соцсетях: все каналы в одном кабинете, минимальные бюджеты, все делают штатные специалисты системы, вам нужно только дать вводные.

Мобильные продукты и услуги

Отвечает на вопросы

lite.youdrive.today

Плюсы. Видео в первом экране привлекает внимание и отлично «продает эмоцию»: электросамокат — это быстро, стильно, радостно, динамично.

Кнопки приложений для Android и iOS — сразу под видео:

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

Что можно улучшить: поскольку это лендинг для приложения, имело бы смысл разместить ссылки на Google Play и AppStore на странице несколько раз, а не один.

Забавная графика

molodost.bz/fact/

Плюсы. Основной плюс — интересный подход к визуализации пути к цели. Стильные анимированные иллюстрации с умеренной иронией.

И вот такой баннер на третьем экране:

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

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

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

Ну и маленькое примечание: стоит следить за скидками. Скидка с 12 900 до 12 990 — так себе бонус.

Регистрация в 2 строчки

lingualeo.com

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

Дизайнеры последовательно используют символ продукта — львенка — на всей странице:

Можно улучшить: стоит присмотреться к блоку с ценами. Из плюсов — наиболее выгодное для продавца предложение расположено посередине и выделено цветом, это хороший прием для «продажи» выгодной цены. А вот скидку хотелось бы показать более привлекательно (вынести стоимость со скидкой выше, дополнительно выделить цветом, зачеркнуть полную цену и т. д.).

Начать без регистрации

www.duolingo.com

Плюсы. Еще один сервис для изучения языков — но здесь первый экран еще круче!

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

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

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

Проще некуда

https://www.strava.com/

Плюсы. 100% прямолинейность и простота.

Можно улучшить: 0% для улучшения. Можно включать в список лучших лендингов мира в категории минимализм.

Все самое главное в одном экране

ru.bookmate.com

Плюсы. Скидка крупно на первом экране. Здесь же — все нужные кнопки («Получить подписку», «Войти», «Магазины приложений») и краткая формулировка сути сервиса. Все по делу.

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

Можно улучшить: call to action (CTA, призыв к действию) остается в хедере сайта при прокрутке, но, возможно, стоит поэкспериментировать с его размерами и/или добавить кнопки подписки после отдельных блоков.

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

Финансовые продукты и страхование

Просто о сложном продукте

rocketbank.ru

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

Описание тарифов — компактно и наглядно:

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

Люди. Люди. Люди.

www.mtsbank.ru/malomu-biznesu

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

Скучный банковский продукт максимально очеловечен. И не только в рамках верхнего баннера (это уже привычный прием). В каждом информационном блоке — живая фотография с эмоцией. На этом фоне тем более ярко выделяется изображение кассы (да еще и с пометкой «Акция»).

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

Можно улучшить: мало call-to-action элементов. Возможно, кнопку «Открыть счет» следовало бы разместить не только в верхнем баннере, но и в середине и конце лендинга и сделать ее более очевидной. Также не хватает формы обратной связи/онлайн консультанта или номера телефона в видимой части экрана (телефон можно найти только рядом с навигацией в футере сайта, и это общий колл-центр банка, без привязки к продукту).

Продать страховку в два экрана

www.tinkoffinsurance.ru/autoinsurance

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

И затем — схема из трех шагов:

Два экрана — три СТА (call to action) (Купить полис — Рассчитайте страховку — Позвоните мне). Все максимально лаконично, белый фон, черный шрифт, один цвет для расстановки акцентов, много воздуха, минимум слов, прямолинейный текст на кнопках.

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

Как настраивать контекст на профессиональном уровне — без агентства? В модуле контекстной рекламы PromoPult — автоматический подбор слов, автоматическая генерация объявлений, «умное» управление ставками. Готовые отраслевые решения. Статистика в реальном времени. Для профессионалов — множество точных настроек.

Офлайн-услуги

Call to Action с размахом

moscowfreetour.ru

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

Шапка сайта перемещается при проскролле, так что навигационная панель и номер телефона (!) всегда доступны.

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

А еще это лендинг, который можно включать в списки сайтов с самым большим количеством повторений CTA. При этом текст кнопок очень разнообразный: «Хочу на бесплатную экскурсию», «Задать вопрос», «Посмотреть экскурсии», «Записаться прямо сейчас», «Участвовать в акции», «Записаться на бесплатную экскурсию». Список можно продолжать.

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

Продать любой ценой

qlean.ru

Плюсы. Эта страница создана, чтобы продавать. Дизайн полностью сосредоточен на конверсии. Зайдя на сайт, вы сразу видите специальное предложение со скидкой, которой необходимо воспользоваться в течение 15 минут — запущен обратный отсчет.

Предложение «Рассчитать стоимость» и напоминание о скидке остается с вами при прокрутке:

Цены в блоке с расценками отображаются сразу с 30% скидкой:

… и прежде чем уйти, вы увидите финальное предложение о заказе уборки)

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

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

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

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

Запускаете рекламу в системе PromoPult? Не уверены, что все делаете правильно? Хотите сделать лучше, но не знаете как? Обращайтесь за помощью к профессионалам системы. Ваш персональный менеджер в системе PromoPult.

Связь

Просто как в интернет-магазине

moskva.mts.ru/personal/mobilnaya-svyaz/mobilniy-internet/podklyuchit

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

Максимально просто и понятно оформлен блок допродажи:

Обратите внимание, USSD запросы для подключения дополнительного трафика не спрятаны в «Подробнее», а сразу видны в основном блоке. Быстрые ответы на вопросы: «что я получу», «сколько это будет стоить», «как мне это сделать».

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

Экспериментальный минимализм

www.yota.ru/#/promo

Плюсы. Очень необычный лендинг. Один экран, все что мы видим — 4 ссылки слева и большой голубой баннер справа из трех слайдов: «Реклама интернета для планшета» — «Реклама скидки 50% за привязку карты» — «Реклама Wi-Fi роутера для YOTA». Вот такой смелый минимализм и постмодернизм в действии.

Можно улучшить: не надо ничего улучшать. Идеальный экспериментальный лендинг.

www.cossa.ru

«Убойные» посадочные страницы: три примера эффективных лэндингов

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

Посадочные страницы: определение, критерии эффективности

Посадочной называется целевая страница, вовлекающая в конверсионный сценарий посетителей вашего сайта, приходящих из поисковых систем, с рекламных объявлений и других источников трафика. Иногда специалисты называют эти страницы лэндингами (от англ. landing page).

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

  • Наличие подчеркнутого призыва или приглашения посетителя к действию. Хороший лэндинг четко побуждает потенциального клиента к совершению одного действия, например, к подписке на рассылку или к регистрации на сайте.
  • Соответствие информации на посадочной странице обещанию, данному посетителю вне вашего сайта. Например, если сниппет поисковой выдачи или текст рекламного объявления сообщает клиенту о возможности подписаться на бесплатные видеоуроки, лэндинг должен предоставить ему такую возможность.
  • Простота дизайна и неперегруженность информацией. «Приземлившись» на страницу, потенциальный клиент не должен отвлекаться от конверсионного действия рюшками в шапке сайта или длинными рассуждениями о качестве продукта.
  • Корректное использование фотографий. Картинки улучшают визуальное восприятие лэндинга. Но соблюдайте меру — вы ведь не хотите, чтобы клиент забыл добавить товар в корзину, погрузившись в изучение фото.
  • Использование силы брендов. Изображения надкушенного яблока или зеленого дроида добавят посетителям вашего сайта уверенности в качестве соответствующего продукта.
  • Возможность быстро поделиться информацией в социальных сетях. Всегда добавляйте на посадочные страницы кнопки шеринга Facebook, Twitter, «Вконтакте» и других сетевых ресурсов.
  • Постоянное совершенствование. Хороший лэндинг не бывает статичным. Мы, например, перманентно тестируем целевые страницы, изменяем их в соответствии с поведением пользователей, дорабатываем и улучшаем.

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

Три примера «убойных» посадочных страниц

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

Посадочная страница компании Content Rules

Американский разработчик контента Content Rules создал эффективную посадочную страницу для распространения своей электронной книги.

Пример посадочной страницы. Минимализм нынче в моде.

Что компания Content Rules сделала правильно:

Лэндинг выглядит приятно и просто. Заголовок привлекает внимание посетителя к конверсионному действию (Загрузите книгу бесплатно прямо сейчас — это приблизительный перевод хедлайна).

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

Логотип Content Rules повышает уверенность посетителя в качестве продукта.

Что можно усовершенствовать:

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

  • Социальный шеринг

Кнопки популярных социальных сетей повысят эффективность лэндинга Content Rules.

Лендинг компании по недвижимости ALM Real Estate Media Group

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

Посадочная страница - ничего лишнего.

Что компания ALM сделала правильно:

  • Возможность регистрации через Facebook

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

Что можно усовершенствовать:

Эта посадочная страница содержит слишком много текста, который отвлекает посетителей от формы регистрации.

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

Лэндинг Windows Intune

Корпорация Microsoft использует посадочную страницу для распространения 30-дневной пробной версии облачного сервиса Windows Intune.

Посадочная страница: описание продукта, преимущества, переход на установку пробной версии.

Что компания Microsoft сделала правильно:

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

  • Четкий призыв к действию и фокусировка на преимуществах продукта

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

Использование логотипа Windows повышает доверие аудитории к продукту.

Что можно улучшить:

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

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

Заключение

Итак, вы познакомились с тремя примерами хороших лэндингов. Обратите внимание, каждый из них может стать еще лучше после тестирования и оптимизации. Воспользовавшись опытом компаний Content Rules, ALM и Microsoft, вы точно создадите несколько шедевральных посадочных страниц. Только обязательно расскажите об этом в комментариях!

Адаптация материала Эреза Барака Killer Landing Pages: 3 Examples of Landing Pages that Convert.

Еще несколько полезных материалов по лэндингам:

uboynye-posadochnye-stranitsy-tri-primera-effektivnykh-lendingov

texterra.ru

Что такое лендинг пейдж и какие виды и типы landing page существуют

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

Термин “лендинг” произошел от английского слова “Landing”, которое обозначает “приземление”. В этом термине отражён основной смысл – лендинг это приземляющая (посадочная) страница.

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

Существует 4 основных возможности, где размещается лендинг:

  1. На отдельном домене: domain.ru;
  2. На вашем поддомене: landing.domain.ru;
  3. Страница сайта: domain.ru/landing.html;
  4. На стороннем сервисе: service.ru/yourlanding или yourlanding.service.ru.

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

Разновидности продающих страниц

Все лендинги разделяются на три большие группы:

  • Микросайты;
  • Отдельные страницы сайта в виде лендингов;
  • Полноценные лендинги;

Также лендинги разделяются на несколько категорий по задачам:

  1. Продающие;
  2. Подписные;
  3. Информационные;
  4. Вирусные;
  5. Дифференциальные;
  6. Другие.

Микросайты

Микросайты, или по другому “сайты-визитки” – это сайты с небольшим количеством страниц (обычно до 10), где главная страница является своего-рода лендингом, а вспомогательные страницы созданы для того, чтобы пользователь смог лучше разобраться в товаре или услуге.

Рассмотрим такой микросайт на примере сайта отеля — https://fenixhotel.ru/.

Микро-сайты

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

Помимо главной на сайте есть и другие страницы:

  • Примеры построенных домов;
  • Типовые проекты;
  • Технология строительства;
  • Другие.

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

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

Отдельные страницы сайтов

Лендингом может выступать и отдельная страница на вашем сайте, например, – https://nethouse.ru/internet-magazin или https://moi-biser.nethouse.ru/czechbiser.

Отдельные страницы сайтов

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

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

Полноценные лендинги

Полноценные лендинги – это одностраничные сайты, построенные по принципу: “действуй или уходи”.

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

Высокая конверсионность – это ключевое преимущество лендингов. Почему так получается? Дело в психологии. Правильные лендинги захватывают внимание посетителя (четкая структура, красивая графика), убеждают его в правильности выбора (акцент на преимуществах продукта) и в результате приводят к блоку призыва к действию (Call To Action) – всё это буквально заставляет человека совершить то действие, которое нужно вам.

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

Типы лендингов и их предназначение

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

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

Продающий лендинг

Целью такого лендинга, как следует из названия, является продажа товара или услуги. Часто для привлечения трафика используются платные методы – контекстная реклама, тизеры и т.д. Вы могли видеть такие лендинги, когда была мода на продажу игрушки «говорящий хомяк».  Пример продающего лендинга – https://nabor-noskov.ru или http://www.maxitrip.ru/.

Продающий лендинг

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

Подписной лендинг

Если ваши продажи в оффлайне, или ваш тип бизнеса не предполагает импульсивной покупки, то продающий лендинг вам не подойдет. В этом случае лучше работают лендинги для рассылок, которые часто называют подписными продающими страницами. Пример подписного лендинга с высокой конверсией: https://www.unisender.com/ru/about/bonusy/correct-email/.

Подписной лендинг

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

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

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

Информационный лендинг

Информационный landing page создается для подогрева интереса к новому продукту компании или к особому событию, которое случится в обозримом будущем. Целью  информационного лендинга является последующий переход посетителя на основной сайт, или добавление определенной даты в календарь пользователя. Хороший пример информационного лендинга: https://www.coca-cola.ru/product.

Информационный лендинг

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

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

Вирусный лендинг

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

Примеры вирусных лендинг пейдж с высокой конверсией:

Вирусный лендинг

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

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

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

Дифференциальные лендинги

В большинстве случаев, такой тип посадочной страницы используется интернет-магазинами и включает в себя сочетание почти всех вышеперечисленных типов лендингов. Пример такого лендинга – https://www.mvideo.ru/promo/predator-50.

Дифференциальные лендинги

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

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

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

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

Какой тип лендинга лучший?

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

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

blog.travelpayouts.com

13 небанальных идей для крутого лендинга

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

Текстовые и визуальные лайфхаки

Обращайтесь напрямую к клиенту

Речь идет не о банальном «Здравствуйте, мы компания Х и работаем на рынке с бородатого года». Это скучно и никого не цепляет. А вот парень из подмосковного Солнечногорска сделал удачный оффер и вынес контактную информацию в начало лендинга. Никаких заумных фраз и козыряния многолетним опытом. Человек обращается к читателям точно так же, как общался бы с ними «вживую».

Обращайтесь напрямую к клиенту

Обыграйте название продукта или услуги в тексте лендинга

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

Обыграйте название продукта или услуги в тексте лендинга

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

Внедряйте символику и отсылки

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

Внедряйте символику и отсылки Как оформлять тексты для сайта, чтобы их читали

Чувственная подача инфы на грани фола

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

Чувственная подача инфы на грани фола

Подайте информацию в формате квеста

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

Подайте информацию в формате квеста

Поиграйте со шрифтами

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

Поиграйте со шрифтами

Придумайте креативный футер

Весь лендинг «Котофабрики» пестрит креативом, но их футер просто огонь. Ребята беззлобно простебались над стереотипными блоками о гарантиях (в самом деле, кто читает те мелкие тексты?) и сделали убедительное предложение.

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

Задействуйте юмор

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

Задействуйте юмор

Технические лайфхаки

Анимация при скролле

Создатели лендинга-презентации iPhone X использовали технологию Canvas, позволяющую рисовать прямо на странице. Готовых плагинов под нее нет, вся эта красота реализуется через JavaScript.

Анимация при скролле

Видео во всплывающем окне

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

Видео во всплывающем окне

Интегрированные в лендинг инвойсы

Веб-сервис управленческого учета «Финолог» предлагает удобный и лаконичный счет на оплату, с заполнением которого разберется любой. Сделать подобное можно любым хорошим плагином для создания форм: Contact Form 7, JS Forms или через онлайн-сервис JBCallme.

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

Прелоадер (анимация при загрузке лендинга)

Яркий пример такого решения – посадочная страница компании Piratecode. Анимация при загрузке реализуется через JavaScript или через плагин Preloader.

Прелоадер (анимация при загрузке лендинга)

Визуальный конструктор товара в лендинге

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

Визуальный конструктор товара в лендинге

Итак, что в итоге:

  • Не бойтесь креативить. Лендинг – это не операция на сердце, его всегда можно исправить. Пробуйте разные варианты, оценивайте конверсию посредством А\Б-тестирования.
  • Вдохновляйтесь идеями конкурентов. Вдохновляться ≠ плагиатить. Любую идею можно переработать, улучшить и дополнить.
  • Познакомьтесь с возможностями разных плагинов и задействуйте их в работе.

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

10 вещей, без которых лендинг не продает kak-sdelat-krutoy-lending-nebanalnye-idei

texterra.ru

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *