Апгрейдим страницу оформления заказа, чек-лист. Форма оформления заказа для сайта


Чек-лист для страницы оформления заказа

Люди приходят в интернет-магазин разными путями: одни попадают прямиком на карточку товара из результатов поиска, другие переходят на список товаров с рекламы, третьи набирают адрес магазина напрямую в адресной строке и т.д. Точек входа много. Чтобы точка входа не стала сразу же и точкой выхода, нужно постоянно работать над сайтом: как над его контентом, так и над его удобством (юзабилити). Обзорная статья по основным пунктам юзабилити сайта есть тут. Она о факторах, применимых ко всему сайту в целом.

Сегодня же поговорим не о начальной точке знакомства с интернет-магазином, а о той точке, которая, по идее, должна стать финальной – о странице оформления заказа.

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

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

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

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

Для примера возьмем вот такую страницу:

Страница оформления заказа в интернет-магазине

1. Аналитика страницы

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

Что можно отслеживать:

  • Стандартные поведенческие: процент отказов, время просмотра страницы.
  • Аналитика форм: сколько людей взаимодействовали с формой и сколько в итоге отправили данные. Например, Яндекс.Метрика дает такую картинку (анализируются данные за последние 2 недели):

    Метрика: Аналитика форм

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

  • Вебвизор (в Метрике). Собственно, берем те 228 людей, которые не справились с заполнением формы, и отсматриваем 7-15 посещений из них – что вызвало трудности, после какого поля или блока человек сдулся сдался.

Полученные данные фиксируем, выдвигаем гипотезу (что можно исправить), вносим правки – и снова собираем данные. Затем сравниваем новые данные с прежними и делаем вывод – сработала наша гипотеза или нет, и начинаем сначала.

2. На странице заказа есть список товаров и его можно редактировать

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

А если в процессе заказа он решит заказать не 2, а 4 вот этих футболки, то зачем ему препятствовать в этом и вынуждать возвращаться на страницу Корзины – пусть изменит количество сразу на странице Заказа.

Список товаров в заказе

Все чаще магазины объединяют страницу Корзины и Заказа в одну.

3. В списке товаров показываются скидки

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

Скидка в списке товаров

4. В списке товаров есть картинки и краткие описания

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

Описания в списке товаров

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

5. На странице заказа есть поле для промокода

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

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

Поле для промокода при оформлении заказа

6. Оформление заказа происходит в 1 шаг

Если посетитель сразу видит, какую информацию ему надо заполнить для заказа – то он может визуально оценить, сколько времени потребуется на это. Если же заполнение заказа разбито на шаги, то такую оценку сделать невозможно, и подсознательно ожидается, что на каждом шаге придется потратить столько же времени, сколько и на первом.

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

Способы доставки Выбран другой способ доставки

7. Разумное число полей в форме

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

Минимум полей в форме заказа

Можно оставить необязательными:

  • Поле для имени: к нему привыкли и знают, что менеджер будет обращаться по этому имени
  • Поле для комментария к заказу
  • Поле для email: да, необязательное. Что вам важнее – чтобы юзер зарегистрировал аккаунт, но ничего не оплатил (т.к. пока регистрировал аккаунт, передумал платить), или чтобы оплатил, хоть и без регистрации аккаунта?

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

8. Можно оформить заказ в 1 клик

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

Человек жмет «Купить в 1 клик» и отправляет номер своего телефона. Менеджер получает состав заказа, связывается с клиентом и заполняет остальные параметры заказа за него.

Заказ в 1 клик

9. Для способов оплаты есть иконки и указана комиссия (если есть)

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

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

Способы оплаты с иконками

10. Для способов доставки указана стоимость

Фиксированная или в формате «от …» – но стоимость доставки должна быть указана, чтобы человек мог сориентироваться, что его ждет при выборе того или иного способа доставки. Когда выбирает конкретный способ и указывает район/город, то стоимость доставки должна посчитаться точно.

Стоимость доставки

11. Указаны условия для бесплатной доставки

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

Условие бесплатной доставки

12. Для доставки курьером можно выбрать удобное время

