Юзабилити чекаута: мелочей не бывает

Юзабилити чекаута: мелочей не бывает

На основе материала 3 Often Overlooked Checkout Usability Guidelines

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

Приведенные ниже советы – часть отчета 2011 E-commerce Checkout Usability Report, составленного институтом Baymard Institute по результатам проведенного исследования. В ходе этого исследования чекауты 15-ти крупнейших интернет-магазинов были предметом пользовательских тестов.

Сохранение введенных пользователем данных

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

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

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

Подстановка (автозаполнение) адресных данных

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

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

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

Выпадающие списки

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

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

Если другие способы представления данных применить в вашем случае невозможно, то, по крайней мере, убедитесь, что ваш выпадающий список отсортирован с учетом наиболее популярных позиций. Например, если у вас есть список стран, то имеет смысл убедиться, что он отсортирован в алфавитном порядке, чтобы клиент мог просматривать только первую букву каждого варианта вместо того, чтобы читать слова целиком. Кроме того, продублируйте 5–10 наиболее популярных стран и поместите их в начало списка чтобы их было легче найти (обратите внимание на то, что страна должна присутствовать и на своем месте в списке, чтобы покупатель, не заметивший ее в начале списка, имел возможность найти, например, страну «Россия» по букве «Р»). Кроме того, для упрощения восприятия списка не полагайтесь на браузерные варианты его вывода, используйте javascript, который дает возможность накрывать всю видимую область колонками списка с вариантами выбора.

Автор: Vyacheslav Vityuk

Подписаться на новости

Читайте также

25 октября / Комментарии

11 принципов веб-дизайна, которые повышают конверсию

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

далее →

26 сентября / Комментарии

Разбор юзабилити интернет-магазина Ulmart.ru и его преобразования за 2016 год

Изначально статья планировалась как одно целое, где я хотел рассмотреть возможные ошибки в юзабилити топа российских интернет-магазинов. Но после нескольких дней обзора, понял, что каждый сайт заслуживает отдельного разбора. Кроме того, мне захотелось не только осветить проблему, но и предложить своё видение ее решения. В связи с этим вся статья строится по схеме: Гипотеза о проблеме > Причина и Обоснование > Решение.
Поскольку статья начата еще в ноябре 2015 года, а закончена только сейчас, Ulmart успел исправить часть проблем,  обозначенных в статье. Об этом я дополнительно говорю в примечаниях . И сейчас мы можем отследить те преобразования, которые были сделаны.

далее →

6 сентября / Комментарии

Комфорт покупателей как залог успешного бизнеса. Основные ошибки в юзабилити интернет-магазинов

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

далее →

11 августа / Комментарии

Чек-лист юзабилити интернет-магазина

По-настоящему проверить удобство интернет-магазина без подтверждения данными веб-аналитики, не получится. Контекст взаимодействия; задачи, опыт и мотивы пользователей; устройства, с которых пользователи просматривают магазин — всё это влияет на конверсию и не может быть оценено чек-листом.
При составлении чек-листа, я ориентировался на исследования института Baymard, Юзабилити Лаб, Mastercart и студии Сибирикс + некоторые собственные наблюдения.

далее →

Навигация как способ управления вниманием пользователя

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

далее →

X
Нажмите «Нравится»,
чтобы читать Shopolog.ru в Facebook