5 Фундаментальных принципов юзабилити интернет-магазинов

Posted on by riasevastopol

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

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

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

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

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

  • Примеры юзабилити интерфейса пользователя

1. Несложная и функциональная навигация

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

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

Контекстное меню — первое, с чего люди начинают поиск интересующих предложений, независимо от того посетили они сайт в первый раз либо бывали тут ранее. Учитывая упомянутое выше жажду пользователей скоро искать и просто покупать, направляться ограничивать перечень родительских категорий в меню (категорий первого уровня навигации) максимум 7 заголовками, с числом подкатегорий — от 2 до 3.

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

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

Пример банковского лендинга с несложным меню навигации — тут лишь 3 заголовка в верхней панели навигации (вверху справа): «Feauters» (Советы), «Testimonial» (Отзывы) и «Sign In» (Войти).

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

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

Домашняя страница Sweat VAC (аксессуары и одежда). Тут лишь 5 заголовков в верхней панели навигации: «Home» (Домашняя страница), «Headwear» (Головные уборы), «Shirts» (Футболки), «Gear» (Аксессуары) и «Custom» (Под заказ). Все легко и информативно.

  • Как оптимизировать навигацию вебмагазинов, либо 7 раз отмерь

2. Не делайте процесс приобретения сложным

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

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

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

Лид-форма на посадочной странице Crazy Egg для заказа 30-дневного пробного периода пользования сервисом, не требует ничего, не считая указания пароля и электронного адреса.

  • 5 советов по созданию вашей следующей лид-формы

3. Применяйте ясные указания об неточностях ввода данных

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

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

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

  • Желаете повысить конверсию? Приведите лид-форму в порядок!

4. Убедитесь в стремительной загрузке страниц

Пользователи всемирной сети не обожают ожидать

25% пользователей сети Интернет отказываются от визита веб-страницы, в случае если ее загрузка продолжается более 4 секунд. А любая дополнительная секунда к загрузке страниц вашего сайта увеличивает количество «отказников» еще на 7%. Развитие оптоволоконных разработок и доступность скоростного доступа к глобальной паутине привили интернет-пользователям новые нелюбовь и поведенческие паттерны к продолжительному ожиданию.

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

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

  • Низкая скорость загрузки страниц сайта = низкая конверсия

5. Автозаполнение поиска

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

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

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

  • Автозаполнение лид-форм: передовая техника email-маркетинга

Сплит-тестирование

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

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

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

Начните с самых посещаемых лендингов и страниц с очевидно высоким коэффициентом отказов.

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

Высоких вам конверсий!

По данным crazyegg.com, image source Mike Eng

Случайные статьи:

Урок 3. Юзабилити интернет-магазина


Подборка похожих статей:

riasevastopol

More Posts