Для курьерской доставки это самый важный вопрос – придется ли мне сидеть дома весь день и ждать курьера? Если я смогу выбрать какой-то один промежуток времени (например, с 9 до 14 часов), мне будет удобнее спланировать свой день.

Выбор удобного времени для доставки

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

13. Для самовывоза адреса точек можно посмотреть на карте

Обязательно укажите адреса точек для самовывоза (и их режим работы). Покажите эти точки на карте Яндекса или Гугла – так пользователь быстрее найдет наиболее удобную для себя точку.

Адреса точек самовывоза на карте

14. В списках оплаты и доставки по умолчанию выбраны популярные варианты

Чтобы при попытке отправить заказ не вызывать ошибок «Не выбран способ оплаты» или «Не выбран способ доставки», отметьте в них значения по умолчанию. Для этого посмотрите по статистике своих заказов, какие способы люди выбирают чаще всего. Например, можно выбрать «Наличные» для способов оплаты и «Доставка по городу» для способов доставки.

Способы оплаты и доставки выбраны по умолчанию

15. Одни данные – в одно поле

Вместо полей «Улица», «Дом», «Подъезд» поставьте одно поле «Адрес доставки» – когда человек действительно хочет получить свой заказ, он способен указать там свой адрес в полном и понятном виде. Выбор города или района выносят в отдельное поле, как правило, только для того, чтобы автоматически рассчитывать стоимость доставки.

То же касается и полей для ФИО. Вместо трех полей «Фамилия», «Имя», «Отчество» вполне достаточно одного поля «Имя и фамилия» или просто «Ваше имя».

Поля для адреса доставки и имени

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

16. Используются «помощники» для заполнения полей

Например, маска ввода для номера телефона:

Маска ввода для телефона

Выпадающий календарь (datepicker) для даты:

Datepicker для выбора даты

Поле поиска для больших выпадающих списков:

Поиск для длинных списков

Все эти инструменты помогают быстрее заполнить необходимые поля.

17. Есть пояснения к полям

Краткие пояснения полезны там, где у посетителя может возникнуть вопрос «А зачем им нужны эти данные?».

Например, пояснение к полю с телефоном – «Для подтверждения заказа», во-первых, снимает возражение «Зачем им понадобился мой телефон», во-вторых, стимулирует указать правильный номер.

Пояснение к полю с телефоном

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

Подсказка к полю email

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

Коммент к полю с личным кабинетом

Думаю, принцип вы поняли – укажите выгоду, которую получит клиент, и поле будет заполнено.

18. Сообщения об ошибках в форме видны и понятны

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

Сообщение о незаполненном поле

19. Разумная проверка вводимых данных

Иногда номер телефона хотят записать так: 8(945)123-45-67 доб.444, или даже вот так: 777-44-22 звонить после 15:00

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

Поэтому не стоит ставить строгих ограничений на те данные, которые строгости не требуют.

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

Сообщение о неверном email

20. Важные поля в начале, остальные – в конце формы

Мы уже договорились, что полей в форме будет немного. Но и их мы можем разделить по приоритетам. На первое место ставим выбор способов оплаты и доставки. Затем контакты и комментарий к заказу, и только потом показываем прочие поля. Таким образом, даже если ближе к концу формы пользователь уже «подустанет», он сможет пропустить последние необязательные поля и оформить заказ.

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

Вот так пойдет взгляд пользователя:

Так будет идти взгляд пользователя

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

21. Для подписки указана частота писем

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

Галочка подписки

22. Можно оформить заказ без регистрации

Интернет-магазинов много, и ни за что не упомнить всех логинов/паролей для них. Поэтому первое, что ищут глаза на форме заказа – это волшебную кнопку «Оформить заказ без регистрации».

Оформление заказа без регистрации личного кабинета

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

И даже если все свои заказы пользователь будет делать у вас без личного кабинета, это не столь важно. Главное, чтобы он делал их именно у вас.

23. Можно авторизоваться здесь же без перехода на другую страницу

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

