Что такое юзабилити и как его проверить: подробный гайд

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

Рассказываем, что такое юзабилити, и как провести его тестирование.

Что такое юзабилити

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

Юзабилити анализ сайта помогает достичь таких целей:

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

Пример продуманного юзабилити: возле каждого товара перечислены основные характеристики, кнопка «В корзину» сразу заметна, есть много фильтров, которые помогут быстрее найти нужный ноутбук

Юзабилити особенно актуален для e-commerce. Например, в интернет-магазине должны быть понятные карточки товаров, заметные кнопки «Купить», формы регистрации с небольшим количеством полей. При этом другим компаниям тоже нужно продумать юзабилити. Так, если сайт образовательного центра выглядит старым, неудобным, имеет неактуальную информацию, скорее всего, будущие студенты станут искать другие варианты.

Принципы юзабилити

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

Приятный дизайн

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

Используйте визуальное оформление, соответствующее вашей целевой аудитории. Например, если продаете товары для рыбалки, а ваша ЦА — мужчины 35-55 лет, не стоит использовать яркие неоновые оттенки, вычурные шрифты.

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

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

Простая навигация

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

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

При первом взгляде на меню читатель поймет, что находится в каждом разделе

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

В меню есть пункт «Еще 10»: при наведении на него открываются другие разделы, которых сразу не видно

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

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

Качественный контент

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

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

Самая важная информация — сверху слева

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

Первое, на что обратит внимание пользователь, — основные разделы интернет-магазина и кнопка, открывающая каталог

Обратная связь

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

Пример того, как может выглядеть ошибка 404

Простая форма регистрации

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

Тестирование юзабилити: основные методы

Тестирование можно провести разными способами. Рассмотрим основные методы, их преимущества и недостатки.

Анализ статистики

Изучите статистику специальных сервисов — Google Analytics или Яндекс.Метрики. С их помощью можно вычислить время, проведенное на сайте, процент конверсии, скорость загрузки ресурса. Такое тестирование проводят для уже запущенных проектов. Также, выполняя анализ юзабилити важно просматривать тепловую карту кликов, карту скроллинга, аналитику форм (в том числе на мобильных устройствах) и отчеты Вебвизора, чтобы лучше понимать поведение пользователей и проблемы, с которыми сталкиваются посетители вашего сайта. Подробный анализ позволит выявить проблемы и определить естественные точки роста поведенческих факторов, а также увеличения числа целевых действий.

Фокус-группа

Тестирование проводят с участием 5–10 респондентов из вашей ЦА. Им нужно выполнить заранее определенные действия. Комментарии участников помогут обнаружить недочеты, исправить их. Тестирование проводят для новых и уже запущенных сайтов.

Отзывы

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

Экспертное тестирование

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

Этапы проверки

UX-дизайнеры проводят тестирование в несколько этапов. Рассмотрим подробно каждый из них.

Тестирование на соответствие правилам Нильсена

Якоб Нильсен — специалист по UX, который составил 10 правил качественного интерфейса:

1. Видимость состояния системы. Пользователь всегда информирован о текущем состоянии интерфейса, может воздействовать на него. Пример: при загрузке страницы появляется индикатор прогресса, чтобы у пользователя не было ощущения задержки.
2. Понятность. Все страницы «говорят» на понятном человеку языке. Нет жаргона, сложной профессиональной лексики, а также сухого, роботизированного языка. Правило распространяется и на активные элементы. Пример: кнопка удаления имеет вид мусорной корзины, поэтому сразу ясно, какую функцию она выполняет.
3. Подсказки. Система предупреждает о возможных проблемах, предлагает способы их решения. Пример: при регистрации подсвечиваются незаполненные поля.
4. Стандарты. Каждая страница соответствует понятному, привычному шаблону, чтобы пользователи не запутались. Например, меню обычно расположено в верхней части каждой страницы.
5. Минимализм. На экране только самое важное, чтобы избежать перегрузки пользователей лишней или несущественной информацией. Например, в карточке товара отображается только название, цена, основные характеристики продукта. А подробности можно посмотреть, если нажать на отдельную кнопку.
6. Гибкость использования. Интерфейс удобный для разных людей — как новичков, так и постоянных посетителей. Например, если человек делает заказ не первый раз, ему не нужно заново регистрироваться. А новым пользователям сайт предлагает заполнить необходимые поля.
7. Привлекательный дизайн. Интерфейс эстетически приятный, минималистичный, не отвлекает от основных задач, действий.
8. Интуитивность. Сайт понятный, посетители могут работать с ним без обучения.
9. Возможность исправить ошибки. Когда посетитель допускает ошибку, ее можно исправить или вернуться к предыдущему шагу. Пример: при удалении товара из корзины человек должен подтвердить свое действие или отменить его, чтобы предотвратить случайное нажатие.
10. Адаптивность. Интерфейс доступен людям с ограниченными возможностями. Пример: человек может увеличить размер текста, если есть проблемы со зрением.

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

Тестирование с помощью специальных сервисов

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

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

Качественное исследование

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

Предполагает тестирование таких параметров:

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

Чем больше параметров охватят тесты, тем более полную картину вы получите

Качественное тестирование часто проводят с участием фокус-групп. Процессом руководит модератор. Он общается с участниками, отслеживает их реакции, действия. Можно запустить исследование по такому алгоритму:

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

Количественное исследование

Цель исследования: получить информацию о производительности и эффективности продукта.

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

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

Внесение изменений

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

После внедрения изменений отслеживайте показатели, вносите дополнительные корректировки, если результат вас не устраивает

Резюме

1. Юзабилити показывает, насколько пользователям удобно взаимодействовать с сайтом.
2. Юзабилити — одна из основ работы ресурса, особенно в e-commerce. Показатель влияет на посещаемость, конверсию, репутацию бренда, позиции в выдаче поисковиков.
3. Юзабилити должен соответствовать ряду параметров. Среди них — минималистичный дизайн, простая навигация, понятная структура, полезный контент и т. д.
4. Чтобы оценить удобство ресурса, проводят тесты с участием реальных пользователей или людей из целевой аудитории.
5. Если внедрить рекомендации, получится улучшить удобство работы с интерфейсом.