Лендинг для интернет-магазина: хороший, плохой, ужасный

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

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

Целостность — важный критерий: Kettle & Fire

Начнем с нестандартного продукта: «100% органический костный бульон из говядины травяного откорма». 

На скриншоте зелеными рамками отмечены правильные вещи, красными — ошибки.

Лендинг для интернет-магазина – кейс Kettle & Fire

Плюсы

Заголовок — зеркальное отражение рекламного объявления. Работает главное правило: заголовок лендинга соответствует предложению в рекламе.

Реклама Kettle & Fire в соцсети Pinterest:

Реклама Kettle & Fire в соцсети Pinterest

Лендинг Kettle & Fire:

Лендинг Kettle & Fire:

Остальные элементы страницы учитывают правило №2: фокус на одной цели. Один призыв к действию — «Хочу купон на 15% скидку». Внизу страницы — кнопка «Кликните, чтобы купить сейчас» — для «разогретой» аудитории. Разные призывы к действию на одной странице — тормоз конверсии, но в этом случае они расположены далеко друг от друга.

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

Лендинг для интернет-магазина – форма подписки, пример Kettle & Fire

Лендинг для интернет-магазина плохой хороший ужасный

Отзыв на странице Kettle & Fire — феноменальный, используйте его в качестве образца:

Лендинг для интернет-магазина – кейс Kettle & Fire, отзыв клиента

Джон Дюран — шишка индустрии палеолитической диеты. Текст включает рекомендации, причины, эксклюзивность («только высококачественные ингредиенты») и личный опыт («часть моей жизни»). Фото Джона вносит убедительность и человечность.

Раздел FAQ не отвлекает от целевого действия. Когда отвечаете на вопросы посетителей, составляйте человекопонятный текст без жаргонизмов. Если прогнать лендинг через программу Главред, она забракует субъективные слова «лучший», «самый», «единственный», «замечательный». Откажитесь от них, если это не подкреплено фактами и цифрами.

Минусы

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

Лендинг для интернет-магазина – кейс Kettle & Fire, минусы страницы

Избегайте глупых ошибок, например, незавершенных предложений: «Join 9000+ customers who save cooking time and» («Присоединяйся к 9 000 клиентов, кто экономит время на приготовление еды и...») Один косяк по невнимательности серьезно портит мнение аудитории.

«Органический», «не содержит ГМО», «безглютеновый», «не содержит молоко» — четыре ключевых определения продукта. Это причины, почему аудитория выбирает продукт Kettle & Fire. Они прячутся за CTA и не мелькают больше нигде.

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

Покупка в один клик: фотоаппараты Blackmagic Cinema Cameras

По запросу «cinema cameras» поиск Google выдает такое объявление:

Лендинг для интернет-магазина – кейс Blackmagic Cinema Cameras, рекламное объявление

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

Лендинг для интернет-магазина – кейс Blackmagic Cinema Cameras, посадочная страница

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

Плюсы

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

Подзаголовки и текст говорят о его технической навороченности:

Подзаголовки и текст говорят о его технической навороченности

Подзаголовки и текст говорят о его технической навороченности

Текст подчеркивает характеристики и выгоды. Это работает, так как продукт рассчитан на профессиональных фотографов.

Лендинг для интернет-магазина – кейс Blackmagic Cinema Cameras, характеристики продукта

Минусы

Несмотря на художественную составляющую и эффективное обращение к целевой аудитории, на странице нет четкой цели. Blackmagic оставляет вас в удивлении и недоумении: «Чего от меня ждут?»

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

Это отношение числа вещей, которые посетитель может сделать на странице к тем, которые он хочет сделать. В идеале это 1:1.

Кнопка «Найти торгового посредника» как бельмо на глазу:

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

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

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

Кнопки «Купить сейчас» тоже не к месту: они работают только на ту аудиторию, которая прошла дальше всех по воронке продаж и готова к покупке. Таинственную кнопку «Далее» лучше совсем убрать.

Непростительные минусы

Еще один косяк кнопок «Купить сейчас». Предположим, пользователь кликает любую из них. Ожидание: он попадет на страницу оплаты, либо отправит понравившийся продукт в корзину. Реальность — кошмарный сон об убийце конверсии:

Лендинг для интернет-магазина – кейс Blackmagic Cinema Cameras, грубая ошибка

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

Как это сделать? Если вы используете Unbounce, интегрируйте лендинг с платформой Shopify. Альтернатива — просто добавьте встраиваемые кнопки «Купить сейчас» на страницы, неважно, на какой платформе построен сайт:

Лендинг для интернет-магазина – встроенные кнопки заказа

Marsh&Mallow использует встроенные кнопки по всему сайту:

Лендинг для интернет-магазина – кейс Marsh & Mallow

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

Никто не любит (неприятные) сюрпризы: Milk-Bone

Не ожидали увидеть сногсшибательную посадочную страницу с предложением жевательных косточек для собак? Смотрите, что сделал Milk-Bone. Конечно, не без косяков (отмечены черными рамками), но близок к идеалу:

Лендинг для интернет-магазина – кейс Milk-Bone

Плюсы

Ни одной типичной ошибки, которая убивает конверсию. Ни навигационной панели вверху. Ни лишних CTA. Ни иконок соцсетей. Даже нет кликабельного лого, которое уводит с посадочной страницы. Вместо этого, пользователь делает именно то, что хочет и что от него ожидают: «Распечатать скидочный купон» — и этот призыв повторяется 4 раза.

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

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

Логотипы и подтверждения экспертов — тактика убеждени

Также есть отзывы клиентов Milk-Bone. При этом на фото не владельцы собак, а «тысячи счастливых жевальщиков» — сами питомцы, ведь они здесь звезды:

Также есть отзывы клиентов Milk-Bone

Минусы

Не все так гладко. Например, первый кликабельный элемент страницы «Воспроизвести видео». Текст и иконки слишком крошечные, чтобы их заметить.

Лендинг для интернет-магазина – кейс Milk-Bone, минусы страницы

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

Либо сделайте оба варианта сразу, как магазин пользовательских стикеров Sticker Mule:

Лендинг для интернет-магазина – кейс Sticker Mule

Когда вы совершаете целевое действие на Milk-Bone, вам предлагают заполнить лид-форму:

Когда вы совершаете целевое действие на Milk-Bone, вам предлагают заполнить лид-форму

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

Однако, это еще цветочки. Заметьте: опция «Да, я также хочу получать рассылку с уникальными предложениями и новости брендов Big Heart Pet» по умолчанию неактивная. Они заполняют форму без галочки и кликают «Отправить» — и вот такой «сюрприз» выскакивает:

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

А какой у вас лендинг?

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

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

Высоких вам продаж!

Статья подготовлена по материалам Unbounce.com