Когда я делаю очередной заказ на Озоне, мне приходится в середине процесса оформления заказа уходить по ссылке «Личный кабинет», указывать там свои логин/пароль и потом снова открывать корзину. И если появится интернет-магазин, во всем аналогичный Озону, но в котором я смогу войти в свой личный кабинет прямо на странице заказа, не покидая ее – Озон будет забыт из-за такой, казалось бы, мелочи.

Авторизация на странице заказа

24. Для авторизованного пользователя данные заполняются автоматически

Если пользователь зашел в свой личный кабинет, то давайте поможем ему в оформлении заказа:

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

В идеале, авторизованный пользователь должен лишь окинуть взглядом форму и нажать «Оформить заказ».

Форма заказа для авторизованного юзера

25. Есть поле «Комментарий к заказу»

Не надо делать его большим, обычно туда пишется одно-два предложения, что-то вроде «Большая просьба позвонить за час до доставки», «Мне нужен такой же, но с перламутровыми пуговицами» и т.п.

Поле Комментарий к заказу

26. Выводится итоговая сумма заказа

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

Стоимость заказа

27. Под кнопкой есть краткое пояснение последующих событий

Это снимает вопрос «А что будет после того, как я нажму на эту кнопку?». Спрашивали – отвечаем:

Пояснения под кнопками

28. После оформления заказа выдается информативное сообщение

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

Сообщение после отправки заказа

29. После оформления заказа уходит письмо на email

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

Письмо о новом заказе

30. Есть сообщение для пустой корзины

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

Страница заказа для пустой корзины

Итог

Помните про основные правила для страницы заказа в интернет-магазине:

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

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

Кстати, наши юзабилити-спецы умеют смотреть на сайты «чужими» глазами. Так что если нужна помощь в аналитике страницы заказа или магазина в целом – вам сюда. Внедрить что-то приглянувшееся из чек-листа мы тоже можем (или исправить обнаруженные ошибки), за консультацией сюда.

© 1PS.RU, при полном или частичном копировании материала ссылка на первоисточник обязательна.

1ps.ru

JSale – быстрые заказы на вашем сайте

Простейшая установка
Простейшая установка

Установка кнопки заказа на страницу сайта с помощью всего одной строки JavaScript кода.На любую CMS, даже на обычный HTML сайт.Что может быть проще?

Моментальные заказы
Моментальные заказы

Оформление заказа происходит мгновенно.Без перезагрузки страницы, без регистрации, без ввода лишних данных, без суеты.Быстро, удобно и приятно!

Удобная панель продавца
Удобная панель продавца

Панелью администратора, построенной на фреймворке Bootstrap, пользоваться не только удобно, но и просто приятно.Попробуйте удобство и приятный дизайн!

 

Простейшая установка
Полная автономия системы продаж

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

Моментальные заказы
Платите только один раз

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

Удобная панель продавца
Одна лицензия для всех сайтов

Вы можете установить скрипт на ВСЕ свои проекты. Не нужно доплачивать за каждый домен и докупать лицензии.Это действительно выгодно!

 

Последние новости Обновление JSale до версии 1.45

Добавлена быстрая регистрация клиента и кабинет клиента, добавлено автозаполнение полей города и региона, сделан вариант входа в админку через форму, добавлена внутренняя страница заказа, добавлены бланки 7-а и 7-п Почты России, добавлены некоторые настройки в админке, сделаны мелкие обновления, исправлены баги.

Обновление JSale до версии 1.44

Поддержка PHP 7, добавлен апсел на отдельной странице, добавлена интеграция MailChimp, добавлены методы оплаты Payeer, MaxKassa, рассрочка от Приватбанка, добавлена возможность обновления треков посылок по CRON и отправки SMS о доставке, выделены шаблоны SMS, добавлена возможности привязки партнёра по email, добавлен чекбокс для согласия обработки персональных данных, 2 варианта вывода методов оплаты, сделаны мелкие обновления, исправлены баги.

Обновление JSale до версии 1.431

Что нового: метод оплаты SpryPay, теперь партнёрка работает и на других доменах, расчёт стоимости доставки EMS, поиск по треку, новые настройки, мелкие обновления, исправление багов.

