Юзабилити веб-сайта и других digital-продуктов: аудит и тестирование

Для чего нужно Юзабилити сайта?

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

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

Юзабилити — из чего оно складывается

• Усваиваемость. Легко ли пользователю дается выполнение базовых задач, сценариев, если он видит интерфейс первый раз.
• Эффективность. Скорость выполнения задач после знакомства с интерфейсом.
• Запоминаемость. Могут ли люди быстро восстанавливать работу, если возвращаются к интерфейсу после длительного периода его неиспользования.
• Ошибки и их частота. Серьезны ли они, может ли человек после них восстановиться.
• Удовлетворенность. Все ли понятно пользователю, приятно ли ему работать с интерфейсом.

Пользу интерфейса можно рассчитать. Для этого предлагается использовать формулу:

П = Ю + Ф, где П — Полезность, Ю — Юзабилити, Ф — Функциональность.

Принципы качественного userusability

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

• Соответствие юзабилити реальному миру и стандартам.

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

• Контроль и свобода выбора.

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

• Юзабилити и принцип навязчивости.

Человек открывает сайт, и через 3 секунды видит всплывающее окно с вопросом: "Не нашли то, что искали? Оставьте ваш телефон!". Такой агрессивный маркетинг раздражает и мешает восприятию действительно полезного контента.

• Последовательность.

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

• Предотвращение ошибок.

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

• Проще распознавание, чем воспоминание.

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

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

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

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

Роль юзабилити в современном мире

Развивающиеся технологии постоянно усложняют принципы разработки и использования digital-систем, хотя многие элементы интерфейсов в настоящее время нам кажутся привычными. К примеру, текстовые редакторы строятся по единому принципу, а на веб-страницах главное меню, контакты, название компании всегда размещаются сверху. Таким образом пользователи могут концентрироваться на выполнении задач, и рабочий процесс для них не вызывает трудностей. Нет необходимости изучать меню интерфейса, читать разделы помощи, анализировать архитектуру ПО, значения кнопок и иконок, структуру управления. Нет необходимости в доскональном понимании работы ПК и ПО. Мы не отвлекаемся на интерфейс. С хорошим юзабилити все шаги и понятные, простые и дают прогнозируемый результат.

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

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

Главные правила электронной коммерции

• Если пользователь Сети не может быстро найти то, что ему нужно, он просто уходит.
• Если ему приходится долго ждать — получается тот же результат. Страница загружается более 2 секунд? Будьте готовы к тому, что огромное количество потенциальных клиентов так и не попадут на ваш сайт.
• Если человек не понимает, чем занимается компания, и что она ему даст — он так же уходит.
• Когда информация представлена ненаглядно, сложна для восприятия, не дает ответы на вопросы пользователя — он уходит.

Юзабилити веб-ресурса — рекомендации

Пользуйтесь в юзабилити принципом "проще — значит лучше".

Общепринятая структура помогает легче ориентироваться и меньше времени занимает для поиска нужного контента.

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

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

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

Главный показатель хорошего юзабилити — читабельные тексты.

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

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

Удобная регистрация, статус принятого заказа, не найденная страница — держите пользователя в курсе происходящего на веб-ресурсе.

Расскажите, что ему предпринять дальше, напишите ему номер заказа, объясните, как искать нужную информацию и т.д.

Человек может передумать — предоставьте ему эту возможность. Например, ВКонтакте может восстанавливать страницу после удаления и т.п.

Предлагайте помощь ненавязчиво.

Огромные всплывающие окна с предложениями, номер телефона на 30% экрана отталкивают, выглядят навязчиво, мешают функционалу.

Говорите с пользователем на одном языке.

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

Все должно быть на виду.

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

Формы должны быть простыми.

Чем больше в них полей — тем хочется меньше тратить времени и сил на заполнение.

Больше "воздуха" — представьте, что сайт - это жилая комната.

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

Методики тестирования юзабилити

Сначала необходимо провести аудит юзабилити.

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

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

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

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

Методики тестирования сайтов

• Фокус-группы из целевой аудитории.

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

• Индивидуальные интервью или опросы пользователей в спокойной обстановке.

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

• Изучается статистика.

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

• Есть еще один простой метод — среднему пользователю в незнакомом месте ставится задача.

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

Повторное тестирование юзабилити – лучший способ улучшения восприятия сайта пользователями. Чем больше вариантов вы проанализируете - тем совершеннее получится интерфейс.

Редизайн сайта и его юзабилити

Если вы ставите разработчикам задачу изменить дизайн — самое время продумать новый интерфейс.

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

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

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