Существует определенные шаги, которые надо выполнять при проработке юзабилити:

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

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

Шаг 2 – концентрация. Это борьба с отвлечением внимания от конкретной цели посещения сайта, после того как возник первичный интерес. Если посетитель принял решение остаться в вашем интернет-магазине, познакомиться с ним и его предложениями поближе, ваша следующая задача – не мешать ему выбрать нужный товар и совершить первую покупку.

Шаг 3 – действие. Это, во-первых, достижение вашей цели – привлечь данного посетителя, чтобы он что-то купил, и, во-вторых, осуществление цели самого посетителя – купить то, что нужно, и остаться довольным. На данном этапе ваша задача – помочь клиенту выбрать самый подходящий товар и оплатить заказ.

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

Вот 10 основных советов, как избегать проблем юзабилити интернет-магазина, возникающих у покупателя и мешающих ему совершить покупку, и, следовательно, прямо влияющих на продажи:

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

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

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

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

Даже те поля, где ответ однозначен (например, «Ваш e-mail»), нуждаются в пояснении – хотя бы того, зачем он нужен.

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

При виде них часто возникают вопросы:

• Что продолжить – делать покупки или процесс оплаты?

• Куда назад – к поиску или на предыдущую страницу?

• Что применить – новые данные или добавление товаров в корзину? И т. д.

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

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

Рис. 20. Пример понятной формы для ввода данных банковской карты

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

Разные интернет-магазины используют разные варианты: одни – названия месяцев, другие – названия и цифры, третьи – только цифры. Какой вариант лучше? Лучший тот, который покупатель видит на своей карте, то есть одни цифры.

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