Отзывы наших клиентов Приобрел JSale, скрипт как раз то что мне нужно было, идеально для быстрых заказов, сам использую для продажи физических товаров. Алан Битаров Используем систему JSale на нескольких сайтах. Где то как вспомогательную к основному движку заказов, где то как основную. Система простая и удобная, справляется с поставленными задачами Денис Громов Работа превзошла все мои ожидания! Очень все сделали быстро, учли все мои пожелания, терпеливо отнеслись к моим неграмотным в техническом плане вопросам. Елена Кривенко Очень понравилось то, что JSale выполняет только те функции, которые вам нужны, без излишеств и лишних наворотов, за которые в других системах приходиться переплачивать не малые деньги. Константин Климов

jsale.biz

Настройка формы оформления заказа

В решении Аспро: Корпоративный сайт современной компании вы можете сами настраивать форму оформления заказа и содержащиеся на ней поля.

Кроме того, вы можете выбрать, какие поля будут обязательными для заполнения (например имя и телефон).

Для настройки полей в оформлении заказа переключитесь на административную часть сайта и перейдите в Рабочий стол → Контент → Инфоблоки → Типы инфоблоков → Формы (aspro.scorp). Переключитесь на вкладку «Свойства».

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

  • «Название поля» отображается на сайте как его заголовок

  • «Тип» определяет основную характеристику поля - какие значения будут корректны для поля, например, строка, число, дата, текст в несколько строк, список.

  • «Акт.» - активность поля. Опция определяет, отображается выбранное поле на сайте или нет

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

  • «Обяз.» - обязательно для заполнение поле. Если отмеченное поле не будет заполнено, то форма не отправится, а у пользователя на экране появится уведомление, что он не заполнил обязательное поле.

  • «Код» - уникальный id поля, нужный программным модулям для обработки и хранения информации из формы.

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

Пример окна редактирования поля «Ваше имя»

Чтобы удалить созданное вами поле, поставьте галочку в столбце «Удал.» напротив него и сохраните изменения. 

Внимание! Мы настоятельно не рекомендуем вам удалять существующие по умолчанию поля –  это действие необратимо. Если вы хотите, чтобы поле не отображалось на сайте и не заполнялось пользователем, деактивируйте его, сняв галочку в столбце «Удал.».

0

aspro.ru

Как улучшить страницу оформления заказа

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

  1. Аналитика

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

На что стоит обратить внимание.

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

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

  1. Наличие на странице редактируемого списка товаров

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

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

Исходя из этого, целесообразно объединять Корзину и страницу оформления заказа.

  1. Информация о скидке в списке товаров

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

  1. Небольшое описание + картинки

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

  1. Наличие на странице заказа места для купона или промокода

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

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

  1. Оформление в один шаг

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

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

  1. Оптимальное количество полей

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

Следующие поля можно оставить необязательными:

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

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

  1. Заказ в один клик

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

  1. Иконки, обозначающие разные способы оплаты

Современный человек уже привык ориентироваться по логотипам не только в торговых марках, но и в способах оплаты. Если у вас на сайте их более трех, то будет разумно поместить иконки, беглый взгляд на которые даст понять клиенту, что здесь можно оплатить по Приват24, Webmoney, WalletOne и т.д.

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

  1. Стоимость разных способов доставки

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

  1. Условия для осуществления бесплатной доставки

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

  1. Удобное для клиента время доставки

Пожалуй, один из самых важных моментов для курьерской доставки — придется ли с самого утра и до вечера сидеть дома и ожидать своего заказа? Если указать определенный промежуток времени доставки, то клиент сможет распланировать свой день, оставив о вашей компании только приятные впечатления.

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

  1. Адреса точек самовывоза на карте

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

  1. По умолчанию оставляйте самые популярные способы оплаты и доставки

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

  1. Данные в одном поле

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

Та же ситуация и касаемо полей ФИО. Откажитесь от идеи разбивать одно простое поле «Имя и фамилия» на три отдельных.

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

  1. На сайте есть «помощники»

Под помощниками подразумеваются все элементы, которые упрощают процесс заполнения формы заказа, например, удобная маска для добавления номера телефона.

Datepicker — удобный выпадающий календарь для выбора даты.

