Артем Еремеевский - Интернет-магазин с нуля. Полное пошаговое руководство
Кнопка «Купить» и ее важность
Отдельно хочется остановиться на элементе, которому часто уделяют незаслуженно мало внимания, – кнопке «Купить». Казалось бы, что тут сложного – обычная кнопка, нажал, товар добавился в корзину, и готово. На самом же деле кнопка «Купить» – это второй по важности элемент после описания и картинок. Это именно тот элемент, который ищет клиент после принятия решения о покупке. Многие допускают ошибку, думая, что главное – это наличие кнопки, а ее расположение, цвет и прочее неважны. Поэтому можно увидеть кнопку «Купить» и слева, и справа, и где-то внизу, и такой, что и жать на нее не хочется. Она может быть просто незаметна и теряться среди других элементов.
На самом же деле кнопка «Купить» должна не только привлекать внимание, но и мотивировать к покупке. Прежде всего располагайте ее так, чтобы она была видна сразу при заходе на страницу товара, была обособлена от других элементов, но при этом не мешала восприятию основного контента. Идеально, расположение – справа от фотографий над описанием либо справа от фотографий и описания. Я видел магазины, где кнопка «Купить» располагалась под описанием и ее вообще не было видно без перемотки страницы вниз. Сразу было даже непонятно, магазин это или просто блог с описанием товара.
Для этой кнопки нельзя использовать цвета, которые хороши для привлечения внимания (красный, например). Цветовосприятие никто не отменял, поэтому допускается использование нейтральных и теплых цветов. Оптимальный – это зеленый, синий или в крайнем случае желтый. А вот если вы используете красный цвет, то просто теряете клиентов, потому что кто-то не кликнет уже на подсознательном уровне. Это все протестировано, и нужно это учитывать. Также ваша кнопка должна выглядеть именно как кнопка, она должна быть «вкусной» (чтобы на нее хотелось нажать).
Кнопка должна быть максимально простой, не надо делать всякие кружочки с корзинкой. Она не должна быть слишком маленькой, так как в этом случае ее сложно будет обособить от других элементов. В целом размер шрифта цены и самой кнопки должен быть в несколько раз больше размера шрифта описания.
Кнопка должна вести себя как кнопка: меняться при наведении и клике (посмотрите за поведением любой кнопки в Windows, и вы поймете, о чем я), курсор мышки так же должен меняться на «руку» при наведении. Это все без проблем реализуется с помощью современных технологий при верстке сайтов. Основная проблема – когда кнопка вообще никак себя не выдает, иногда даже не меняется курсор мыши.
Эти, казалось бы, мелочи очень сильно влияют на конверсию. Когда мы у себя изменили кнопку (у нас какое-то время висела красная кнопка на желтом фоне, о ужас!), конверсия процентов на 40 стала выше, в то время это было два-три дополнительных заказа в день.
Только представьте: обычная замена кнопки позволила увеличить прибыль на несколько тысяч рублей в день! Мы в течение нескольких месяцев теряли порядка 30–50 тысяч рублей из-за одной лишь кнопки! Вы все еще не уделяете кнопке «Купить» должного внимания? Тогда мы идем к вам!Корзина и оформление заказа
Почему теряются клиенты?
Следует понимать, что между решением о покупке и собственно покупкой лежит целый этап – оформление заказа. У некоторых данный этап становится огромной пропастью, которую удается преодолеть далеко не всем клиентам. Мне сразу вспоминается один из моих клиентов, которому я проводил аудит интернет-магазина. Как выяснилось, у него после добавления товаров в корзину отваливалось две трети клиентов. То есть из десяти потенциальных заказов он реально получал только три-четыре. Думаю, о размере убытков вы сможете догадаться сами.
Позвольте клиенту покупать
Итак, что же должны представлять собой современная корзина и процесс оформления заказа? Прежде всего поговорим о добавлении товара в корзину. У многих после нажатия кнопки «Купить» идет переход непосредственно на страницу корзины. Это некритично, но вы сами себе урезаете средний чек. Представьте, что вы идете по супермаркету с тележкой и после того, как кладете в нее товар, к вам подбегает консультант и говорит: «Ну что, идем на кассу?» Или, что еще хуже, вы неким автоматическим способом оказываетесь у кассы. Сколько товаров вы купите таким образом? А ведь могли бы набрать полную тележку.
То же самое и в интернет-магазине. Не нужно постоянно перебрасывать клиента к корзине, дайте ему возможность выбрать что-то еще. Сейчас почти все движки поддерживают Ajax корзину, суть которой сводится к тому, что после нажатия кнопки «Купить» товар добавляется в корзину, а клиенту просто показывается сообщение, в котором предлагается при желании перейти к оформлению заказа.
Если же клиенту нужен один товар (и вы видите, что у вас много таких заказов), то в этом случае целесообразно сделать возможность оформления заказа в один клик. То есть располагается ссылка под основной кнопкой «Купить» – и далее клиенту выдается форма, где он вводит свои данные и оформляет заказ. Задача данного функционала – максимально упростить покупку для клиентов, которым нужен всего один товар. Пример можно посмотреть на сайте alcodream.ru.Страницы корзины и оформления заказа
Процесс оформления заказа должен быть максимально простым. Используя современные технологии, его можно свести к одной странице (содержимое корзины и форма ввода данных совмещены), максимум к двум (содержимое корзины и форма ввода данных содержатся на разных страницах). Это очень важно, поскольку оформление заказа в три-четыре этапа (и очень плохо, если при этом еще требуется обязательная регистрация) – это потеря клиентов. А ведь именно такой функционал встречается по сей день даже на платных движках.
Еще один важный момент, который почему-то используют немногие магазины, – отдельный шаблон для страниц корзины и оформления заказа. На этом этапе клиент уже совершает покупку, и не нужно отвлекать его лишними элементами типа отзывов, групп в «Фейсбуке», навигации по категориям и т. п. Поэтому в идеале в шаблоне нужно убирать левые и правые колонки, а оставлять действительно важную информацию: контакты, условия доставки, варианты оплаты и т. д.
Корзина должна быть максимально компактной и информативной. Не нужно располагать в ней товары с огромными фотографиями, растягивая страницу по вертикали. Клиент уже знает, что он покупает, поэтому достаточно небольших фотографий.Как повысить доверие к магазину при оформлении заказа
Страница оформления заказа может и должна содержать дополнительные элементы, повышающие доверие к вашему магазину, чтобы у клиента не оставалось никаких сомнений, что, оформив заказ у вас, он не останется без товара (а в случае обязательной предоплаты – и без денег). Я приведу два примера (их наверняка больше, нужно лишь искать). Кстати, нужные элементы можно размещать не только при оформлении заказа, но и на главной странице, чтобы сразу создать нужное доверие к вашему магазину.