Топ-10 landing page сегмента fashion
В жестоком мире моды любят исключительно глазами. В этой статье мы собрали 10 лендингов в стиле fashion с самой интересной и красивой визуальной подачей контента, со всех уголков света.
Прекрасно выполненный сайт, посвященный Неделе моды в Нью-Йорке — одной из 4 главных недель моды в мире.
Представляет собой бесчисленное множество виртуальных аккаунтов моделей и деятелей мира моды, собранных в одном месте. Лендинг позволяет интерактивно, без цензуры взглянуть на события Нью-Йоркской Недели моды глазами ее участников. Каждое из черно-белых фото становится цветным при наведении мышью и открывает доступ к профилям владельца в популярных соцсетях: Facebook, Twitter, Pinterest, Tumblr, Instagram. По ним хорошо видно, что ведущая роль в западном SMM отведена Твиттеру.
Здесь нет привычных кнопок или форм, но есть хештег для расшаривания и отслеживания, а также довольно необычный призыв к действию: «Stalk us» («преследуй нас», «крадись за нами»). То ли из-за бесконечной прокрутки, то ли из-за большой насыщенности, сайт заметно грузит браузеры и «притормаживает». В целом же современный, стильный монохромный лендинг FacesofNYFW является примером хорошей реализации удачной идеи.
23 примера эффективных (не обязательно модных) посадочных страниц
2. Fluttuo — единственные в своем роде
Эффектный одностраничник для бренда дизайнерских украшений, каждое из которых выпускается исключительно в единственном экземпляре.
Целевая страница Fluttuo хорошо передает чувство собственного стиля и содержит интересное коммерческое предложение. Структура достаточно стандартная, а вот в визуальном оформлении кроется несколько интересных нюансов.
Первое, что бросается в глаза с первого разворота — необычная диагональная разбивка экранов. Всего их 7, на каждом есть СТА-элементы, половина снабжена автоматическими слайдерами. В левой части страницы есть навигационные кнопки, под которыми расположена простая и заметная иконка корзины.
Второй разворот занимает видео-презентация, а последующие три отведены коллекциям. Далее — блок с философией бренда и, наконец, короткая открытая форма захвата с одним из самых лучших УТП в этой нише. Пользователям предлагают не просто оформить подписку, а внести себя в VIP список, чтобы получать выгодные предложения.
Заманчиво, правда? Даже есть пример письма, чтобы знать, чего ждать от рассылки.
Сайт использует сдержанную цветовую палитру, HTML5, плавную прокрутку и параллакс-эффекты. Он искусно удовлетворяет желание современных женщин чувствовать себя уникальными и неповторимыми.
Креативные примеры параллакс скроллинга
3. Итальянский шик Valentina Gallo
Красивый лендинг обувного бренда, все изделия которого производятся вручную и только в Италии.
Главной «фишкой» этого одностраничника стал оригинальный скроллинг. Экран разбивается вертикально на левую и правую части. Левая при прокрутке мышью или клавиатурой плавно движется снизу-вверх, правая — сверху-вниз. Совмещаясь друг с другом, они образуют каждый последующий разворот.
Черно-белый дизайн, редкие красные акценты, изящная типографика — все это красноречиво передает артистичность и художественный вкус владелицы бренда. К концу страницы монохромность неожиданно сменяется яркими цветными фото, что смотрится выгодно и придает лендингу еще больше характера.
Целая треть всей страницы отведена различным социальным контактам.
4. Альбом памяти Оilily
Яркий и красочный одностраничник, созданный в честь 50-летия голландского дома моды Oilily.
Милый, пестрый, красочный лендинг, похожий на дневник друзей маленькой девочки или детский альбом для наклеивания вырезок. Разработчики постарались и создали настоящий интернет-музей памяти голландского бренда. Интересно, что они дали пользователям возможность выбора прокрутки вверх или вниз — для просмотра содержания от старого к новому, либо наоборот.
Прокрутка плавная, текста совсем мало, зато много сочных изображений и анимации, большая часть которых оказывается кликабельной и выдает дополнительную информацию при нажатии. Сайт очень насыщенный и при этом хорошо оптимизирован.
Правую часть сайта занимает большая красная панель навигации — она тоже интерактивная и оформлена красиво. Отдельного внимания заслуживает огромный фотоальбом, в который можно добавить фото собственных детей в их любимой одежде от Oilily.
Просмотр лендинга Oilily вызывает исключительно приятные эмоции и запоминается надолго.
4 вида анимации для улучшения юзабилити лендинга
5. Роскошные подарки Georg Jensen
Уникальный в своем роде лендинг для известного датского бренда Georg Jensen.
Это целая интерактивная видео-экскурсия на гламурную вечеринку сливок общества, которые дарят друг другу роскошные дорогостоящие подарки. Заканчивается она автоматическим переходом в магазин. По мере продвижения нам предлагают выбрать один из двух вариантов подарка, сцена дарения которого затем обыгрывается в видео.
Страница с головой окунает в атмосферу праздничности, элитарности, утонченного вкуса, не оставляя никаких сомнений в своем позиционировании и целевой аудитории. Любой из выбранных предметов можно детальнее изучить в магазине или прямо при просмотре видео. Потрясающий, наглядный пример интерактивного сайта.
Интерактивные лендинги: повышаем конверсию и качество лидов. Часть 1
6. Швейцарская утонченность Jaquet Droz
Страница, презентующая оригинальные модели часов «Bird Repeater» швейцарского часовщика Jaquet Droz.
Потрясающая визуальная подача продукта на одной странице, захватывающая и изящная. Здесь активно используются параллакс-скроллинг, видеовставки, плавная анимация и интерактивные элементы, вроде ползунка на экране технической информации, обнажающего шестеренки внутреннего механизма часов. Обязательно посмотрите великолепную видео презентацию.
Навигация очень удобная, скроллить можно с помощью клавиатуры, колесиком мыши, либо навигационными кнопками в правой части экрана. Единственное, что может испортить впечатление от просмотра — ужасные шрифты для русской версии сайта. Но это, к сожалению, достаточно распространенная проблема.
Интерактивные лендинги: повышаем конверсию и качество лидов. Часть 2
Ошеломляющая и эмоциональная целевая страница коллекции оптики ручной работы от известного австрийского бренда.
Стильный лендинг в серебристо-белых тонах с большими, невероятно четкими и живыми изображениями. Мощная демонстрация продукта: очень необычно, что очки остаются в том же положении на экране при переключении между двумя фотографиями — самого продукта и на модели.
Красивый Lookbook, грамотное использование визуальных эффектов и SVG-анимации выгодно выделяет этот лендинг среди других. Например, радует глаз плавное перетекание изображения первого экрана в белый фон при прокрутке. Что интересно, краткая информация о модельном ряде оптики подается сразу на двух языках: английском и немецком.
В самом конце страницы нас ждет небольшой 10-секундный тизер.
Видеомаркетинг от luxury-брендов одежды: в России и за рубежом
Элегантный лендинг известного питерского парикмахера Юлии Художниковой.
Великолепный подбор образов для авторской школы парикмахерского искусства. На первом развороте использован анимированный эффект плавной прокрутки, дополнительная информация о 4-х курсах подается в PopUp-ах справа, а если навести курсор на моделей, то их изображения будут медленно и плавно увеличиваться.
Для каждого курса расписано содержание уроков и приведены примеры стрижек. На странице также приводятся доказательства того, что студенты принимают участие в показах мод по ходу обучения.
В целом сайт сделан очень грамотно и профессионально как в плане дизайна, так и с коммерческой точки зрения. Здесь есть:
- фото основательницы,
- фото ее лучших работ,
- фото сотрудниц,
- фото, примеры работ и отзывы выпускников,
- фото аудитории, где проводятся занятия,
- видео участия в показах мод.
Зарегистрироваться на курсы можно либо заполнив короткую форму регистрации, либо просто позвонив по телефону, что для целевой аудитории оказалось более удобным.
Экспериментальный лендинг, дающий ответ на самый главный вопрос: «Что одеть?!»
«Умная» целевая страница на 1 разворот, которая выдает варианты гардероба на 2 дня вперед, основываясь на метеорологических прогнозах и полученной о пользователе информации: половой принадлежности и текущему географическому положению.
Незаменимый помощник для тех, кто часто попадает впросак, пытаясь одеться по погоде самостоятельно.
Конечно же, вся соль страницы в том, что предлагаемые предметы гардероба можно подобрать по вкусу и приобрести с быстрой доставкой в многочисленных онлайн-бутиках партнеров. В левом нижнем углу рядом с кнопками соцсетей есть возможность установить Dress By Weather как расширение для Google Chrome.
39 примеров оригинального дизайна лендингов
10. Тенденции Кануна дня всех святых
Google теперь не даст вам ошибиться в выборе костюма на Хеллоуин!
Красивейший экспериментальный лендинг от Google Trends с удивительными визуальными эффектами и анимацией, а также потрясающей скоростью поиска. Любителей эстетики фильмов ужасов обязательно умилят такие мелочи, как дым на заднем плане, капающая зеленая слизь, реагирующая на курсор паутина и бегающие по экрану пауки. Чего стоит неописуемой красоты карта на странице локальных трендов!
С помощью этой страницы можно узнать, костюмы каких персонажей вы будете встречать чаще других в ваших широтах, или проследить за популярностью любимого героя. Например, после выхода Отряда Самоубийц 2016 года королевой хит-парада в США стала Харли Квинн.
Благодаря статистике Frightgeist теперь вы точно знаете, что делать, если хотите оставаться в тренде. И наоборот, если боитесь встретить злого двойника, то смело наряжайтесь Джессикой Рэббит. Помните: мир моды суров и беспощаден!
Выводы
В fashion любят глазами, и лендингу в этой нише нужна мощная визуальная подача. Дизайн страницы должен быть узнаваемым, как стиль бренда. Его лучше делать чистым с минимумом текста. Акции вроде 50% скидок работают только в масс-маркете, а не для именитых брендов. Цель лендингов в сегменте fashion, как правило — захватить контакты для емейл-рассылки, купить вещи сразу со страницы (если небольшая коллекция) или привлечь внимание к многостраничному сайту.
Нужен уникальный дизайн лендинга? Тогда заполните форму заказа или используйте наш конструктор, чтобы создать посадочную страницу самостоятельно.
Высоких вам конверсий!
21-09-2016
19 креативных идей для лендинга и когда их использовать
Вам не хватает креативных идей для лендингов? Каждый раз вы создаете страницы в одном и том же устаревшем стиле, который не дает вашему бизнесу выдержать конкуренцию? Не знаете, какой контент использовать и когда?
В этой статье мы собрали 19 идей, чтобы помочь вам сделать каждый лендинг более интересным и убедительным. Неважно, короткая ли у вас страница захвата на 50 слов, чтобы собирать информацию о потенциальных клиентах, или длинный лендинг из 5 экранов — чем больше эффективных инструментов в вашем арсенале, тем полезнее вы можете быть для своей аудитории.
Конечно, основы одинаковы для всех страниц: заголовок, призыв к действию, УТП. Но большинство лендингов требуют больше контента и тщательно продуманный дизайн, чтобы посетитель понимал суть вашего оффера, не сомневался в преимуществах сотрудничества с вами и в конце концов предпринимал целевое действие.
Довольно сложная задача для одной страницы, но это возможно. Вам просто нужно использовать правильные элементы в той последовательности, которая будет направлять вашу аудиторию к конверсии.
Контент на лендинге ведет пользователя к конверсии как хорошая книга или фильм — к развязке: важно суметь удержать в
Твитнуть цитату:Какой контент и как много вы будете использовать на своем лендинге, зависит от вашей аудитории и цели страницы.
Длинный мультимедийный контент может понадобиться, если:
- Аудитория еще не знает вас. Если ваш лендинг получает трафик от рекламы, потенциальные клиенты (или новые посетители) могут столкнуться с вашим брендом впервые. Они не имеют ни малейшего представления, кто вы и почему им следует доверять вам. Если вы не опишите свое предложение так, чтобы завоевать их доверие, они вряд ли предпримут какие-либо действия.
- Ваша рекламная платформа требует этого. Рекламные платформы, такие как Google AdWords и Facebook Ads хотят, чтобы вы добились успеха. (Что имеет смысл, потому что вы будете продолжать покупать у них рекламу в будущем). Поэтому большинство рекламных платформ имеют стандарты качества, которым должны соответствовать лендинги, и для них может потребоваться определенное количество и качество контента. Например, AdWords может отклонить вашу страницу из-за «бесполезности», если Google обнаружит, что у вас недостаточно контента, чтобы посетители могли оценить выгодность предложения.
- Ваши посетители — не импульсивные покупатели. Даже подписка за бесплатный файл или регистрация на бесплатное мероприятие требует определенного уровня решимости. В конце концов люди тратят свое время и доверяют вам, оставляя адреса электронной почты. Следовательно, вам нужно заслужить их доверие и обосновать то, что вы просите их сделать.
- У ваших посетителей разные предпочтения. У всех людей разные привычки поведения в интернете. Некоторые с радостью изучают подробную информацию, а другие предпочитают смотреть видео-инструкцию в ускоренном режиме. Знать свою аудиторию — значит использовать на своем лендинге такой контент, который убедит людей действовать.
Когда мы говорим о «контенте», мы имеем в виду «информация+формат». Очевидно, что качество (ценность) этой информации и ее формат могут меняться, поэтому возможности практически безграничны.
Рассмотрим 19 идей форматов, которые информация может принимать на вашем лендинге. Параллельно разберем виды контента, подходящего для вашей целевой аудитории.
Содержание статьи
1. Буллеты
2. Нумерованные списки
3. Раздел «Как это работает»
4. Рекламное письмо
5. Видео от первого лица
6. Быстрый тест
7. Мини-блог
8. Раздел «Наша история»
9. Сравнительная таблица
10. Награды
11. Отзывы
12. Пользовательский контент
13. Фотографии сотрудников
14. Интерактивный контент
15. Фотогалерея
16. Набор иконок
17. Иллюстрации и схемы
18. Расписание и планы занятий
19. Часто задаваемые вопросы
1. Буллеты
Есть причина, по которой в шаблонах многих лендингов можно встретить подобный дизайн:
Буллеты — отличный вариант оформления предложений любого типа, потому что они удовлетворяют привычке пользователей «сканировать» текст. Откройте страницу, которую вы никогда не видели, и ваш взгляд, скорее всего, сначала выхватит первые три строки текста, затем устремится в центр в поисках чего-нибудь интересного, за что можно зацепиться и продолжить изучение.
Буллеты следуют F-образной схеме чтения, поэтому ваша аудитория с большей вероятностью воспримет информацию, описанную в них. Буллеты делают сложные темы легкими для восприятия, а ваши выгоды — привлекательными.
- Подойдет для страниц, которые предлагают что-то, что не может быть описано небольшим текстом в несколько строк. Списки из 3-7 пунктов наиболее полезны для продвижения средних по размеру форм обратной связи с предложением бесплатно получить электронную книгу или запись вебинара.
- Подойдет для аудитории, которая предпочитает заранее понимать самые важные детали и быстро принимать решение.
2. Нумерованные списки
Советы, функции продукта, пошаговые инструкции могут быть выгодно представлены в виде нумерованного списка. Если это то, что вы предлагаете, попробуйте этот вид оформления лендинга.
- Подойдет для страниц, которые рекламируют сервис по подписке, определенный пакет услуг или сложный информационный продукт.
- Подойдет для аудитории, которая хочет четко понимать, во что она ввязывается.
3. Раздел «Как это работает»
Информация, которая подробно описывает посетителям ваше предложение, является одним из лучших способов преодоления трения. Люди склонны скептически относиться к туманным обещаниям и сложным фразам. Чем яснее вы сообщаете о том, «что, где, когда», тем лучше ваша аудитория поймет то, что вы хотите сказать.
Если вы проводили когда-нибудь пользовательское тестирование для бизнес-сайтов, то вы, наверняка, слышали подобный вопрос: «Хорошо, но как все-таки это работает?»
Уф.
Весь ваш продуманный брендинг и вдохновляющие сообщения напрасны, если посетители не могут ответить на этот основной вопрос. На лендинге также важно использовать термины, понятные посетителям.
Добавление раздела «Как это работает» поможет решить проблему. Вот пример:
Неважно, в какой отрасли вы работаете и чем занимаетесь, чем более открытым будет ваше предложение, тем безопаснее будет чувствовать себя ваша аудитория при покупке ваших продуктов.
- Подойдет для страниц, которые стремятся к прямой продаже, предлагают комплексный сервис.
- Подойдет для аудитории, которая скептически настроена или не очень хорошо знакома с тем, что вы делаете.
4. Рекламное письмо
Рекламные письма (если они составлены правильно) могут мотивировать аудиторию за счет убедительного повествования. Это шанс решить проблемы посетителей и показать им, что вы действительно рассказываете личную историю.
Если ваш бренд представляет одна ключевая фигура и вам нужно продать один крупный продукт или услугу, рекламное письмо может оказать уникальное эмоциональное воздействие.
Одно из писем Евгения Демина, директора компании Splat
- Подойдет для страниц, которые продают напрямую или в значительной степени полагаются на личную историю предпринимателя.
- Подойдет для аудитории, которая уже немного знакома с вами или с большой вероятностью откликнется на эмоциональный призыв.
5. Видео от первого лица
Иногда лучшие рекламные письма — вовсе не письма, а видео. Если вы не писатель по своей натуре, подумайте о том, чтобы снять видео на камеру или на смартфон. Простой сценарий, тихий и хорошо освещенный уголок и микрофон-петличка — все, что вам нужно для начала работы.
- Подойдет для страниц, которые делают громкое заявление или основаны на эмоциях, продвигаются конкретной личностью или рекламируют предложение, связанное с видео (вебинар или видеокурс).
- Подойдет для аудитории, которая предпочитает видео тексту или уже знакома с вашими видео.
6. Быстрый тест
Онлайн-викторины и тесты, кажется, стали любимым занятием, чтобы потратить время впустую. Но они также могут предоставить отличную возможность, чтобы привлечь вашу аудиторию и узнать о ней больше, одновременно развлекая.
Можно использовать несколько вариантов добавления быстрых тестов на ваш лендинг. Вы можете предложить тест с двумя вариантами ответа, а затем предоставить правильный ответ с соответствующим предложением.
Вы можете заинтересовать посетителей, включив короткий вопрос в текст рекламного сообщения и попросив их посмотреть короткое видео или оставить адрес электронной почты, чтобы узнать ответ.
Если ваши первые попытки использовать быстрые тесты окажутся успешными, вы можете инвестировать в специальные инструменты для создания тестов и получать результаты по электронной почте.
- Подойдет для страниц с простым предложением, особенно если оно включает контент с практическими рекомендациями.
- Подойдет для аудитории, у которой мало времени и которой нравится геймифицированный подход.
7. Мини-блог
Если блог является важной частью вашего бизнеса, почему бы не рассказать о нем на одном из лендингов, написав пост или короткую статью?
Подобный контент выполняет две функции: рассказывает о том, что потенциальные клиенты получат, если перейдут в блог, и напоминает им о необходимости регулярно читать ваш блог, чтобы получать дополнительную информацию. Кроме того, если вы добавите дату публикации, то вашим читателям будет понятно, как часто вы обновляете страницу и предоставляете свежую информацию по какой-то теме.
- Подойдет для страниц, которые дают исчерпывающее представление о том, кто вы и чем вы занимаетесь, и просят заполнить простую форму обратной связи. Также отлично подходит для мини-сайтов и страниц-приветствий.
- Подойдет для аудитории, которая впервые заходит на ваш сайт или сталкивается с вашим бизнесом.
8. Раздел «Наша история»
Часто этот раздел находится на странице «О нас», но история компании может стать и мощным элементом лендинга. У вас небольшой опыт в бизнесе? Не так много знаний в вашей сфере? Недостаточно клиентов, которые могли бы оставить отзывы или другие социальные доказательства?
Большинство лендингов стремятся найти какой-то способ, чтобы подчеркнуть свою значимость. Можно добиться этого, используя раздел «Наша история». Важно рассказать вашу уникальную историю интересно.
- Подойдет для страниц, которые дают исчерпывающее представление о том, кто вы и чем вы занимаетесь и просят заполнить простую форму обратной связи. Также отлично подходит для мини-сайтов и страниц-приветствий блогов.
- Подойдет для аудитории, которая знает вас недостаточно хорошо.
9. Сравнительная таблица
Конкурируете с кем-то? Есть две стратегии: игнорировать конкурентов и говорить о том, что вы делаете лучше других, или действовать. Любая может быть действенной. Но если вы выбираете вторую, то вы можете пойти одним из двух путей.
Неправильный путь: унижать конкурентов и строить свой бизнес на основе гиперболических утверждений о своем величии. Так вы будете казаться неуверенным в том, что предлагаете.
Правильный путь: попробуйте выбрать более нейтральный тон. Иногда для этого не нужно много слов — сравнительная таблица может сказать все за вас.
Вы также можете использовать таблицу сравнения цен или диаграмму, чтобы показать расходы или подводные камни, которые клиентам удастся избежать, если они выберут вас.
- Подойдет для страниц, которые продают один функциональный продукт или услугу напрямую.
- Подойдет для аудитории, которая внимательно все изучает, прежде чем совершить покупку.
10. Награды
На вас обратили внимание СМИ? Среди ваших клиентов есть известные люди? У вас есть награды? Возможно, вы разместите эту информацию на своем сайте, но такой контент может стать полезным и для лендинга.
Самый простой способ — посвятить такому контенту отдельный раздел длинной посадочной страницы, но вы также можете выбрать одну наиболее убедительную награду и разместить на коротком лендинге. Появление на телевидении или восторженный отзыв известного человека может быть очень полезен.
- Подойдет для страниц, которые либо продают что-то, либо представляют форму обратной связи.
- Подойдет для аудитории, которая еще не знает вас достаточно хорошо или склонна принимать решения о покупке на основе рекомендаций авторитетных людей.
11. Отзывы
Подобно другим видам социального доказательства, отзывы часто размещают на сайте, но, как правило, они не оказывают должного воздействия на потенциальных клиентов. Поэтому попробуйте разместить отзывы на соответствующем лендинге.
Хороший отзыв иногда может рассказать больше о вашем продукте или услуге, чем вы. Если у вас много отзывов, вы можете позволить различным пользователям оставлять развернутые комментарии по поводу ваших товаров на длинном лендинге:
Одно правдоподобное свидетельство довольного клиента на лендинге может сделать больше тысячи слов убеждения.
- Подойдет для страниц, которые нацелены на продажи, подписку на контент или на блог.
- Подойдет для аудитории, которая делает выбор, основываясь на отзывах.
12. Пользовательский контент
Специальный вид социального доказательства, генерируемый пользователями, свидетельствует о том, что ваше предложение или ваш бизнес привлекли заинтересованных людей.
Вы можете контролировать такой контент. На странице с отзывами также можно добавить раздел, куда вы будете добавлять лучшие твиты ваших клиентов. Вы также можете добавить отзывы из других социальных сетей (Вконтакте, Facebook, Instagram).
Также можно добавить раздел комментариев на Facebook. Это может быть полезно, если у ваших пользователей возникает много вопросов, например, когда вы рекламируете курс или мероприятие. Кроме того, вы можете использовать раздел комментариев для ответов на часто задаваемые вопросы.
- Подойдет для страниц, которые рекламируют сложный продукт, ведут блог или проводят вебинары, мероприятия.
- Подойдет для аудитории, которая заинтересована в высоком уровне взаимодействия.
13. Фотографии сотрудников
Ваши сотрудники — высококвалифицированные профессионалы, которые заботятся о каждом клиенте. Но кто они? Если человеческие ресурсы — главный аргумент, чтобы потенциальные клиенты выбрали именно вас, расскажите о профессионалах, которые работают в вашей команде! Клиенты лучше поймут ваше предложение, если у них будет впечатление, что они общаются с реальными людьми. Вряд ли фото ваших сотрудников станут основным контентом лендинга, но включить подобную информацию в раздел «Наша команда» стоит:
- Подойдет для страниц, которые рекламируют ваши услуги или знакомят с вами.
- Подойдет для аудитории, которой важно знать в лицо тех, с кем она имеет дело.
14. Интерактивный контент
Интерактивные карты. Специальные калькуляторы. Календари и планировщики. Подобные варианты интерактивного контента предоставляют посетителям очень конкретную информацию о вашем бизнесе, приближая их к покупке и реальному взаимодействию.
- Подойдет для страниц, которые стремятся подтолкнуть посетителей к личному общению, особенно для бизнеса, предлагающего какие-либо услуги .
- Подойдет для аудитории, которая имеет достаточный интерес к теме вашей целевой страницы, чтобы потратить несколько минут на интерактивный контент.
15. Фотогалерея
Если у вас есть качественные фотографии, имеющие отношение к вашему бизнесу, вы можете разместить их на длинном лендинге. В идеале использовать фотографии не как галерею, а как демонстрацию вашего предложения.
Если вы продаете билеты на мероприятия, пакеты услуг или продукт, который становится более понятным в контексте, попробуйте найти или сделать несколько фотографий для использования на лендинге.
- Подойдет для страниц, которые продвигают визуально привлекательный продукт.
- Подойдет для аудитории, которая очень любит визуальный контент.
16. Набор иконок
Функции и этапы процессе становятся более понятными, когда вы присваиваете каждой отдельной детали значок или краткое описание. Для простой страницы может хватить трех иконок, тогда как раздел «Наши услуги» может содержать три ряда иконок.
- Подойдет для страниц, на которых перечисляются все ваши основные услуги и описывается сложный пакет услуг или продукт.
- Подойдет для аудитории, которая хочет понять суть вашего предложения.
17. Иллюстрации и схемы
Услуги и облачные сервисы иногда сложно представить с помощью фотографии или иконок. Но это не значит, что вы не можете проиллюстрировать свое предложение, чтобы помочь вашей аудитории понять его ценность.
В этом случае можно создавать диаграммы: блок-схемы, иллюстрации процессов, диаграммы связей (mind map).
- Подойдет для страниц, которые рекламируют один информационный продукт или услугу, особенно что-либо, основанное на уникальной формуле или специальном процессе.
- Подойдет для аудитории, которая ищет повторяемые результаты с возможностью освоить их самостоятельно.
18. Расписание и планы занятий
Есть чему научить? Для онлайн-мероприятий, персональных событий и информационных продуктов расписание или учебный план может стать идеальным способом показать, что вы предлагаете. Важный момент: не ждите, что каждый посетитель изучит все ваши планы. Для многих клиентов важно, чтобы информация была актуальной и понятной.
- Подойдет для страниц, которые рекламируют курс, мероприятие, вебинар или тренинг.
- Подойдет для аудитории, которая любит знать все детали предстоящего мероприятия.
19. Часто задаваемые вопросы
Раздел с ответами на часто задаваемые вопросы многим представляется как самая скучная часть лендинга, но на самом деле может стать мощным инструментом продаж. Подумайте об этом: у вас есть шанс предупредить сомнения и возражения, отвечая на них прямо. Не нужно вплетать ответы на часто задаваемые вопросы в умный рассказ или слишком беспокоиться об их последовательности — просто разместите их один за другим.
Раздел с ответами на часто задаваемые вопросы не может стать единственным содержанием лендинга, но может поддержать и конкретизировать описание вашего предложения.
- Подойдет для страниц, которые рекламируют курс, мероприятие или продукт со сложным описанием.
- Подойдет для аудитории, которая любит знать много деталей или надеется получить ответы на конкретные вопросы.
Какой формат контента лучше подойдет для вашего лендинга? Здесь нет какой-то универсальной формулы. Многие наши бесплатные шаблоны уже содержат некоторые из перечисленных приемов — буллеты, галереи, списки, отзывы и т.д. Но если вы хотите узнать, выиграет ваш лендинг от того или иного формата или нет, вы можете его протестировать. Особенно, если возможность сплит-тестирования уже включена в функционал платформы, на которой создан ваш лендинг, как в случае с редактором LPgenerator.
Высоких вам конверсий!
По материалам: leadpages.net Изображение: pixabay.com
07-11-2019
12 примеров лендингов со сложными продуктами для интернет-маркетинга
Ни одна успешная рекламная кампания в интернете не обходится без индивидуального анализа ситуации и подбора соответствующих инструментов. Причем, чем сложнее продукт, тем точнее нужно работать с целевой аудиторией. Сегодня мы проанализируем 12 примеров лендингов со сложными продуктами для интернет-маркетинга.
1. Typeform. Гениальная подача продукта
Потрясающий лендинг, очень наглядно демонстрирующий возможности продвинутых онлайн-форм для заполнения: тестов, анкет, опросников и т.п.
СТА-кнопка на первом развороте позволяет сразу же начать пользоваться сервисом, причем без регистрации. Анимация по бокам показывает, как Typeform работает на разных мобильных устройствах. Наверху — привычная для западных сайтов плавающая панель с кнопкой быстрой авторизации и меню навигации по сайту. При прокрутке к ним добавляется и СТА-кнопка.
На следующем экране пользователю предлагается забавный интерактивный чат, с помощью которого можно опробовать на себе то, как работает Typeform. В конце каждого мини-опроса, посетителя ненавязчиво просят оставить свой email, и мы знаем, зачем это нужно 😉
Последний разворот носит социальный характер и объединяет в себе анимированные формы различных видов и соответствующие им видео-вставки с представителями разных сегментов целевой аудитории. Подано все это настолько живо, интересно и оригинально, что с лендинга просто не хочется уходить. А на карте сайта в самом низу можно найти встроенную мини-игру по мотивам Space Invaders, предлагающую запрыгнуть в космический корабль и избавить сеть от скучных форм. Лендинг очень необычный, и работает на ознакомление целевой аудитории с достаточно сложным продуктом.
Как «упаковать» сложный продукт на лендинге?
2. Monkop. Персонаж-символ
Лендинг сервиса по тестированию мобильных приложений на физических устройствах Monkop — замечательный пример того, как маскот (узнаваемый персонаж-талисман, олицетворяющий собой бренд) может оживить и сделать сайт оригинальным, запоминающимся.
В случае с Monkop — это харизматичная оранжевая обезьяна, которой на первом же развороте можно передать на анализ ваш файл в формате .apk, просто перетащив его к ней в лапы или выбрав через Проводник. Правее размещены заголовок, подзаголовок и простая открытая форма подписки для ввода email. Чуть ниже видно простенькую трехшаговую картинку-инструкцию, которая показывает алгоритм работы.
На втором развороте — демонстрационный flash-ролик с яркой и живой анимацией. Далее находится СТА-кнопка, которая позволяет узнать, как будут выглядеть полученные отчеты об анализе, а под ней, опять же, анимация в тему. На последнем экране — четыре ключевые особенности сервиса и две СТА-кнопки: одна якорная, а вторая переносит к ценам. Сервис ориентирован на Android, в разработке — поддержка Apple, о чем информируют две плавающие иконки в правом нижнем углу страницы.
Ключевая особенность этого лендинга в том, что сложный продукт не обезличивается. Вместо сухой подачи с техническими характеристиками и сдержанным дизайном, пользователь получает самый настоящий бренд личности. Правда, воплощенный не в человеке, а в анимированной обезьянке.
Поиск своего голоса: основы создания бренда
3. Intercom. Простенько, но со вкусом
Лендинг Intercom, представляющий платформу для коммуникаций с клиентом, демонстрирует то, как незатейливый арт и простенькая анимация способны преобразить весь сайт. Две вещи сразу придают посадочной странице легкости, забавности, веселья и дружелюбности:
- «Мультяшные» изображения, имитирующие рисунок ручкой, с простой заливкой цветом.
- Примитивная анимация, изменяющая мелкие детали на картинках при наведении на них курсором.
Даже логотип и плавающая кнопка чата здесь улыбаются.
Ссылка на самом верху страницы перенаправляет нас на лендинг нового мессенджера от Intercom. Открытая форма захвата с полем для email на первом развороте продублирована в плавающем меню шапки сайта и повторяется ближе к его концу.
Лендинг выполнен в синем цвете, а заголовки над СТА выделены красным. Синий фон социального блока с логотипами компаний-клиентов контрастирует с белым фоном всего сайта.
Почему текст должен хорошо контрастировать с фоном лендинга?
4. Smooch. Еще один мессенджер
Лендинг для сервиса многоканального обмена сообщениями с клиентами, поддерживающий большинство популярных устройств и приложений.
В качестве «визитного» цвета выбран фиолетовый. Первый разворот хорош заголовком, содержащим призыв, единственной СТА-кнопкой и изображением, указывающим на назначение Smooch. Не хватает здесь лишь кнопки с демонстрационным видео, которое доступно через другие ссылки. Его бы следовало разместить прямо под СТА-кнопкой либо на изображении ниже. Таким образом оно сработало бы как мощный социальный триггер.
На последующих экранах — 3 триггера преимуществ, изображение с примером интерфейса и повтор основного СТА, выделенный контрастным фоном для привлечения внимания. Триггеры доверия с логотипами и отзывами собраны на последнем развороте перед картой сайта.
В целом и общем, сайт Smooch — типичный представитель западных лендингов своей ниши. Он поддерживает тренд мощных IT-продуктов: создавайте просто, без пафоса, для людей.
Почему видео-лендинги конвертируют лучше?
5. Mixpanel. «Много триггеров доверия не бывает»
Лендинг Mixpanel посвящен аналитике поведения пользователей в мобильных приложениях и на страницах сайтов.
Первый разворот занимает слайдер, первый слайд которого включает в себя четко сформулированные заголовок и подзаголовок с призывом к действию, а также простую открытую форму захвата. От пользователей не требуют лишней информации: только email. Обратите внимание, что в отличие от Рунетовской традиции, разработчики англоязычного сегмента предпочитают захватывать только самые необходимые данные. Остальные экраны слайдера демонстрируют основные возможности Mixpanel.
Как ни странно, на этом продажи заканчиваются. Всю остальную часть сайта целиком и полностью занимают социальные триггеры. Даже последняя СТА-кнопка в конце лендинга предлагает ознакомиться с еще большим количеством отзывов, если кому-то вдруг их не хватило. О продукте маловато информации, и поэтому одним из наиболее полезных блоков можно назвать раздел с видеосоветами от экспертов индустрии. Дизайн-макет разработан грамотно: сдержанная цветовая гамма разбавляется контрастными элементами, а самые главные контентные блоки сайта выполнены со светлым фоном. Это облегчает восприятие информации.
5 типов социальных доказательств, которые можно использовать прямо сейчас
6. Hashtago. Не просто «хэштег»
Лендинг соцмедийной аналитики на основе хэштегов.
Единственная СТА-кнопка первого разворота предлагает получить бесплатную версию приложения, а единственная отличительная особенность страницы — плавная прокрутка, которая сменяется с горизонтальной на вертикальную.
Для любителей быстро пролистать сайт есть меню с якорными ссылками на ключевые блоки. На последнем развороте размещена открытая форма захвата, дублирующая всплывающее окно из кнопки на первом экране. В целом дизайн лендинга очень сдержанный, без хитростей и находок. Единственным весомым минусом можно назвать наличие мелкого шрифта, который выглядит в верстке не очень гармонично и тяжело читается.
7. Superhuman. Сверхспособности email-маркетинга
Лендинг про достижение новых высот в email-маркетинге кроме всего прочего заявляет о Superhuman как о самом быстром приложении на рынке. Это УТП хотя и звучит неправдоподобно без достаточного количества аргументов, но смотрится внушительно.
Первый разворот очень простой — хедер, заголовок, открытая форма для ввода email и скриншот с интерфейсом приложения.
Далее вся информация подается в текстовом виде с заголовками и подзаголовками на контрастно чередующихся светлых и темных фонах с фото. Структура однотипная, много текстовых «полотен» и из-за этого лендинг кажется однообразным и невообразимо длинным.
Только на четвертом экране есть видеофон, который немного оживляет сайт. Хотя, учитывая однотипность структуры, он выглядит даже неуместно. Блок с отзывами повторяется, как и основной СТА с формой захвата.
Насколько длинным должен быть эффективный лендинг?
8. MailChimp PRO. Прокачай свой MailChimp
Лендинг, призывающий улучшить ваш MailChimp аккаунт до статуса «PRO» за $199 в месяц. Цена указана уже в подзаголовке. Единственная СТА-кнопка в верхнем правом углу, ведущая к целевому действию — плавающая, и меняет свой цвет вместе с фоном разворотов при прокрутке. Скроллить лендинг можно как колесиком мыши, так и с помощью кнопок слева.
На втором развороте находятся видеоролики о всех ключевых возможностях PRO-аккаунта, с которыми нас знакомят подробнее по мере продвижения к концу страницы. Самый последний разворот отведен социальным триггерам.
Дизайн страницы очень простой, выполнен в цветовой гамме MailChimp и подчеркнуто минималистичный.
9. Azendoo. Симпатичная CRM
Дизайн лендинга CRM-системы Azendoo можно назвать тонко ограненным. Он сделан на высоком уровне, строг, но располагает к себе и приятен глазу. На первом развороте — видеофон и все самое нужное.
Мы видим:
- заголовок и подзаголовок,
- единственную СТА-кнопку,
- ссылку на видеопрезентацию.
В шапке сайта — плавающее меню с логотипом и ссылками. Большая часть ссылок — якорные, но некоторые ведут к форме захвата или форме авторизации.
На втором экране самое интересное — демонстрационный макет интерфейса с кнопками для переключения по разделам. Некоторые его элементы пронумерованы, если нажать на номер — часть макета увеличивается, показывая дополнительные детали. На разворотах ниже мы видим сначала список сервисов, с которыми система может быть интегрирована, блок с описанием компаний, которым подойдет продукт, продающие триггеры и закрытая форма захвата в конце.
Как правильно работать с высоконверсионными формами захвата на лендинге?
10. Siteleaf. Дружелюбный flat
Яркий и позитивный дизайн лендинга, посвященного системе контент-менеджмента Siteleaf. Выполнен в трендовом стиле flat.
На первом развороте радуют глаз понятные заголовок и подзаголовок, ссылка на видеопрезентацию, троица милых лесных зверушек над триггерами ключевых возможностей, а также СТА-кнопка.
Следующие три разворота демонстрируют части интерфейса, открытого кода и интеграцию с GitHub. Очень оригинально графически поданы популярные сайты, с которыми интегрируется Siteleaf.
Открыто показывать код — это отдельный триггер доверия в отрасли. Опытный специалист может оценить качество приложения по тому, как оно написано. Такой шаг означает, что компания не боится показать изнанку своей работы.
Последними идут блоки социальных триггеров и знакомая по первому развороту СТА-кнопка. В целом, Siteleaf — живой пример хорошего современного дизайна.
5 причин, почему плоский дизайн способствует увеличению конверсии
11. Sonicpass. На страже безопасности
Интересный лендинг для продукта из сферы кибербезопасности, имеющий как удачные, так и неудачные дизайнерские решения. Первый разворот примечателен своеобразной анимацией, но СТА-кнопку обнаруживаешь на нем не сразу, а заголовок и подзаголовок вроде бы и сообщают ценную информацию, но не содержат конкретики.
Второй разворот, описывающий решаемую продуктом проблему, резко выделяется на лендинге контрастным темным фоном. Смотрится оригинально и сразу привлекает внимание.
Оставшаяся часть страницы содержит белые элементы дизайна, которые совершенно не читаются на общем белом фоне, теряясь в нем полностью. Выглядит такое оформление весьма сомнительно.
Как эффективно использовать свободное пространство в веб-дизайне
12. Copper. Никаких паролей!
Copper позволяет встраивать в сайты и приложения авторизацию без пароля. Вместо этого нужно ввести шестизначный код, который высылается на мобильный номер.
Дизайн сайта очень лаконичный. Понятные заголовки и СТА на первом развороте, части открытого кода на втором и последнем. В середине лендинга — анимация, полностью показывающая весь процесс аутентификации при помощи мобильного. В конце страницы расположены дополнительные СТА-кнопки.
Лендинг Copper содержит небольшую пасхалку. После успешной авторизации, фон на первом развороте эффектно рассыпается цветными конфетти.
Итог
Стив Джобс называл лучшими технологиями те, которые работают незаметно. Так же, как сложные продукты могут быть простыми в пользовании, так и лендинги для ниши интернет-маркетинга могут выглядеть элементарно, как «2+2».
Большинство из них сделаны лаконично, содержат всего одну СТА-кнопку или открытую форму захвата с единственным полем для email. Несомненным плюсом для таких одностраничников будет наличие видеопрезентации, желательно на первом развороте, и фрагментов открытого кода. Это работает как триггер доверия и своеобразный показатель качества. Отдельной особенностью описываемых лендингов можно назвать залипающее меню с СТА-кнопкой и якорной навигацией по сайту.
Нужен уникальный дизайн лендинга? Тогда заполните форму заказа или используйте наш конструктор, чтобы создать посадочную страницу самостоятельно.
Высоких вам конверсий!
10-08-2016
8 актуальных трендов веб-дизайна лендингов
Веб-дизайн похож на моду: с каждым сезоном появляется что-то новое и интересное. Иногда это связано со стремлением digital-агентств продавать все новые и новые продукты с более высоким ценником, а иногда — просто эстетическая составляющая эволюции дизайнеров как специалистов в своей области.
Так или иначе на рынке лендингов тоже есть модные веяния. Данная статья познакомит вас с самыми актуальными трендами 2014 года.
1. Видео лендинг
Век многозадачности делает свое дело: внимание современных интернет-пользователей все сложнее привлечь к одному объекту, а это значит, что ваш бренд должен обладать крепким позиционированием.
Конечно, видеоролики пользуются большой популярностью уже очень давно, однако в наше время они уверенно занимают одно из важнейших мест в контент-стратегии и даже дизайне многих брендов.
Лендинг Robinhood представляет собой целевую страницу с идеально интегрированными элементами видео в качестве фона — это дает впечатляющий, полностью интерактивный опыт.
2. Parallax-эффект
Это метод веб-дизайна, также позволяющий создавать удивительный пользовательский опыт. При parallax-скроллинге элементы дизайна сайта прокручиваются с разной скоростью, изменяя расположение в процессе самым неожиданным образом и создавая любопытную иллюзию 3D-изображения.
Сам термин пришел от греческого слова «parallaxis», означающего «изменение».
Parallax-эффект появился довольно давно, однако только сейчас этот тренд становится по-настоящему популярным. Пример — норвежское интерактивное агентство Unfold, использующее на своем лендинге большинство возможностей parallax-скроллинга.
3. Slide-Out меню
Некоторые дизайнеры и маркетологи считают, что стандартные навигационные панели слишком неудобны. Современные люди, как правило, тяготеют к простоте и минимализму в дизайне — ответом на эту тенденцию стало размещение так называемого Slide-Out меню в выдвижной панели лендинга.
Помните иконку «бургер» в мобильных приложениях? Это ее вариант для широких мониторов.
Пользователи могут получить доступ к элементам навигации сайта, нажав на верхнюю или боковую часть экрана. Этот тренд особенно актуален при проектировании ресурсов под мобильные устройства, так как именно там возникает острая проблема с пространством экрана.
Хорошим примером будет облачный конструктор сайтов Squarespace, элегантно использующий выдвижное меню на своем лендинге.
4. Необычные шрифты
«Золотые» дни стандартных шрифтов, таких как Arial, Helvetica и Times New Roman, приходят и уходят циклично. На сегодняшний день все больше дизайнеров склоняются либо к различным вариациям классики, либо к уникальным шрифтам, что видно на примере взлета «Proxima Nova».
Из винтажных примеров ниже вы можете почерпнуть вдохновение для разработки собственных целевых страниц.
Обложка книги:
Винтажная упаковка мыла:
Пачка сигарет:
Плакат с рекламой циркового представления:
5. Плоский дизайн
Появление iOS 7 торжественно обозначило начало эпохи плоского дизайна. Основатели ресурса Fitbit, занимающегося продажей гаджетов для людей, ведущих активный образ жизни, явно вдохновлялись последними разработками Apple.
6. Карты
Все больше и больше ресурсов применяют макеты, подобные ленте новостей социальной сети Pinterest: с большим количеством сегментов разного размера, множеством изображений и легким скроллингом.
7. Изображения, написанные от руки
Нарисованные от руки иллюстрации применяются не первый год, но с ростом иконографии и винтажного дизайна их популярность выросла в несколько раз. На сайте свадебного бренда Twigs & Honey рисованные элементы подчеркивают причудливое и сказочное лицо бизнеса.
8. Крупные фоновые изображения
Хороший визуальный контент на landing page часто дает вирусный эффект, поэтому качественные фотографии могут стать одной из лучших маркетинговых инвестиций на сегодняшний день. Все больше и больше лендингов/сайтов используют крупные hero-images, дабы показать свой продукт или услугу в выгодном свете.
Товар на полке никому не интересен — снимите его в условиях дикой природы, привлеките модель, представляющую вашу аудиторию. Словом, продавайте не продукт, а образ жизни. Бренд Hershel является ярким примером.
Вместо заключения
Новое — не значит хорошее, как гласит старая поговорка, которая в высшей степени актуальна для этого поста. Основная задача лендинга — конвертировать трафик в лиды, и веб-дизайн должен способствовать этой цели.
Тестируйте все свои гипотезы и тогда вам не придется терять драгоценных покупателей.
Высоких вам конверсий!
По материалам: blog.klaviyo.com
23-11-2014