Поле поиска, в котором есть выпадающие списки.

Благодаря таким элементам заполнение будет занимать меньше времени, что обязательно оценит клиент.

  1. Подсказки по полям

Если в форме есть поля, заполнение которых может вызвать вопрос «А зачем это делать?», то лучше сделать к ним краткие пояснения.

Например, укажите объяснение к обязательному полю «Номер телефона», что это необходимо для «Подтверждения заказа». Это подтолкнет пользователя указать верный номер, и снимет вопросы о том, зачем компании знать такую информацию о заказчике.

К полю Email также можно сделать объяснение, например, «Будет выслан чек об оплате». Расскажите пользователю, что на почту он получит полезную информацию о заказе и о вашей компании. Это поможет существенно повысить процент заполнения данного поля. При этом пропадет негатив, который может вызвать принуждение к заполнению поля.

Если предусмотрено создание Личного кабинета, то можно указать пояснения «Чтобы копить бонусные баллы» и т.д.

Данный принцип можно применять ко всем полям — главное, объяснить человеку, зачем это нужно.

  1. Понятные сообщения об ошибках

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

  1. «Умная» проверка вводимых данных

Довольно часто клиенту необходимо записать номер телефона либо «по-своему», либо с дополнительными примечаниями, например, «(044)025-12-66 доб.23» или же «0980251266 звонить после 19:00». Конечно, жестко настроенная форма не пропустит ни первое, ни второе сообщение, но ведь это два абсолютно реальных клиента. Первому просто можно дозвониться только с указанным кодом, а второй возможно только в зоне действия сети может появляться только вечером. Вот почему крайне не желательно ставить жесткие ограничения на поля, которые не требуют этого.

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

  1. Все важные поля в начале

То, что полей для заполнения должно быть не много — ясно. Не менее важным является и разделение их по важности для пользователя. На первое место стоит ставить способ оплаты покупки и доставки. Далее должны идти контакты и различные комментарии, а уж потом остальные поля. Это нужно, чтобы немного «подуставший» от заполнения полей, пользователь случайно не пропустил обязательные поля и смог оформить заказ.

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

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

  1. Достоверная информация о подписке

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

  1. Оформление заказа без регистрации

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

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

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

  1. Авторизация без перехода на новую страницу

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

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

  1. Автоматическое заполнение полей для авторизованного пользователя

Своих зарегистрированных пользователей нужно любить, поэтому:

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

Идеально, когда авторизованному на сайте клиенту не нужно даже писать ничего — достаточно просто окинуть взглядом знакомую уже форму и всего лишь нажать на «Оформить заказ».

  1. Краткие комментарии к заказу

Это поле не должно быть большим, но его наличие необходимо, чтобы клиент смог выразить некоторые свои пожелания, например, «Звонить после 13:00».

  1. Отображение общей суммы заказа

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

  1. Пояснение к кнопкам

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

 

  1. Информативное сообщение после оформления заказа

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

  1. Письмо о заказе на электронную почту

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

 

  1. Информация о пустой корзине

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

 

Итоги

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

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

 

Одним словом, страница должна быть интуитивно понятной и «дружелюбной» по отношению к пользователю. Если вас терзают сомнения, лучший способ проверить свои гипотезы – провести тестирование на реальных пользователях. Можно воспользоваться сервисом AskUsers, который предназначен для таких целей. В результате вы получите подробный отчет и рекомендации по делу. Всем высоких конверсий и лояльных клиентов )

okay-cms.com

10 примеров страниц оформления заказа популярных коммерческих сайтов

Итак, ваш пользователь добавил понравившийся товар в корзину, нажал на кнопку «оформить/сделать заказ». Что же он должен увидеть на следующей странице?

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

Но так ли обстоят дела на самом деле? Предлагаем вам ознакомиться с некоторыми формами оформления заказа на коммерческих сайтах.

 

Примеры страниц оформления заказа на коммерческих сайтах

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

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

Данную информацию у пользователя можно запросить на странице подтверждения заказа, автоматически сгенерировать и только потом предложить пользователю «создать пароль». И зачем вынуждать пользователя регистрироваться еще до решения что-либо у вас купить, когда весь процесс можно «провернуть» почти незаметно в ходе оформления заказа?Вот пример того, как компания «ASOS» упростила свою регистрационную страницу с:

