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

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

Оглавление.

  1. Зачем вообще все это?
  2. Типы оформления заказа;
  3. Оптимизация оформления заказа;
  4. Запрашиваем данные с покупателя;
  5. 2 рабочих варианта реализации;
  6. Аналитика;
  7. Заключение и небольшой подарок!

Зачем вообще все это?

Перед тем как мы начнем, давайте ответим на вопрос зачем вообще оптимизировать процесс оформления заказа в интернет магазине:

  1. Сделать процесс простым для посетителя;
  2. Начав оформление заказа, не дать посетителю прервать его;
  3. И, самое главное, увеличить конверсию по этому процессу.

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

Типы оформления заказа

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

1. В несколько шагов

Наиболее распространенный вариант, который по умолчанию встроен в большинство CMS для интернет магазина. Функционально прост и тривиален: на странице корзины есть кнопка “Оформить заказ”, при нажатии на которую покупатель начинает оформление заказа за несколько шагов. Для каждого типа запрашиваемой у покупателя информации есть свой шаг.

type1

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

2. В один шаг

Второй по популярности вариант, крайне редко встречается в CMS по умолчанию, хотя легко добавляется с помощью модулей. При нажатии кнопки “Оформить заказ” в корзине, покупателю предлагается заполнить все данные на одной странице вместо нескольких.

type2

Все данные собираются на одной странице;
Оптимальное решение для большинства интернет магазинов;
Если на одной странице запрашивается слишком много данных, это может отпугнуть покупателя. Поэтому необходимо оптимизировать количество полей (будет рассмотрено ниже).



3. На странице корзины

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

type3

Все данные собираются на одной странице с корзиной;
Лучше всего работает с минимальным набором полей на странице (см. скриншот выше)
Аналогично если на одной странице запрашивается слишком много данных, это может отпугнуть покупателя. Аналогично необходимо оптимизировать и снизить количество полей для заполнения.

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

Какой же из трех вариантов выбрать?

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

Оптимизация оформления заказа интернет магазина

В этой главе я подскажу вам наиболее простые и элегантные решения (остальные, более функциональные решения, я внедряю только по своей уникальной методике). Только не забудьте их внедрить, а не просто прочитать и отложить “на завтра” Улыбка.

Нам много не надо! Снижаем нагрузку на покупателя

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

Давайте подумаем какую информацию на сайте необходимо собирать, а какую вовсе необязательно?

Тип данных

Необходимость запроса на сайте

Фамилия и Имя Необходимо.
Отчество Необязательно, можно уточнить по телефону. Требуется для отправки почтового отправления.
E-mail Необходимо для отправки данных заказа и добавления в подписчики.
Телефон Необходимо для контакта с покупателем.
Индекс Необязательно, оператор может уточнить самостоятельно по адресу.
Город Желательно. Для понимания часового пояса покупателя.
Адрес Необходимо. В одно поле. Если есть самовывоз, автоматически подставляйте адрес самовывоза в это поле при его выборе.
Страна Необязательно. Требуется только при работе на несколько стран.
Комментарий к заказу Необходимо.

Таким образом необходимо запрашивать следующие данные:

  1. Фамилию и Имя.
    Пример: “Андрей Родионов
  2. E-mail.
    Пример: hello@idivpered.ru
  3. Телефон:
    Пример: “+7-123-456-78-90
  4. Адрес для курьерской или почтовой доставки:
    Пример: “Санкт-Петербург, Невский пр, дом 1, кв 1”. Предлагать заполнять в одно поле, не следует делать отдельное поле для улицы, отдельное для дома и отдельное для квартиры.
  5. Комментарий к заказу.

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

  • Связаться с покупателем;
  • Внести его в базу подписчиков;
  • Отправить заказ.

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

Сравним:

comparison

 

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

Вариант №1. Просто и со вкусом.

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

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

 

solution1

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

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

Вариант №2. Стильно и функционально.

Если в первом варианте у нас вся информация собиралась в одном месте, то во втором варианте мы с вами попробуем разделить сбор данных и сделать его более наглядным.

Шаг 1. И начнем со сбора данных покупателя. Учтем опыт первого варианта и много просить не будем Улыбка

solution_2_client_data

Шаг 2. Выбор способа доставки.

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

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

kak_dostavit

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

А вот так самовывоз:

samovivoz

Доставка Почтой России:

russian_post

Согласитесь, что вся эта информация, выведенная без вкладок, не читалась бы так легко. А так все выглядит чистенько и аккуратно.

Шаг 3. Выбор способа оплаты.

Здесь тоже постараемся сделать все максимально просто и наглядно.

solution_2_payment

