Как сделать страницу оплаты с высокой конверсией?

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

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

Пример: интернет-магазин, который мне довелось недавно анализировать, имел такую страницу проведения оплаты, которая позволяла конвертировать 70% посетителей в покупателей. Я задался вопросом, сможем ли мы увеличить это число до 80%, что в цифрах давало на 348 покупок больше и дополнительные 150 тыс.руб./месяц.  Да-да, именно так, небольшие цифры здесь могут генерировать хороший доход.

Оглавление статьи:

  1. Дизайн корзины товаров
  2. Купоны могут навредить?
  3. Доверие и безопасность
  4. Принудительная регистрация?
  5. Принятие оплаты

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

Давайте ознакомимся с примером Amazon:

Когда Amazon высылает вам email с рекламой продукции – это мотивация и триггер. Особенно, когда он напоминает о тех товарах, которые вы недавно просматривали, но не купили. Люди кликают по ссылке, и переходят на страницу продукции. Они читают текст, обзоры, смотрят картинки = больше мотивации. Кнопка “Добавить в корзину” – это триггер, который переводит посетителей к процессу оплаты.

Что же насчет возможностей? Насколько просто пройти процесс оплаты? Здесь Amazon просто превосходит всё и вся: вам нужно просто ввести пароль и сделать пару кликов.

Вот так выглядит процесс оплаты в мобильном приложении Amazon:

amazonГотово!

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

Хороший дизайн корзины товаров

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

Как должна выглядеть корзина товаров?

Что должно происходить, когда люди добавляют что-либо в корзину?

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

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

страница товараА это вы увидите после того, как нажмете кнопку добавления в корзину:

добавление в корзину

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

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

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

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

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

Что должно следовать после того, как товары попали в корзину?

Здесь может быть 2 сценария:

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

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

Lamoda перенаправляет вас в корзину, подтверждает, что вы добавили товар в корзину, и при этом предлагает добавить что-нибудь еще интересное:

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

Важно учитывать следующие метрики:

Нам ведь нужно увеличить не только число трансакций, но также и доход от каждой отдельной трансакции.

Правильное отображение содержимого корзины

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

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

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

В данном случае отличный пример показывает WildBerries:

дизайн страницы оплатыЗдесь важно отметить следующее:

  1. Фотографии товаров
  2. Наименование и цена товаров
  3. Отображение конечной стоимости с возможностью изменить способ доставки
  4. Отчетливый призыв к действию

Правильная визуальная иерархия

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

Не привлекайте внимания к промо-кодам

Когда люди видят поле «Введите код купона», оно становится менее особенным. «Как так получилось, что у меня до сих пор нет купона?» — думают они, и тут же уходят искать код для скидки в Яндекс, после чего многие обратно на сайт уже не возвращаются.

Так что, не советую вам использовать подобные поля для ввода купонов:

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

Всегда напоминайте о прелестях вашего сервиса: доставка, возврат и защищенность

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

Сохраняйте содержимое корзин

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

Процесс регистрации: нужен или не нужен аккаунт?

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

  • 1 из 3 брошенных корзин появляется именно ввиду принудительной регистрации на сайте.

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

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

Расскажу вам хорошую историю о принудительной регистрации, которую когда-то повествовал гуру юзабилити:

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

Форма была простой. Поля Email, адрес, Пароль и Кнопки Login и Register. С такими формами мы встречаемся изо дня в день. Как она могла быть причиной стольких убытков?

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

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

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

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

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

Что следует делать взамен?

Вам следует предоставить возможность провести оплату в гостевом режиме. (Однако дополнить этот процесс некоторыми преимуществами).

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

Плохо

Любые вариации принудительной регистрации – это плохо!

Все еще плохо

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

Хороший пример 1

Всего 2 выбора: бывшие покупатели и новые.

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

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

Хороший пример 2

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

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

Хороший пример 3

Возможность зарегистрироваться предоставляется после проведения оплаты.

Оплата в интернет-магазине

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

  • Спрашивайте информацию кредитной карты в последнюю очередь

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

Они уже ввели имя, email-адрес и информацию о доставке (которая в идеале должна совпадать с адресом плательщика, и ее не придется вводить заново). То же применимо и к полям формы – начните с малого (пусть это будет, к примеру, имя). Самое сложное поле – это поле ввода номера кредитки.

Форма проведения оплаты похожая на кредитную карту

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

Создайте ощущение защищенности

Безопасность – это один из основных моментов для многих покупателей. Кроме непосредственной защиты процесса оплаты при помощи SSL-протокола, обязательно проинформируйте посетителей об этом.

Предлагаю вам пример того, как создать ощущение защищенности:

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

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

Храните данные о кредитных картах в системе

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

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

В завершение

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

11.07.2014

Как сделать страницу оплаты с высокой конверсией?
4 (80%) 6 votes

Статья недели

5 способов изучить спрос на товар до открытия интернет-магазина.

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

© 2011-2016

Права на экспертные публикации принадлежат авторам.

Права на комментарии и статьи редакции принадлежат eMagnat.

Реклама на сайте