(Рис. Клиенты, уже пользовавшиеся услугами сайта «ASOS», должны ввести адрес электронной почты и пароль, а новым клиентам необходимо создать аккаунт)

на:

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

 

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

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

 

Компания «Macy’s»Вот еще один прекрасный пример – приятная, понятная и не перегруженная страница, которая обращает внимание пользователей на ключевые моменты:

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

«Macy’s» хорошо справились с этой задачей еще и потому, что на странице оформления заказа покупателям дается информация по возврату и доставке товара (при щелчке на значки «коробка» и «замок»), а вверху страницы указан номер, по которому можно позвонить и уточнить всю необходимую информацию. Согласитесь, что подобный подход к делу внушает доверие и уважение.

 

Компания «Walmart»На своей странице оформления заказа компания «Walmart» предлагает гостям опции по созданию аккаунта либо по дальнейшему оформлению заказа без его создания. Т.е. у нового покупателя есть выбор – сэкономить время «здесь и сейчас» либо в будущем:

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

 

Компания «Sears»Интересный подход к данному вопросу проявила компания «Sears», которая решила, что страница входа в систему для постоянных клиентов им не нужна. Поэтому компания отправляет всех своих пользователей сразу на страницу оформления заказа.Так выглядела их страница оформления заказа раньше:

А так она выглядит сейчас:

Все предельно понятно (необходимо ввести адрес доставки, имя получателя и email), нет никаких барьеров для оформления покупки.

 

Компания «WHSmith»Еще один образец для подражания. Очень аккуратная страница, не принуждающая пользователя к обязательной регистрации:

(Рис. Пользователя просят ввести email и ненавязчиво спрашивают, есть ли у него пароль для входа на сайт)

 

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

(Рис. Войти, введя адрес эл. почты и пароль. Зарегистрироваться, введя адрес эл. почты, почтовый код и номер клубной карты)

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

 

Компания «John Lewis»Еще один прекрасный пример оформления страницы заказа. Здесь нет условия обязательной регистрации всех пользователей, а на самой страничке представлены все необходимые контактные данные компании, предложена функция безопасного подтверждения заказа (оформление заказа можно продолжить только пройдя по ссылке, высланной на электронный адрес):

(Рис. Пользователя просят ввести email, на который будет выслана ссылка по дальнейшему оформлению заказа)

 

Компания «Boots»Ранее мы уже рассматривали сайт компании «Boots», у которой обязательная регистрация перед оформлением заказа может быть одним из факторов, негативно отражающимся на уровне продаж:

(Рис. Войти в систему оформления заказа через email и пароль или зарегистрироваться на сайте, прежде чем начать делать покупки)

 

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

(Рис. Посетителю предлагают ввести электронный адрес и указать, является он новым покупателем (тогда надо щелкнуть по ниже располагающейся желтой кнопке)  или уже пользовался услугами «Amazon» (тогда вводится пароль)).

 

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

(Рис. Нового покупателя просят ввести имя, адрес эл. почты, номер контактного телефона (опционально) и пароль).

 

Компания «House of Fraser»

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

(Рис. Просят войти или продолжить оформление заказа в качестве гостя, указав для начала лишь свой email).

 

Компания «American Apparel»

Компании «American Apparel» удалось на одной страничке разместить не только информацию о заказах (список покупок) и их стоимости, но и функцию «войти через свой логин» и оформление заказа в статусе гостя.Однако все это сделано настолько «вкусно», что покупатель нисколько не запутается и его ничто не будет отвлекать от покупки:

(Рис. Оформление заказа: 1) список и стоимость заказа; 2) войти через свой логин или в качестве гостя указать детали доставки)

 

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

Например, если не брать во внимание ввод номера с клубной карты (что в любом случае опционально), формы по оформлению и подсчету стоимости заказа таких компаний, как «House of Fraser» и «Tesco», требуют введения одинаковой информации.

