Содержание
Идеальная корзина, или «не заставляйте меня думать» — Дизайн на vc.ru
Начнём с того, что ничего идеального в этом мире не существует. Однако нет предела совершенству, поэтому стремиться к идеалу, бесспорно, необходимо.
18 660
просмотров
Корзина в интернет-магазине — один из важнейших элементов, от оформления и функциональных возможностей которого напрямую зависят продажи.
Сам ресурс может быть удобным, современным и привлекательным, однако при плохо продуманной корзине все это не имеет никакого значения.
Наиболее частой проблемой, связанной с количеством заказов (если, конечно, не брать в расчет отсутствие посещаемостиッ), является брошенная корзина. Покупатель кладет товар в корзину, переходит к оформлению, а затем покидает сайт, так и не совершив покупку.
Как? Почему? За что?
Чтобы решить эту проблему, нужно проанализировать поведение пользователей, также необходимы эффективные изменения корзины покупок.
«Не заставляйте меня думать» — первый закон юзабилити.
Стив Круг
Все придумано до нас, или не изобретайте велосипед
За время существования Рунета сайты эволюционировали от простых невзрачных одностраничников до гигантских каталогов с красочным дизайном и сотнями функциональных решений.
И на современном этапе развития e-commerce мы пришли к тому, что пользователь, заходя в интернет-магазин, ожидает увидеть определенный набор элементов и функций, которыми он уже пользовался на других ресурсах.
Другими словами, вероятность того, что на ваш сайт зайдет пользователь, который ни разу до этого не совершал покупки в интернет-магазинах, ничтожно мала.
Поэтому необходимо придерживаться определенных негласных правил, сформировавшихся на основе так называемого пользовательского опыта.
И начнем мы не со страницы самой корзины, а с ее внешнего представления.
Расположение корзины
Многие магазины в попытке выделиться среди конкурентов размещают корзину в необычных местах: в сайдбаре или контенте, делают ее плавающей в правом нижнем углу и так далее. Как лучше сделать:
Не мудрите с расположением корзины. Она должна находиться там, где ее ожидают увидеть посетители, а именно — в правом верхнем углу.
Расположение корзины на сайте интернет-магазина «Эльдорадо»
Расположение корзины на сайте интернет-магазина «Озон»
Расположение корзины на сайте интернет-магазина «Дочки-сыночки»
Всплывающий блок корзины
Хорошим решением является блок, всплывающий при наведении на иконку корзины на любой странице сайта.
Блок всплывает, если в корзину добавлен какой-либо товар.
Это своего рода мини-корзина, которая призвана решать ряд определенных задач, а именно — дать пользователю возможность:
ознакомиться с содержимым корзины;
изменить количество того или иного добавленного в корзину товара.
удалить ненужный товар;
узнать итоговую сумму покупок;
О последних двух пунктах подробнее.
Удаление товаров и изменение их количества
Исключение товара из списка покупок должно происходить быстро и безболезненно.
Предоставьте пользователю возможность удалить товар из корзины, не переходя в раздел.
Удаление товара из корзины без перехода в раздел.
Кроме удаления, рекомендуем реализовать управление количеством добавленных товаров.
Управление количеством добавленных товаров
При осуществлении манипуляций с товаром (добавление/удаление/изменение количества) в корзине посредством всплывающего окна, сумма заказа, а также содержимое корзины должны меняться с лёту.
Также очень важна реализация удаления товара со страницы самой корзины, но об этом поговорим ниже.
Покажите действие
Бывает так, что заходишь в интернет-магазин, выбираешь товар, нажимаешь кнопку «Добавить в корзину» и… ничего не происходит. Непонятно, добавился товар или нет.
Чтобы у посетителя не возникло вопросов, покажите, что товар теперь добавлен в корзину.
Реализовать это можно так:
«Летящий» в корзину товар.
Анимация перемещающегося в сторону корзины товара:
2. Смена надписи/цвета на кнопке, либо и то и другое вместе.
Визуальное оформление добавления товара в корзину
3. Всплывающее окно.
После добавления товара в корзину появляется уведомление во всплывающем окне об успешно совершенном действии. Обычно в этом окне также предлагается продолжить покупки или перейти к оформлению заказа.
Как это выглядит:
Уведомление об успешно совершенном действии. Пример 1
Еще пример:
Уведомление об успешно совершенном действии. Пример 2
Любое другое действие, однозначно дающее понять, что товар отправился в корзину.
Перейдем на страницу корзины.
Тут есть 2 варианта:
1. Пользователь попадает на страницу корзины (не оформления заказа), где он видит список добавленных товаров и цену, может удалять товар, менять количество, а также совершать ряд других действий. После того как покупатель решает, что список его покупок больше не требует никаких изменений, он переходит на следующую страницу — непосредственно к оформлению заказа.
Пользователь попадает сразу на страницу корзины
2. Пользователь попадает на страницу корзины (она же является страницей оформления заказа). В верхней части страницы располагается список товаров, под ним — шаги оформления заказа. При такой реализации советуем разбить страницу на логические блоки. Это можно сделать, например, с помощью нумерации или выделения блоков цветом.
Пользователь попадает на страницу оформления заказа.
Оба варианта имеют право на существование. В интернете можно найти массу примеров реализации как первого, так и второго. Какой из них лучше подходит именно вам, можно понять только путем тестирования.
Стоит отметить, что существуют и другие варианты реализации, основанные на первых двух. Например, когда оформление заказа разбито на шаги, находящиеся на разных страницах. Шагов может быть любое количество, но чем меньше, тем лучше: оптимально — от двух до четырех.
Пример:
Корзина – Выбор доставки – Выбор оплаты – Подтверждение заказа
Или:
Последовательность шагов оформления заказа. Пример 1
Еще пример:
Последовательность шагов оформления заказа. Пример 2
В случае использования пошаговой корзины обязательно указывайте шаги оформления заказа, чтобы покупатель понимал, на каком этапе он находится и сколько шагов остается до завершения покупки.
Независимо от того варианта, который используете вы, советуем придерживаться описанных ниже правил.
Отсутствие обязательной регистрации
Не заставляйте пользователя проходить обязательную авторизацию или регистрацию, для того чтобы он мог сделать заказ. Такой вариант могут позволить себе только крупные игроки.
Авторизация для совершения заказа
Предложите пользователю выбор: регистрироваться или нет.
Вариант с отказом от авторизации для совершения заказа
А еще лучше создайте аккаунт покупателя автоматически, выслав доступы с информацией о заказе на указанный пользователем email или телефон.
Соблюдение последовательности шагов
Шаги оформления заказа должны быть выстроены в правильном порядке.
Пример: пользователь хочет сделать заказ и забрать его из пункта самовывоза, но при оформлении в качестве первого шага ему предлагается заполнить форму, где обязательными являются поля адреса и почтового индекса.
Логичный вопрос: зачем оставлять свой адрес, если хочешь забрать заказ самостоятельно?
Не заставляйте покупателя вводить лишнюю информацию или выбирать какие-то обязательные опции, ненужные для оформления его заказа.
Сюда же стоит отнести пункт об автоматическом заполнении полей, если пользователь авторизовался на сайте.
Автозаполнение полей
Кроме того, стоит позаботиться о верном формате полей. Особенно это актуально для покупателей, совершающих заказ с помощью мобильного телефона.
Для поля ввода телефона это формат type=”tel”, для поля ввода email-адреса — type=”email”.
Ну вот, все сломалось…
Предусмотрите все варианты развития событий. Как говорится, если пользователь может что-либо сломать, он обязательно это сделает.
Тестируйте свою корзину, оформляя разные заказы: с регистрацией и без; с ПК, планшета и мобильного телефона; с выбором различных способов доставки, оплаты и других опций. Только так можно найти функциональные и логические ошибки. А если они есть, их обязательно найдут реальные покупатели, что может привести к потере заказов, а, соответственно, и дохода.
Что должно быть внутри
Теперь поговорим о наполнении страницы корзины.
Обязательно добавить:
Возможность перейти на страницу добавленного в корзину товара. Название товара является ссылкой на страницу этого товара — все просто.
Блок с информацией об итоговой сумме заказа с учетом доставки, скидки и прочих параметров.
Выбор количества позиций.
Изображение товара.
Цену каждого добавленного товара.
Возможность удалить товар из корзины. Как уже говорилось выше, это должно быть просто и интуитивно понятно.
- Автоматический пересчет суммы при удалении или добавлении товара, а также при изменении количества.
Обязательные элементы корзины
Блоки сопутствующих товаров
Очень хорошо работает вариант комплекта, когда 2 товара и более из списка рекомендаций + уже добавленные в корзину обойдутся покупателю немного дешевле, чем по отдельности.
Обратите внимание: товары должны быть действительно сопутствующие. Если покупатель добавил мобильный телефон, не нужно ему предлагать купить дополнительно стиральную машину. Предложите ему чехол или беспроводную зарядку.
Что желательно сделать:
Добавить кнопку быстрого оформления заказа. Дайте клиенту возможность сэкономить время, позволив ему ввести лишь имя и телефон. Также время пользователя сэкономит кнопка «Купить в 1 клик», расположенная в карточке товара.
Функционал «Купить в 1 клик»
Дарить подарки. Вариантов масса: подарок при заказе выше определенной суммы, самостоятельный выбор подарка покупателем, бесплатная доставка и т. д. Это не только улучшает конверсию, но и увеличивает средний чек.
Подарки при оформлении заказа
Промокоды для покупателей
Способы доставки и оплаты
Дать для заполнения минимум полей. Имя, телефон, email — этого должно быть достаточно для оформления заказа, а все остальное может уточнить менеджер при подтверждении.
Минимальный набор полей для оформления заказа
Сохранять товары пользователя с помощью cookies. Причин, по которым покупатель оставил корзину, так и не оформив заказ, может быть масса. Вспомнить о незавершенном заказе он может как через час, так и через несколько дней. Не заставляйте потенциального клиента начинать собирать корзину заново.
Предоставить на выбор больше способов доставки и оплаты.
- После того как заказ оформлен, выслать на email клиента следующую информацию: состав заказа, дата доставки, данные для отслеживания, любые другие инструкции, которые могут быть полезны покупателю.
Итоговая информация для клиента после оформления покупки
А в идеале еще и в СМС отправлять номер заказа, дату доставки, телефон поддержки.
Уведомляйте покупателя об изменении статуса заказа. Например, о том, что заказ передан курьеру, или о том, что заказ прибыл в пункт самовывоза. Так клиент поймет, что его заказ в обработке, и сам не забудет о нем.
Сделать страницу корзины отзывчивой. Добавьте подсказки там, где это необходимо.
- Кратко рассказать о гарантиях и возврате. Добавьте иконки платежных систем и укажите, что оплата через сайт безопасна. При этом не забудьте разместить на сайте реквизиты организации, сертификаты на продукцию и прочую информацию, которая может повлиять на доверие покупателей.
Но будьте аккуратны, не переусердствуйте с количеством информации, ведь главная цель страницы — оформление заказа.
Вывод
Необходимо, чтобы корзина в интернет-магазине работала без сбоев 24/7. Для этого нужно постоянно мониторить ее работоспособность. В идеале — тестировать с помощью фокус-групп.
Не лишними будут и постоянные улучшения, но обязательно после проведенных тестов.
И, конечно же, советуем анализировать поведение пользователей на всех этапах работы с интернет-магазином, особенно на этапе оформления заказа. Ведь уменьшение количества брошенных корзин всего на 1% может существенно сказаться на выручке в положительную сторону.
Ведущий SEO-специалист компании RACURS
что это, как ее сделать — правильное оформление и функционал
Получи нашу книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».
Подпишись на рассылку и получи книгу в подарок!
Корзина заказов в интернет-магазине — это интерфейс, куда пользователь может добавлять товары, которые он собирается купить.
Простой пример: когда вы ходите по гипермаркету, то в руках носите корзинку, в которые складываете понравившиеся товары. На кассе вы можете за них расплатиться, и при этом становитесь их полноценным хозяином. В Интернете на сайтах, которые занимаются продажами, существуют подобные корзинки.
Бывает, что посетитель приходит в интернет-магазин, но уходит без покупок, зачастую бросая наполненную интернет-корзину. Причина этого часто кроется в непонятных ее функциях и сложностях при оформлении. Рассмотрим правила оформления идеальной веб-корзины на сайте.
Корзина заказов для сайта — как ее оформить
Для того чтобы посетитель мог сделать заказ через веб-корзину, ее следует отображать привычно для него.
- Расположение — в шапке сайта, идеально — в правом верхнем углу.
- Иконка — интуитивно понятная, похожая на корзинку или сумку.
- Иконка не должна быть похожа на баннер — подобные изображения “фильтруются” взглядом пользователя.
- В верхнем углу интернет-магазина рядом с иконкой отображается количество товаров, которые лежат в корзине, и их общая стоимость.
- Если в интернет-корзину добавлен хотя бы один товар — ее значок меняется на другой, уведомляющий, что в ней есть товар.
Примеры неудачно размещенных корзин
Веб-корзины, как таковой, нет. Есть какой-то личный кабинет, функции которого не понятны. Реализация подобного механизма покупки оттолкнет многих потенциальных клиентов.
Корзинка расположена не на привычном месте, к тому же она представлена в виде крупного навязчивого баннера — возможно, включится, “баннерная” слепота пользователя. К тому же, выглядит это довольно некрасиво.
Корзинка незаметная, так как нет иконки. Зато есть непонятная иконка “воронка”, которая отвлекает внимание от заказа.
Интернет-корзина на главной странице не отображается, и появляется только в момент выбора платка.
Механизм корзины — основные функции
После того, как посетитель выберет необходимые изделия, он должен перейти в интернет-корзину и оформить заказ.
Иконка в правом верхнем углу:
- Картинка должна быть интуитивно понятной: корзинка, тележка, сумка и т.п. Не каждый человек поймет жест поднятого вверх пальца (“Ok”) или утвердительно кивающего человечка как приглашение к покупке.
- Иконка должна быть доступной на всех страницах сайта и находиться на одном и том же месте.
Внутри корзины:
- В веб-корзине покупатель может работать с изделиями: просматривать, изменять варианты и количество, удалять, добавлять.
- Корзина должна выдавать стоимость каждого товара отдельно, а также общую сумму товара.
- Если магазин работает со скидочными купонами — то у посетителя должна быть возможность ввести код купона и увидеть цену изделий со скидками.
Как правильно реализовать функционал корзины
Приглашение к покупке:
- Кнопка покупки рядом с товаром должна указывать на действие: “заказать”, “купить” и т.п. Если она содержит текст типа “хочу” — то это может быть интерпретировано, как обычное пожелание, но никак не покупка.
- Если кнопка совершения покупки не содержит текст — она должна быть заметной, крупной и иметь понятную иконку.
- Кнопка “Купить” должна размещаться на всех страницах сайта, где представлен продукт: как на блоках с кратким описанием (сам каталог), так и при переходе на страницу товара.
- Если человек пытается положить в корзину товар, который там уже есть — то кнопка “купить” должна меняться на “товар уже в корзине”.
Управление заказом:
- В самой корзине человек не должен запутаться. К примеру, если он желает увеличить количество изделий, то простые кнопки “+” и “-” должны помочь ему в решении данного вопроса.
- Человек в любой момент должен иметь возможность вернуться из механизма заказа в сам интернет-магазин.
- Кнопка возврата должна быть заметной и яркой.
- Хорошим функционалом будет указание стоимости доставки прямо в корзине.
- После оформления заказа “вежливый” интернет-магазин всегда благодарит своего покупателя.
Дополнительные возможности:
- Информацию о возврате покупок желательно продублировать в момент заказа.
- Уместным виджетом является показ сопутствующих изделий и функция “откладывания” понравившегося товара.
- Если человек не совершил покупку вчера, и пришел на сайт “сегодня” — в корзине должен остаться выбранный товар.
Запрос данных покупателя
Заполнение формы с данными
Длинные анкеты отрицательно влияют на факт совершения покупки, и принудительная подписка ее срывает. Двадцать полей формы, трудная каптча, подтверждение пароля по e-mail, несколько сменяющихся страниц влекут за собой “бегство” покупателя из корзины. Ваших конкурентов в Интернете очень много, а времени у покупателей мало. Поэтому покупатель уйдет от вас в тот интернет-магазин, который не будет требовать от него расширенных адресных данных.
Главный принцип — минимум полей
- Если вы осуществляете продажи только по России — не заставляйте покупателей выбирать страну.
- Возможно, разные адреса покупателя и доставки не нужны. Запрашивайте один адрес.
- Если необходим ввод простых данных — не утруждайте покупателя выбором из готовых вариантов. Иногда проще такие данные ввести вручную. К примеру, проще написать “Воронеж”, чем выбирать город из длинного списка предложенных вариантов.
- Не подписывайте человека принудительно на вашу рассылку.
Подписка на рассылку
Каждому продавцу хочется получить больше сведений о клиенте и подписать его на email-рассылку. Потом полученные данные можно использовать для уведомления об акциях, скидках и других интересных предложениях магазина. К сожалению, некоторые интернет-магазины подписывают покупателей на рассылку принудительно, причем, в письмах не предусмотрен функционал отписки от рассылки. Данные действия наказываются хостерами. Перед тем, как подписать человека на рассылку, магазин должен получить его осознанное согласие, а в каждом письме должна быть ссылка отписки от рассылки.
Виды покупок в интернет-магазине
На странице оформления следует создать три уровня покупки по сложности:
- Быстрый — вводится e-mail или телефон, и вся дальнейшая работа происходит с менеджером. Если реализована возможность покупки в один клик — то посетитель не должен испытывать трудности, связанные с вводом лишних данных. К примеру, он может выбрать только 1 товар, нажать “купить в 1 клик”, и автоматически перейти к форме заказа.
- Новый пользователь — после предложения регистрации предлагаются поля для ввода: ФИО, адрес, емейл, телефон, способы оплаты и доставки.
- Зарегистрированный пользователь — человек входит под своим логин-паролем, и все его данные подставляются в форму автоматически.
Длительное отсутствие ответа менеджера интернет-магазина покупатели оценивают как оскорбление и неуважение к его времени. Поэтому необходимо предусмотреть моментальное уведомление менеджера о заказе. Это позволит ему мгновенно связаться с покупателем и подтвердить заказ.
Корзина — ATH Import
- Дом
ATHome
- Органайзеры для дома
- Тележки для покупок
Шеф-повар для гурманов
- Горшки для соуса и бульона
- Жаровни, фритюрницы и сковороды
- Набор посуды
- Другая посуда
Триммер
- Весы для ванной
- Органайзеры для ванной
- Сиденья для унитазов
- О нас
- Консультационные услуги
- Свяжитесь с нами
- Условия продажи
- Журнал ВРЕМЯ
- Выставки
- США сегодня
- Войти
- Создать учетную запись
Сортировать по
ПопулярныеЛучшие продажиПо алфавиту, от A до ZПо алфавиту, от Z до AЦена, от низкой к высокойЦена, от высокой к низкойДата, от новой к старойДата, от старой к новой
ATHome Large Deluxe Rolling Utility / Тележка для покупок — убираемая складная сверхмощная тележка с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, красный
Обычная цена
59,99 $
Распродажа $44,98
ATHome XXLarge Deluxe Rolling Utility / Тележка для покупок — убираемая складная тележка для тяжелых условий эксплуатации с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, черного цвета.
Обычная цена
129,99 $
Распродажа $79,99
ATHome Large Deluxe Rolling Utility / Тележка для покупок — убираемая складная тележка для тяжелых условий эксплуатации с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, синий
Обычная цена
59,99 $
Распродажа $44,98
Недоступен
Продано
ATHome Small Deluxe Rolling Utility / Тележка для покупок — убираемая складная сверхмощная тележка с колесами на металлической раме для перевозки белья, бакалейных товаров, игрушек, спортивного инвентаря, красная
Обычная цена
49,17 $
Распродажа $36,98
ATHome Large Deluxe Rolling Utility / Тележка для покупок — убираемая складная тележка для тяжелых условий эксплуатации с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, (красный, XL)
Обычная цена
99,99 $
Распродажа $64,98
ATHome Large Deluxe Rolling Utility / Тележка для покупок — убираемая складная тележка для тяжелых условий эксплуатации с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, черный
Обычная цена
59,99 $
Распродажа $44,98
Складной вкладыш для тележки ATHome с закрывающейся крышкой — водостойкий и устойчивый к плесени, сверхпрочный, дышащий вкладыш для перевозки белья, продуктов, игрушек, спортивного инвентаря, 24 x 17,25 x 15 дюймов, черный
Обычная цена
20,77 $
Распродажа $12,98
Недоступен
Продано
ATHome Large Deluxe Rolling Utility / Тележка для покупок с корзиной — убираемая складная сверхмощная тележка с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, красная
Обычная цена
62,99 $
Распродажа $46,98
Недоступен
Продано
ATHome Medium Deluxe Rolling Utility / Тележка для покупок — убираемая складная сверхмощная тележка с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря, красный
Обычная цена
50,77 $
Распродажа $38,98
ATHome Large Deluxe Rolling Utility / Тележка для покупок — убираемая складная тележка для тяжелых условий эксплуатации с резиновыми колесами для перевозки белья, продуктов, игрушек, спортивного инвентаря (синяя, XL)
Обычная цена
99,99 $
Распродажа $64,98
Недоступен
Продано
НОВИНКА — тележка для покупок на лестнице
Обычная цена
79,99 $
Распродажа $49,99
Экологичный складной вкладыш для тележки ATHome с закрывающейся крышкой — водостойкий и устойчивый к плесени, сверхмощный, дышащий Тележка для стирки белья, продуктов, игрушек, спортивного инвентаря, красный
Обычная цена
20,77 $
Распродажа $12,98
{{имя}}
{{#если вариант}}
{{вариант}}
{{/если}}
{{#характеристики}}
{{#каждое это}}
{{#если это}}
{{@key}}: {{это}}
{{/если}}
{{/каждый}}
{{/характеристики}}
{{ продавец }}
{{#если применяются скидки}}
{{{originalLinePrice}}}
{{{linePrice}}}
{{еще}}
{{{linePrice}}}
{{/if}}
{{#если применяются скидки}}
{{#каждая скидка}}
{{ this. title }}
{{/каждый}}
{{/если}}
{{/предметы}}
Загрузка…
Предмет добавлен в ваш список желаний.
×
Тележки для покупок — Grainger Industrial Supply
Тележки для покупок
9 продуктов
Тележки для покупок используются покупателями для хранения товаров, которые они хотели бы приобрести, когда они делают покупки в супермаркетах, универмагах и других местах розничной торговли. Эти колесные тележки также иногда используются для хранения, комплектования заказов и перевозки сыпучих грузов в таких местах, как школы, медицинские учреждения, склады, производственные предприятия.
Вместительные покупательские тележки
Платформенные покупательские тележки
Двухъярусные покупательские тележки
Складные покупательские тележки
3
07
07
07
Тележки для покупок большой вместимости
Тележки для покупок большой вместимости , отсортировано по грузоподъемности, по возрастанию
Загрузка. .. |
Платформенные тележки для покупок
Вставная платформа с задней корзиной
Платформа Тележки для покупок Встраиваемая платформа с задней корзиной, отсортировано по грузоподъемности, по возрастанию
Загрузка… |
Нестабильная платформа с откидной корзиной
Платформа Тележки для покупок Нестабильная платформа со складной верхней корзиной, отсортировано по грузоподъемности, по возрастанию
Загрузка. |