Теперь посмотрим как все будет выглядеть в сборе.

solution_2_full

Уютно выглядит, правда? Улыбка

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

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

Аналитика формы отправки заказа

Рекомендую начать оптимизацию вашей формы заказа именно с аналитики и трезво оценить текущую ситуацию.

В этом нам помогут два незаменимых инструмента:

  1. Google Analytics. Визуализация последовательностей.
  2. Яндекс.Метрика. Вебвизор + Аналитика Форм.

Google Analytics

В этой системе мы будем использовать “Визуализацию последовательностей”. Подобное отслеживание будет наиболее эффективно для интернет магазинов с оформлением заказа в несколько шагов. Выглядеть это будет примерно следующим образом (кликните по изображению для увеличения):

google_analytics_визуализация_последовательностей

На изображении выше показаны несколько шагов оформления заказа от корзины до страницы “Спасибо за покупку”. Как думаете, почему на предпоследнем шаге такое большое количество отказов?

Что вам даст эта статистика:

  1. Понимание с какого шага уходит покупатель;
  2. Понимание куда уходит покупатель из оформления заказа.

Как настроить подобный инструмент рассказано здесь.

Яндекс.Метрика

Многие слышали про Вебвизор, но не все слышали про Аналитику Форм. Для того чтобы велось отслеживание этой статистики, у вас должен быть включен ВебВизор и внедрен соответствующий код Яндекс.Метрики на сайт. Взгляните на пример отчета по одному шагу оформления заказа (клик для увеличения):

form_analytics_yandex_metrika

Что вам даст эта статистика:

  1. Она поможет вам понять на каких формах ваши посетители “спотыкаются”;
  2. Какое конкретно поле вызвало затруднения у посетителя?
  3. По этому отчету вы, например, сможете понять с какого поля чаще всего уходят со страницы. Думаю, что не стоит объяснять что вам может дать подобная информация Улыбка

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

Заключение

Сегодняшняя статья раскрыла для вас один из самых простых путей увеличения конверсии вашей страницы оформления заказа. Рассмотрим ваши дальнейшие варианты действий:

  1. Бездельникам. Ничего не делать и наслаждаться текущими показателями конверсии;
  2. Начинающим. Провести аналитику больных мест оформления заказа и подготовить список изменений;
  3. Опытным. Провести аналитику, подготовить ТЗ на изменения, дать задачу программисту;
  4. Профессионалам. Провести аналитику, подготовить ТЗ на изменения, дать задачу программисту, отследить выполнение и провести аналитику по обновленной странице.

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


26.09.2013 Мини аудиты

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

Wool day.

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

Учетная запись.
Как вы считаете, не слишком ли много на один небольшой участок вариантов оформления заказа?

woolday_1

Не уверен, что предлагаю оптимальное решение для вашей ситуации, но мое ощущение, что на скриншоте ниже все выглядит несколько чище:

woolday_2

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

  1. “Почтовый ящик” переименовать в E-Mail
  2. “Имя Отчество” и “Фамилия” объединить в одно и назвать “Имя”
  3. Если очень хочется спросить дату рождения, то оставьте только день и месяц. Не все любят сообщать год рождения.
  4. Зачем вам 2 рассылки? Какая мотивация подписаться на 2 рассылки?

woolday_3

Следующий шаг.

  1. Хорошо бы этот шаг объединить с предыдущим чтобы при виде пустых полей у покупателя не возникало негативных мыслей
  2. Индекс желательно убрать или как минимум сделать НЕобязательным для заполнения
  3. Согласно странице “Доставка”, вы доставляете по всей России. Так зачем еще раз предлагать страну?
  4. Что вам даст заполнение региона? Его же можно узнать самостоятельно.
  5. Кнопка “Сохранить” приводит к тому, что наконец-таки стало возможно выбрать тип оплаты. Можно отказаться от подобного нетривиального способа?
  6. Если я уже изъявил желание оформить без регистрации, зачем вы снова предлагаете “Войти в аккаунт”?

woolday_4

Способы доставки.

  1. Не сразу понятно, что самовывоз бесплатный. Напишите “Бесплатно” или “0 руб.”

woolday_5

Способы оплаты.

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

woolday_6

Пользовательское соглашение.

  1. Вот это настоящий “убийца конверсии” в подавляющем большинстве случаев. Вердикт: убрать.

woolday_7

Резюме.
Используйте тот набор полей и рекомендаций, который я описываю в этой статье и старайтесь не перегружать станицу. И не забудьте поделиться с нами изменениями Улыбка



Похожие статьи:

Метки:

Подпишитесь на обновления блога

