Юзабилити интернет-магазина: чек-лист по улучшению ошибок!

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

Юзабилити (от англ. usability) — это показатель комфорта, который испытывают посетители сайта при взаимодействии с ним. Согласно статистике Experience Dynamics, 61% пользователей уходят на другой сайт, если не находят решение своей проблемы в течение 10–20 секунд.

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

2. Структура сайта. За несколько секунд вы должны донести главную мысль: кто вы, чем занимаетесь и какую пользу готовы принести клиенту. Люди не готовы тратить время на большие тексты, поэтому все описание должно быть максимально лаконичным. Разделяйте мысли на абзацы, используйте нумерованные списки, изображения и различные обозначения для легкости восприятия.
Не перегружайте сайт графическими элементами, используйте гармоничные шрифтовые пары и минималистичную цветовую гамму. К примеру, если магазин подразумевает подробные описания товаров, то лучше использовать шрифт с засечками – это упрощает чтение текста, когда его много.

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

Для планирования редизайна сайта или его отдельных элементов вам понадобятся данные из Google Analytics или "Яндекс.Метрики". Проанализируйте, в каких зонах посетители «отваливаются» чаще всего? Сформулируйте гипотезы, почему это происходит, затем внесите правки и проследите изменения при помощи A/B-тестирования.

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

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

Важно разместить в карточке товара как можно больше информации о нем. Что должно быть в карточке товара:

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

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

3. F-паттерн. Это то, как пользователи просматривают страницу: общая траектория сканирования контента напоминает букву «F». Согласно ему, все важное должно быть слева. Именно поэтому сначала идет фото товара, потом описание.

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

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

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

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

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

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

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

Сайт: https://askusers.ru/
Что делает: Настройте проект и выберите исполнителей, которые дадут обратную связь вашему сайту. Оставьте фокус-группы с форумов в прошлом.

Сайт: https://feng-gui.com/
Что делает: Программа анализирует возможные варианты действий пользователя и покажет их на скриншоте. Подойдет, если нет идей для изменения дизайна.


Фото и гифки из открытых источников: yandex.ru и google.com