Вот только «Tesco» своей манерой реализации превратили это в барьер, а «House of Fraser» не создают никаких препятствий и направляют всех пользователей сразу на страницу оформления заказа без обязательной регистрации. Какая тактика лучше? Как по мне, вторая…

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

Оригинал статьи можно прочитать тут.

blog.seolib.ru

Заказ товара в один клик

Основные надстройки

Сайты, продающие какие-либо товары, зачастую делаются на специализированных системах(cms). Полноценные интернет-магазины обязаны иметь полнофункциональную корзину и возможность оплатить покупку дистанционно. Но что делать, если ассортимент вашей продукции не такой большой, чтобы разворачивать целый магазин. Что если вы продаёте свою книгу, тренинг или какую-нибудь уникальную методику? Даже если у вас интернет-магазин с полной автоматизацией, кнопка "Купить в несколько кликов" или "Заказать за 5 секунд" будет очень кстати.

Проведённые исследования показывают, что при использовании возможности экспресс-заказов, конверсия увеличивается до +56%. Если считать классическое оформление заказа, то число отказов составляет около 7%. При использовании заказа в 1 клик число отказов достигало 20% (каждый 5-й заказ содержал "липовые" данные покупателей). Несмотря на это, экспресс-заказов было большинство. Это значит, что при правильном использовании этой функции, количество продаж может существенно увеличиться.

конверсия при использовании эеспрес-заказа

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

Шаг 1. Проектирование формы экспресс-заказа

Рассмотрим готовые формы заказа в один клик из примеров в конструкторе.

Форма заказа в один клик

Стандартная форма для заказа с сайта. Кнопку на неё или ссылку можно поставить рядом с кнопкой "Добавить в корзину", либо использовать отдельно. В скрытом(невидимом) поле формы будет передано название товара. В этом примере поле товара сделали видимым, чтобы вы смогли проследить за изменением поля. В заготовках конструктора скрытое поле для товаров имеет идентификатор product. Чтобы это поле заполнялось автоматически в зависимости от того, на какую кнопку/ссылку нажали, нужно добавить ссылке или кнопке псевдо-атрибут data-product="Название товара"

<a data-product="iPhone 5S">Купить iPhone 5S</a> <a data-product="Samsung S5">Купить Samsung S5</a> <a data-product="HTC Desire">Купить HTC Desire</a>

Купить iPhone 5S Купить Samsung S5 Купить HTC Desire

форма экспресс-покупки

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

Купить Блузку Купить Штаны Купить Свитер

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

изменение свойств элементам формы

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

Вот так будет выглядеть письмо от формы экспресс-заказа. Дополнительно передаётся адрес страницы с которой пользователь отправил форму, его IP и местоположение.

Письмо заказа

jbcallme.ru

Редактирование формы оформления заказа

В данной статье мы рассмотрим возможности редактирования формы оформления заказа.

Для того, чтобы редактировать форму оформления заказа (рис. 2, рис. 14), необходимо перейти в панель администрирования, пункт меню "Магазин - Настройки - Оформление заказов" - вкладка "Поля в оформлении заказа".

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

 

Раздел "Поля покупателя"

Раздел "Поля покупателя"Рисунок 1.

Рассмотрим данную таблицу:

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

 

В форме оформления заказа поля, обязательные для заполнения, обозначаются красной "звездочкой" (рис.2).

В форме оформления заказа поля, обязательные для заполнения, обозначаются красной "звездочкой" Рисунок 2.

Установите галочки в тех полях, которые вы хотите показывать в форме оформления заказа, и в тех полях, которые обязательны для заполнения. Также в данном разделе в полях "Имя" и "Контактный телефон" можно изменить название полей (рис.1).

Помимо полей "Имя", "Фамилия", "Отчество" и "Контактный телефон" при оформлении заказа появляется поле "E-mail". Это уникальный идентификатор клиента, который является обязательным для заполнения при оформлении заказа (рис.2).

Раздел "Поля в доставке"

Поля "Страна", "Область" и "Город" В данном разделе поля "Страна", "Область" и "Город" будут отображаться в форме оформления заказа, если в интернет-магазине отключена настройка автоматического определения города (рис.3). Если же данная настройка включена, то поля "Страна", "Область" и "Город" будут заполняться автоматически в форме оформления заказа.

