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

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

Статья написана для проекта MadCats.ru — издания для всех, кто интересуется интернет-маркетингом.

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

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

Вся суть юзабилити в 30 секундном видео. Нужно полировать путь перед клиентом.

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

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

Начнем с очевидных вещей.

Обязательная регистрация

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

Только два варианта - либо авторизация либо регистрация

Скриншот в котором только два варианта — авторизация или регистрация.

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

Покупка без регистрации невозможна, если е-мейл уже есть в базе

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

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

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

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

Отказаться от регистрации?

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

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

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

Несколько советов:

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

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

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

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

Авторизация

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

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

Не получается сделать заказ, если е-мейл есть в базе сайта

Согласитесь, не давать оформлять заказ, если такой е-мейл уже есть в базе сайта — это перебор.

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

1 сценарий. Относительно простой. Если магазин после регистрации отправляет клиенту на почту логин и пароль, а клиент помнит, что пароль у него есть где-то в почте. Тогда шагов «всего» 4.

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

Можно пробовать повторно заманить его к себе, используя ретаргетинг. Но придет он снова к вам, а пароль все еще не помнит. :-)

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

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

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

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

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

Как можно упростить авторизацию?

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

Выбор товара

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

Пагинация

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

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

Вот такой пагинатор делать точно не нужно:

Плохой пример пагинатора

Пагинация в каталоге товаров не заметная. Это не способствует глубине просмотров.

Такой тоже не лучший вариант:

Еще один плохой пример пагинатора

Посмотрите, как пагинация сделана на rozetka.ua:

Хороший пример пагинации

Пагинатор трудно не заметить. Это хорошо.

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

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

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

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

Фильтр

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

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

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

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

Нужно явно показывать пользователю какие параметры фильтра у него выбраны

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

Другая распространенная ошибка в фильтрах, это когда параметр применен, но визуально этого не видно. Это хорошо можно объяснить на примере параметра «цвет».

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

Плохой пример фильтра

Если фильтруем по цвету, то товары должны быть соответствующего цвета.

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

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

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

В фильтре не должно быть страниц с отсутствующим товаром

В фильтре не должно быть страниц с отсутствующим товаром.

Когда интернет-магазин прямо говорит посетителю «У нас для вас ничего нет» — это очень плохо. Такие страницы — потенциально страницы выхода, на которых посетители покидают сайт чаще всего.

Подведем итог, каким должен быть правильный фильтр по товарам

Выводы

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

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


Статьи по теме

 

Комментарии

Ирина, 02.11.2016#
Вам нужно авторизоваться, чтобы голосовать0 Вам нужно авторизоваться, чтобы голосовать0

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

У меня вопрос.. не совсем по теме, но в сети не могу найти ответ: в каком виде лучше писать ТЗ верстальщику-разработчику?
Есть готовый дизайн всех типовых страниц, фильтра для каталога, карточки товара и т.д. ЮИ-кит, всплывающие окна. Все упаковано.
В каком виде делается тз по верстке и программированию - логике работы фильтра, логике админки внутри.
В ворде со скриншотами?
Если есть уже статья на такую тему - подскажите, пожалуйста. Возможно, не правильно ищу.
Юрий, спасибо за статью!.. и статьи) Безумно ценно за счет опыта + наглядных примеров со ссылками. Все по мясу. У меня вопрос.. не совсем по теме, но в сети не могу найти ответ: в каком виде лучше писать ТЗ верстальщику-разработчику? Есть готовый дизайн всех типовых страниц, фильтра для каталога, карточки товара и т.д. ЮИ-кит, всплывающие окна. Все упаковано. В каком виде делается тз по верстке и программированию - логике работы фильтра, логике админки внутри. В ворде со скриншотами? Если есть уже статья на такую тему - подскажите, пожалуйста. Возможно, не правильно ищу.


Юрий Кудренко
Юрий Кудренко, 03.11.2016#
Вам нужно авторизоваться, чтобы голосовать0 Вам нужно авторизоваться, чтобы голосовать0

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



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

Ваше имя:

Электронная почта:

Комментарий :


Введите код с картинки:

CAPTCHA