Знать основы юзабилити полезно дизайнерам, маркетологам, владельцам сайтов и арбитражникам. Если вы принимаете любые решения, связанные с развитием сайтов, запускаете рекламу и рассчитываете на конверсии, то должны понимать, насколько эффективен ваш онлайн-ресурс с точки зрения взаимодействия с потенциальным клиентом.
В этой статье мы расскажем, как сделать сайт более эффективным и для пользователя, и для владельца, основываясь на выдержках из вебинара Ольги Горенко - организатора украинского сообщества юзабилити-специалистов UX-UA и активной участницы украинских и российских конференций по веб-разработке.
Что такое юзабилити?
Юзабилити – это сравнительная величина, которая отражает, насколько удобным, комфортным, приятным и эффективным является сайт для пользователей и как помогает решить их задачи.
Юзабилити состоит из трех условных частей:
- Пользователи.
- Ситуации, в которых посетители ресурса совершают какие-либо действия.
- Сами действия или конверсия, ожидаемая от пользователей.
Важно понимать, что юзабилити не может быть хорошим или плохим. Это относительная величина, которая зависит от поставленных задач и их выполнения (невыполнения) людьми в определенных условиях.
Пример: сайт собирает 100 регистраций в сутки. Это хорошо или плохо? Насколько эффективно работает кнопка «Зарегистрироваться»? Ответить однозначно без дополнительных сведений нельзя. Нужно сравнить это значение со среднерыночным показателем регистраций или с результатом сайта-конкурента в аналогичной нише. Также необходимо сопоставить сегодняшнее количество регистраций со вчерашним.
После изменения формы число регистраций увеличилось до 105, это значит, что сайт стал на 5 % эффективнее для пользователей в решении задачи регистрации.
Еще одно определение, которое важно знать – user experience (UX). Данный термин дословно переводят как «пользовательский опыт», но точнее его можно определить как соотношение ожидаемого к получаемому.
Пример: нажимая на кнопку «Зарегистрироваться», пользователь ожидает, что на следующей странице он создаст свой аккаунт на сайте. Если после клика появляется рабочая форма регистрации, можно сказать, что UX отработан. Если открывается страница с общей информацией о пользе регистрации и очередной ссылкой, по которой нужно перейти, то UX – отрицательный.
Основная цель работ по UX – максимально приблизить ожидаемое к получаемому, чтобы каждая кнопка на сайте эффективно выполняла свою задачу.
Почему важны цели сайта?
Как и UX, цели сайта определяют соотношение желаемого к получаемому, но уже со стороны владельца бизнеса. Например, сайт должен донести до пользователей определенную информацию, простимулировать регистрацию, совершение покупки, заказ звонка. UX показывает, насколько эффективно удалось выполнить поставленную задачу.
Чтобы было понятнее, разберем два реальных кейса.
Кейс 1
Рассмотрим сайт агентства по созданию эффективной рекламы в социальных сетях.
На главной странице пользователи сразу видят, чем занимается компания, какие основные услуги предлагает и даже фото человека, который, предположительно, выполняет данные работы. Затем идет информация о результатах деятельности агентства, список клиентов, контакты компании и форма для связи с менеджером.
Какие факторы могут негативно повлиять на юзабилити сайта в данном случае? Можно сделать несколько замечаний:
- На главной странице в описании деятельности компании присутствует слово «эффективной», но нет никакой дополнительной информации, которая подтверждает реальную эффективность рекламы.
- Кнопка скролла внизу страницы слишком крупная и перетягивает на себя внимание. Кроме того, она выглядит так, будто на нее хотели добавить текст, но забыли.
3. В описании результатов работы агентства стоит придерживаться правила «цифра к цифре»: если два первых пункта начинаются с цифр («8 лет», «12 стран»), то следующий пункт также должен звучать как «1 млн долларов».
Также слово «потрачено» вызывает вопрос: насколько эффективно были использованы средства и оправданы ли такие расходы? Клиента интересует, не какими суммами управляет компания, а сколько можно заработать с ее помощью. Слово «потрачено» несет отрицательную окраску, т. к. говорит о каком-то минусе для клиента, поэтому его лучше заменить. Чтобы подтвердить эффективность рекламы, нужно добавить, во что конвертировался использованный миллион.
4. Блок «Клиенты» должен показать пользователям, что агентство работает с компаниями из разных ниш. Но логотипы клиентов указаны хаотично, поэтому контент заданной цели не достиг. Эффективнее будет указать, с какими нишами работала компания (интернет-магазины, В2В, В2С), и каждую категорию расширить логотипами топовых клиентов.
5. Основная цель сайта – простимулировать пользователя оставить заявку. Но форма для связи с компанией расположена в нижней части страницы, куда люди не всегда доходят. Сама форма «Напишите нам» оформлена недостаточно контрастно: строки и кнопка «Отправить» сливаются с фоном страницы. В таком случае call-to-action не срабатывает, потому что форма не привлекает внимания и не побуждает к действию.
Необходимо сделать форму более контрастной, работая с цветом, размером и жирностью шрифта, курсивом. Разместить ее следует в начале страницы, чтобы призыв к действию сразу бросался в глаза.
6. Список разделов сайта не дает пользователю подсказки, где можно найти информацию о результатах деятельности агентства. Наиболее понятным для клиента является пункт «Услуги», где он рассчитывает узнать, как заказать эффективную рекламу в соцсетях.
Но информация на странице «Услуги» не дает ответов на основные вопросы клиентов: сколько стоит реклама и аудит? Как будут проводиться работы? Каким должен быть результат? Поэтому нужно добавить информацию об ориентировочных ценах и указать результаты аудита.
7. Форма обратной связи в нижней части страницы также требует доработки. Поля для заполнения нужно сократить, а строки «Тема» и «Сообщения» объединить и увеличить их высоту, чтобы пользователь мог написать несколько предложений.
Вывод: чтобы избежать таких ошибок и повысить юзабилити сайта, нужно протестировать ресурс с точки зрения пользователя. Принимая работу у разработчиков и дизайнеров, пригласите человека, не знакомого со спецификой вашего бизнеса, откройте свой сайт на 5-7 секунд (в среднем именно столько времени пользователи проводят на главной странице) и попросите рассказать о впечатлениях.
Пользователь должен ответить, чем занимается компания, насколько читабелен текст и приятны изображения, какие акценты привлекают внимание и комфортно ли взаимодействовать с этим сайтом.
Кейс 2
В этом кейсе мы рассмотрим сценарий взаимодействия пользователя с сайтом и ожидания клиента при переходе на ту или иную страницу.
Сайт продает товары для садоводства и огородничества, сфера В2С. Основным источником трафика является SEO.
Пример сценария:
1. Целевая аудитория – люди, которые занимаются садоводством и хотят купить саженцы роз. В каталоге на главной странице сайта клиент находит товар и переходит на посадочную страницу.
2. На посадочной странице пользователь ожидает получить четкую информацию о том, какие саженцы есть в наличии и как их заказать. Но вместо этого видит длинный текст без всякой конкретики. Такой дизайн не решает задачи клиента, заставляя его совершить дополнительные действия: скроллить страницу вниз и искать список товаров.
3. Когда клиент доходит до выбора роз и кликает на понравившуюся миниатюру, он наконец попадает на страницу покупки.
4. На странице покупки, помимо описания саженца и другой полезной информации, пользователь видит ссылки, по которым можно уйти, не завершив процесс. Текстовый блок «Оплата» не отвечает на вопрос, как оплатить товар, но предлагает перейти в раздел «Доставка и оплата». Блок «Хотите этот товар еще дешевле?» уводит на страницу регистрации, также не объясняя, как изменится цена. Как только пользователь уходит в другой раздел, он может потерять выбранный саженец и в итоге отказаться от покупки.
5. При переходе в раздел «Оплата и доставка» по предложенной ссылке клиент видит лишь стандартную информацию, не связанную с его заказом. На этой странице нельзя продолжить покупку, поэтому нужно заново вернуться к описанию саженца, выбрать товар, проверить его цену и характеристики. Из-за постоянных переходов по ссылкам сайты теряют покупателей.
6. Текстовое наполнение страницы с саженцем должно сообщать клиенту практическую информацию о том, как ухаживать за выбранным растением и чего от него ждать в процессе роста. Но текст дает лишь общие сведения, не решая задачи покупателя.
7. В нижней части страницы мы видим данные о компании, но текст снова предлагает перейти по ссылке, чтобы узнать что-то еще. В итоге клиент снова уходит от покупки, тогда как главная цель сайта – удержать покупателя.
Еще один пример сценария: переход на посадочную страницу не из каталога, а с главной страницы.
1. Клиент выбирает товар и кликает по иконке, чтобы перейти к покупке.
2. В открывшейся вкладке пользователь ожидает увидеть подробную информацию о товаре и условиях покупки. Здесь он видит кнопку «Доставка. Тариф S», которая не говорит ничего о возможном изменении цены и уводит его на другую страницу.
Если на стоимость товара влияют разные тарифы, нужно сообщить об этом прямо в карточке товара, чтобы не потерять покупателя.
3. Когда пользователь кликает на поле «Купить», он видит панель с двумя кнопками: «Перейти в корзину» и «Вернуться к покупкам». Необходимость еще раз принимать решение усложняет процесс покупки, поэтому лучше сделать только одну ключевую кнопку.
Совет: чтобы определиться, нужны ли дополнительные кнопки, изучите размер стандартной корзины клиентов. Если пользователи в среднем покупают один товар, то после клика на кнопку «Купить» их можно сразу переводить в «Корзину», если больше одного – можно оставить кнопку «Продолжить покупки».
4. При переходе в «Корзину» клиент видит информацию о минимальной сумме заказа и только сейчас узнает, что не может завершить покупку. Вместо подсказки, что делать дальше (например, заказать еще 5 пар перчаток или полезный инвентарь), здесь доступны всего две кнопки: «Оформить заказ» и «Купить в 1 клик».
Чтобы не потерять клиента, ему нужно подсказать, что делать дальше, и дать возможность тут же добавить предложенные товары в корзину.
5. Нажав на кнопку «Купить в 1 клик», пользователь видит форму для заказа по телефону без объяснений, зачем она нужна. Не понятно, можно ли таким способом купить товар на сумму меньше минимальной, или это просто возможность проконсультироваться с представителем компании.
Сложные переходы и формы отвлекают человека от оформления заказа и отпугивают нетерпеливых покупателей.
6. Кликая на поле «Оформить заказ», человек попадает на соответствующую форму и видит сумму заказа с доставкой. Несмотря на то, что стоимость покупки меньше минимальной, информация о том, примут ли такой заказ, отсутствует. В результате пользователь доходит до финальной части взаимодействия с сайтом, не зная, удастся ли ему купить перчатки.
Если клиента нужно предупредить о чем-то, стоит сделать это как можно раньше!
Вывод: каждый шаг в сценарии взаимодействия пользователя с сайтом должен вести к главной цели – оформлению заказа. Не нужно дополнительных ссылок, которые уводят клиента от покупки. Каждая форма должна быть предельно информативной и отвечать ожиданиям пользователей.
Общие рекомендации
- Определите цели создания сайта: сбор заявок, информирование клиентов, продажа товаров и т. д.
- Разрабатывая сценарий продвижения пользователя по сайту, старайтесь сократить его до основных шагов.
- Минимизируйте ссылки, из-за которых клиент может уйти.
- Доносите свои мысли короткими и емкими тезисами, делая акценты на самом важном. Чем проще вы сформулируете обращение к пользователю, тем больше шансов, что вас поймут, а ваш продукт – купят!
- Изучайте статистику сайта: так вы легко определите, на каком этапе покупатели уходят, какой акцент работает неправильно, какую информацию воспринимают не до конца.
- Размещайте ключевую информацию в начале страницы, чтобы ее было видно в первую очередь.
- Разбавляйте текстовый контент картинками, видео, инфографикой и другими акцентами.
- Если хотите, чтобы пользователь заполнил какую-либо форму, сделайте ее заметной, контрастной и удобной.
Понравилась статья? Подпишитесь на YouTube-канал SalesDoubler, чтобы смотреть свежие вебинары от топовых экспертов в сфере арбитража и интернет-маркетинга!