Новые статьи сразу вам на email! Бонусом 30 практических советов для новичка или владельца интернет-магазина!
Они экономят деньги. И время.

29 Комментарии Ваш комментарий

  1. Dr.Tsuker #

    30.08.2013 в 4:49

    Андрей, доброе утро! Я первый желающий, если не возражаете. Магазин http://woolday.ru.

    • Андрей Родионов #

      30.08.2013 в 6:49

      Ок, принято! Осталось одно место :)

    • Алексей #

      25.09.2013 в 18:40

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

    • Андрей Родионов #

      26.09.2013 в 9:57

      Обновил статью с вашим аудитом. Прошу ознакомиться и прокомментировать!

  2. Назар Токарь #

    30.08.2013 в 7:04

    День добрый
    сайт http://www.mebel-nova.ru
    Спасибо

  3. Полина #

    30.08.2013 в 9:10

    Супер, в новой версии магазина попробуем так сделать!

    • Андрей Родионов #

      30.08.2013 в 10:34

      Полина, потом обязательно покажите мне что получилось. А если будут вопросы, то вы не стесняйтесь писать – я помогу!

  4. Али #

    30.08.2013 в 20:25

    Корзина – это 80% магазина.
    У меня 70% людей покидают корзину. Начали ее переделывать, на следующей неделе будет готов окончательный вариант.

  5. Айдар #

    30.08.2013 в 21:13

    О спасибо!
    Как раз вчера всю ночь проектировал корзину для одного магазина. Столкнулся с тем что вся страница перегружена информацией. Сегодня открыл ридер и увидел ваше решение. Гениально!

  6. Антон #

    31.08.2013 в 16:57

    Было бы здорово, если по результатам анализа тех двух сайтов, вы сделали небольшую статью или апдейт с комментариями и примерами )

  7. Артур #

    11.09.2013 в 19:42

    Андрей, в чем может быть проблема? Вебвизор включен, но по форме нет никаких данных. Есть данные только по странице http://tubeteiki.com/login

  8. Dr.Tsuker #

    26.09.2013 в 19:12

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

    Про учетную запись, поле “Имя Отчество” и Самовывоз даже не думал, глаз видимо замылился. Весьма резонно.

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

    И уж, если не сложно – помимо оформления заказа и подтормаживания больше ничем не огорчил сайт в плане дизайна и навигации?

    • Андрей Родионов #

      26.09.2013 в 19:33

      Пожалуйста! Как уже отмечали, сайт производит приятное впечатление, но некоторые процессы типа оформления заказа нетривиальны :)
      Искренне верю, что вы примете к сведению хотя бы часть моих рекомендаций и потом поделитесь результатом!

  9. Анатолий #

    04.11.2013 в 3:50

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

  10. Виктор Соколов #

    28.12.2013 в 17:42

    А форму, которую вы внедряете в детский магазин сами пишете, в какой программе? Или используете какой-то сервис типа ecommtools или e autopay? И

  11. Игорь #

    23.02.2014 в 10:01

    Да, все, что написано сдесь – правильно. Я к этому дошел сам методом “тыка”.
    Хотелось бы знать мнение автора про мой сайт.

  12. Оксана #

    09.03.2014 в 13:16

    Добрый день! Спасибо за статью!
    После прочтения остался вопрос, нужно ли после оформления заказа его подтверждение? Сейчас сама пишу ТЗ. Во многих интернет-магазинах, где мне самой доводилось покупать, есть страница подтверждения заказа с текстом: Проверьте данные, если всё верно, нажмите кнопку «Отправить заказ», а если вы нашли ошибки в заполнении данных, нажмите кнопку «Вернуться и исправить».
    При нажатии «Отправить заказ» появляется текст: «Заказ оформлен. Мы свяжемся с вами в ближайшее время».
    Как считаете, это необходимо или лишнее? А если пользователь ошибется в собственном номере телефона?

    • Андрей Родионов #

      07.04.2014 в 15:05

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

  13. Виталий #

    19.03.2014 в 7:58

    Приветствую Андрей,
    Для аналитики форм в метрике должны быть внедрены какие то специальные коды? на каждой странице? Или общий код метрики на сайт?

  14. Елена #

    27.03.2014 в 17:41

    Андрей,
    Спасибо за такой четкий и структурированный подход. Очень доходчиво )
    Если будет возможность, посмотрите и наш сайт, пожалуйста.

  15. Александр #

    25.05.2014 в 13:57

    Андрей, добрый день! Посмотрите сайт tekstil-grad.ru
    Спасибо )

Ваш комментарий



Андрей Родионов
Автор блога
 
Об авторе
Запуск
Вашего интернет-магазина
С юридической гарантией окупаемости

Узнать подробности