Раздел "Поля в доставке"Рисунок 3.

Чтобы подключить автоматическое определение города клиента, необходимо перейти в панель администрирования, пункт меню "Настройки - Системные настройки" - вкладка "Общие" (рис.4).

Чтобы подключить автоматическое определение города клиента, необходимо перейти в панель администрирования, пункт меню "Настройки - Системные настройки" - вкладка "Общие"Рисунок 4.

Далее, во вкладке "Общие" в поле "Определять город автоматически" установите галочку для подключения механизма определения города клиента (рис.5).

Далее, во вкладке "Общие" в поле "Определять город автоматически" установите галочку для подключения механизма определения города клиентаРисунок 5.

 

Поля "Почтовый индекс" и "Адрес" В разделе "Поля в доставке" поля "Почтовый индекс" и "Адрес" (рис. 6) появляются на шаге оформления заказа, только в том случае, если у выбранного способа доставки в настройках метода включена настройка "показывать дополнительные поля" (рис. 7).

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

Например, для метода доставки "Курьером" данные поля необходимы для заполнения. Чтобы подключить данную настройку, необходимо перейти в панель администрирования, пункт меню "Настройки", вкладка "Способы доставки" (рис.7).

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

Далее выбираем метод доставки "Курьером" (рис.7) и устанавливаем галочку в поле "Показывать дополнительные поля" (рис.7). Теперь при оформлении заказа на шаге выбора метода доставки "Курьером" будут отображаться поля "Почтовый индекс" и "Адрес" (рис.8).

Теперь при оформлении заказа на шаге выбора метода доставки "Курьером" будут отображаться поля "Почтовый индекс" и "Адрес" Рисунок 8.

А вот, например, для метода доставки "Самовывоз" данные поля не нужны для заполнения, так как клиент сам забирает свой товар. В таком случае, при оформлении заказа после выбора метода доставки сразу идет переход к выбору способа оплаты (рис.9)

А вот, например, для метода доставки "Самовывоз" данные поля не нужны для заполнения, так как клиент сам забирает свой товарРисунок 9.

 

Показывать расширенный адрес Если данная настройка активна, при оформлении заказа пользователю отобразятся для заполнения такие поля, как улица, дом, квартира, корпус, подъезд, этаж (рис. 10).

Если данная настройка активна, при оформлении заказа пользователю отобразятся для заполнения такие поля, как улица, дом, квартира, корпус, подъезд, этажРисунок 10.

Если настройка неактивна, данные поля при оформлении заказа отображаться не будут (рис. 11).

Если настройка неактивна, данные поля при оформлении заказа отображаться не будут Рисунок 11.

 

Добавление новых полей Также в разделе "Поля в доставке" есть возможность добавления новых полей в форму оформления заказа. Для этого предназначены настраиваемые поля 1, 2 и 3 (рис.12).

 

Поле "Пользовательское соглашение" В поле "Пользовательское соглашение" можно размещать и редактировать текст пользовательского соглашения (рис.12).

В поле "Пользовательское соглашение" можно размещать и редактировать текст пользовательского соглашенияРисунок 12.

 

Раздел "Купи в один клик" В данном разделе доступно управление полями для оформления заказа в один клик. Установите галочки в тех полях, которые хотите показывать при оформлении заказа в "Один клик", и в тех полях, которые обязательны для заполнения. Также в данном разделе во всех полях можно изменить название поля (рис.13).

становите галочки в тех полях, которые хотите показывать при оформлении заказа в "Один клик", и в тех полях, которые обязательны для заполнения. Также в данном разделе во всех полях можно изменить название поля Рисунок 13.

В клиентской части форма покупки в один клик отображается так (рис. 14).

В клиентской части форма покупки в один клик отображается такРисунок 14.

Подробнее о покупке в один клик здесь.

Все готово.

Тэги: поля в оформлении заказа, форма оформления заказа, пользовательское соглашение, имя, фамилия, отчество, адрес, индекс, телефон, почта, email, дополнительные поля

www.advantshop.net