Если в человеке глаза — зеркало души, то душа и сердце любого интернет-магазина — это корзина: то самое место, где каждый владелец сайта ждет своего посетителя больше всего.
По данным исследований, от 60 до 80% посетителей интернет-магазинов, добавивших товары в корзину, уходят без покупки. Причины самые разнообразные, вот самые распространенные:
- скрытые платежи, которые выявились, только когда посетитель стал оформлять покупку;
- необходимость регистрации;
- посетитель не планировал ничего покупать, а хотел сравнить цены и сами товары;
- посетителю не хватило информации или магазин не вызвал доверия (не было подробностей о доставке, гарантиях возврата и возможности связаться с консультантом).
Опрос компании Webcredible, ответы посетителей на вопрос «Что может заставить вас отказаться от заказа?»
Сегодня мы рассмотрим основные советы по улучшению юзабилити корзины и оформления заказа в интернет-магазине. Хочется верить, что большинство из них вы уже давно используете на своем сайте, а если нет, то самое время повысить удобство покупок.
10 правил хорошего тона в корзине
1. Корзину легко найти
Корзина интернет-магазина — уже знакомый большинству пользователей элемент интерфейса сайта, поэтому не стоит удивлять воображение посетителей чудесами дизайна: корзина должна выглядеть как корзина, то есть иконка тележки, пакета для покупок, ручной корзины — ассоциации должны быть с реальным магазином.
Корзина должна быть доступна с любой страницы сайта и быть расположена в привычном месте, чаще всего это правый верхний угол. Вот небольшая подборка корзин известных интернет-магазинов:
Не стоит делать иконку корзины в виде баннера: в сочетании с другими баннерами и изображениями товаров на странице это сделает ее незаметной (доказанный факт «баннерной слепоты»), особенно если ее место нетипично, например:
Сквозная мини-корзина должна всегда показывать пользователю, какой товар и на какую сумму он уже выбрал. Обязательно должна быть синхронизация с действиями посетителя в реальном времени, то есть при добавлении товара в корзину или удалении в сквозной корзине должен происходить перерасчет суммы и количества позиций.
Что делать, если корзина пуста? На многих сайтах можно встретить надписи «Корзина пуста» или «В вашей корзине 0 товаров на 0 рублей», и это все, чем ограничивается владелец сайта. Иногда корзина без товаров вообще не отображается — так делать точно не стоит.
А ведь самый распространенный вариант состояния корзины (корзина пуста всегда, когда посетитель впервые зашел на сайт и ничего еще не купил) можно использовать на благо нашего магазина.
Один из вариантов отображения пустой корзины: поместите текст сообщения о подарке, который уже лежит в корзине. Получить подарок можно при совершении любой покупки. Это могут быть пробники товаров, сувенирная продукция с вашей символикой или сервисные услуги.
Другой вариант: разместите рядом с пустой корзиной надпись о предоставляемой только сегодня скидке или бесплатной доставке, а если нет желания давать скидки и тратиться на подарки, сделайте ссылку на инструкцию «Как оформить заказ».
Например, здесь акцент на бесплатную доставку при небольшой сумме заказа, и у посетителей перед глазами мотивация купить не меньше чем на 1500 рублей.
2. Страница корзины понятна и проста
Основная отдельная страница корзины должна давать посетителю полную информацию о его покупках и обширный функционал для изменения заказа.
Для страницы корзины лучше использовать структуру таблицы: так легче воспринимать однородную информацию о добавленных товарах. Девиз визуального представления корзины — чем проще, тем лучше. Поэтому используйте стандартные шрифты и простые элементы.
Каждый новый товар должен быть визуально отделен от предыдущего.
Рядом с каждым товаром в корзине лучше разместить его фотографию, наименование и ссылку на страницу с его описанием (с открытием в соседней вкладке браузера).
3. Корзину можно отредактировать
Находясь в корзине, посетитель должен иметь возможность отредактировать выбранные товары без возврата в каталог. Это экономит время пользователя и повышает вероятность того, что он дойдет до оформления заказа. Покупатель может спокойно из корзины удалить товар, добавить или уменьшить кол-во одинаковых позиций, изменить цвет или размер.
При этих изменениях корзина обновляется без перезагрузки страницы, сумма и стоимость доставки пересчитываются автоматически.
Давайте проиллюстрируем этот и предыдущий пункты на примере корзины интернет-магазина ASOS:
1 — Обратим внимание, как корзина допродает товары, предлагая докупить до суммы, недостающей для бесплатной курьерской доставки;
2 — Возможность изменить добавленный товар: его цвет, размер, количество;
3 — Есть фотография товара и ссылка на его описание;
4 — Есть возможность удалить товар.
Также видим табличную простую структуру: все товары отделены друг от друга тонкой линией.
4. Никаких скрытых доплат
Согласно результатам исследований, лидером причин отказа от корзины является внезапное появление дополнительных затрат на финальном шаге оформления заказа. Чаще всего это стоимость доставки. Чтобы не вызвать у посетителя разочарования от потраченного на заполнение форм времени, сообщите ему все дополнительные платежи сверх стоимости товара как можно раньше — не позже, чем на странице корзины, а в идеале раньше, на этапе выбора товаров.
Самый оптимальный для покупателя вариант — бесплатная доставка, и часто именно этот фактор влияет на конечный выбор магазина.
Другие «приятные» сюрпризы, которые может готовить интернет-магазин для посетителя, когда он почти совершил покупку, — это не озвученный ранее более длительный срок доставки или отсутствие товара (в корзину товар добавился, но на деле на складе его не оказалось, и это выяснилось за шаг до ввода данных кредитной карточки). Сообщайте информацию о наличии, примерных сроках доставки до того, как посетитель приступил к оформлению заказа в корзине.
5. Понятная навигация при оформлении заказа
Оформление заказа в интернет-магазине чаще всего реализовано одним из двух вариантов:
- пошаговый мастер из нескольких последовательных страничек;
- одна длинная страница, на которой пользователь видит все товары, а также поля для ввода платежной и адресной информации.
Например, такая реализация у Lamoda:
Оба варианта имеют право на жизнь, однако пошаговый метод более простой и структурированный. Часто спрашивают, какое количество шагов в такой корзине оптимально? Известные специалисты по информационной архитектуре братья Айзенберг утверждают, что если все шаги продуманы и оптимизированы, то их количество непринципиально. Однако не стоит увлекаться и дробить на мелкие шаги — 3–4 этапа вполне хватит.
При использовании пошагового метода посетитель обязательно должен видеть, на каком этапе он находится сейчас, какой этап уже завершен, какой предстоит. Пользователь должен иметь возможность вернуться к любому шагу и изменить данные.
Для того чтобы сделать очевидным движение по такой навигации, лучше добавить кнопку следующего шага на каждом этапе. Старайтесь избегать общих слов на кнопках (например, «Далее»), используйте конкретику будущего действия, например, «Перейти к оплате». Важно, чтобы кнопка перехода на следующий этап располагалась всегда справа, а кнопка возврата назад — слева.
6. Предложите сделать заказ по телефону
Рекомендуем добавить на видное место на странице оформления заказа телефон менеджера и предложение через него оформить заказ (например, через обратный звонок). Это повысит количество совершенных покупок, ведь у многих пользователей при оформлении заказа неизбежно возникают самые разные вопросы, начиная от того, как заполнить форму, и заканчивая опасениями, что заказ вообще не был принят. Уверенность покупателя в том, что при любом затруднении ему помогут в кратчайшие сроки, успешно конвертируется в покупки.
7. Сохраняйте текущее состояние корзины
Многие пользователи не покупают товары с первого посещения магазина, хотят прицениться—присмотреться и используют корзину для хранения понравившихся товаров (что-то наподобие «Избранного»). При этом, не оформив с первого раза заказ, такие пользователи возвращаются на сайт через неделю и с грустью обнаруживают, что корзина пуста. Срок возврата посетителя может колебаться от нескольких дней до нескольких месяцев, поэтому рекомендуем увеличить срок хранения cookies корзин.
8. Отсутствие регистрации
По данным исследований, блокировка оформления заказа обязательной регистрацией в каждом из четырех случаев заканчивается отказом от покупки. Почему так происходит: одни пользователи не хотят плодить очередные пароли и аккаунты, которые впоследствии очень трудно вспоминать, другие не хотят сообщать о себе лишние подробности и т. п.
Самый главный совет — предоставьте покупателю несколько вариантов оформления покупки: с помощью регистрации (в этом случае стоит пояснить, что посетителю она принесет много пользы, например, бонусы и скидки при дальнейших покупках) и быстрая покупка в 1 клик, когда посетитель вводит только свой номер телефона, а дальнейшую информацию обсуждает с менеджером магазина.
Если пользователь выбрал оформление заказа без регистрации, то можно после оплаты и сообщения о том, что заказ поступил в обработку, предложить посетителю зарегистрироваться, чтобы в дальнейшем получать бонусы. Таким образом, посетителю ничего не мешает совершить покупку, и при этом шансы, что он добровольно зарегистрируется (на позитивной волне после совершения покупки), повышаются.
Также рекомендуем добавить авторизацию через социальные сети: из них мы получим часть информации о посетителе, что облегчит дальнейшее заполнение форм.
9. Оптимизируйте формы для заполнения
Количество полей необходимо сократить до необходимого минимума для заказа: не надо идти на поводу у маркетологов и пытаться вместить в оформление заказа целый опрос из серии «Довольны ли вы ассортиментом?» и «Как вам наш новый дизайн?»
Данные, которые можно указать одним полем (например, ФИО или адрес), лучше не разбивать на несколько полей.
Избавьтесь от сложных требований при вводе данных, то есть не надо просить пользователя указать телефон только с пробелами или без 8-ки в начале. Пусть посетитель вводит телефон, как он привык, а задача системы — преобразовать данные в нужный ей формат.
Большое раздражение вызывает у посетителя необходимость снимать галочки с заполненных за него чекбоксов, например, о подписке на новости. Такими ухищрениями вы, конечно, повысите количество подписчиков на рассылку, но останутся ли они лояльны к вашему магазину?
Характерный пример — сайт бесплатных объявлений avito.ru, где за пользователя "заботливо" расставили галочки на покупку дополнительных услуг. Вот такие три услуги мне пришлось «расчекать», чтобы разместить объявление бесплатно:
В интернет-магазинах можно также иногда встретить навязанное дополнительное гарантийное обслуживание и другие платежи. Дайте пользователю самому распорядиться своим выбором и деньгами.
10. Скажите пользователю спасибо. И не только
Вот он, долгожданный момент: пользователь прошел все шаги оформления заказа и нажал «Оплатить». Интернет-магазину нужно показать, что он контролирует весь процесс и никто не скрылся с деньгами посетителя.
Обеспечьте связь действий пользователя с ответом от сайта: отправьте на электронную почту сообщение о том, что заказ принят, оплата получена и все в порядке. Если клиент указал только телефон, убедитесь, что консультанты сразу же ему перезвонили, или укажите время возможного звонка. Доверие к магазину и уверенность в его хорошей репутации возрастают в разы, когда посетителю перезванивают через 10 секунд после того, как он получил сообщение о том, что покупка совершена. Такой магазин хочется рекомендовать друзьям и знакомым.
Заключение
В статье мы постарались охватить ключевые моменты при проектировании процесса оформления покупок, и это всего лишь небольшая часть рекомендаций, которые можно дать.
А какие советы из личного опыта по странице корзины и процессу оформления заказов дали бы вы? Делитесь своим опытом в комментариях к статье.
Статьи выпуска: