Примеры анализа юзабилити сайта

7 мин.
10668
Команда AskUsers
Команда AskUsers
03 июля 2023 • 7 мин.
Содержание

8 причин провести аудит юзабилити

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

Чем поможет анализ сайта?

  1. Улучшить UX

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

  3.  Повысить коэффициент конверсии

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

  5.  Улучшить поведенческие факторы для SEO

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

  7.  Обеспечить доступность

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

  9.  Увеличить производительность

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

  11.  Получить конкурентное преимущество

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

  13.  Определить приоритеты

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

  15.  Повысить экономическую эффективность

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


Критерии оценки: что нужно проверить

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

  • Обучаемость: легко ли новым пользователям выполнить основные задачи при первом посещении сайта? Сразу ли человек может понять, как взаимодействовать с элементами, функциями или всем разделом в целом?

  • Эффективность: дизайн должен обеспечивать возможность быстро и беспрепятственно выполнить задачи.

  • Запоминаемость: могут ли посетители использовать интерфейс, если они вернутся через месяц?

  • Недочеты: сколько ошибок совершают люди при работе с сайтом? В чем они заключаются? Как легко они могут исправить ситуацию?

  • Удовлетворенность: приятно ли людям взаимодействовать со страницами? Удовлетворены ли они своим опытом? Это можно оценить с помощью отзывов пользователей, обзоров или опросов.

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

  • Отзывчивость: адаптируются ли макеты к разным разрешениям экрана, например, у смартфонов или планшетов?

  • Скорость: быстро ли загружается контент и важные функции?

  • Надежность: вызывает ли дизайн доверие?

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

Методы анализа и сбора данных

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


Эвристическая оценка по Нильсену

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

  • Наглядность состояний или обратная связь: система должна информировать пользователей о том, что происходит.

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

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

  • Последовательность и стандарты: посетители не должны задумываться, означают ли разные слова, ситуации или действия одно и то же.

  • Предотвращение ошибок: дизайн нужно прорабатывать так, чтобы он предотвращал проблемы.

  • Распознавание, а не запоминание: минимизируйте нагрузку на память, делая объекты, действия и опции видимыми.

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

  • Минимализм: UI не должны содержать лишнюю информацию, которой редко пользуются. Каждый дополнительный элемент конкурирует с важными компонентами, отвлекая внимание людей.

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

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

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

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


Пример экспертного отчета от AskUsers

Анализ тепловых карт

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


Есть несколько типов тепловых карт, которые можно использовать для анализа разных аспектов поведения:

  • По кликам: они отслеживают, куда пользователи нажимали на странице. Анализ помогает понять, с какими элементами пользователи взаимодействуют больше всего, и определить кликабельные области, которые этого не предусматривают.

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

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

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


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

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

Анализ поведенческих факторов

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


Какие метрики учитывать?

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

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

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

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

Пользовательские тестирования

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


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

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

Данные, собранные в ходе проверки, могут быть:

  • количественными, например, процент выполнения заданий, время, затраченное на выполнение задания, количество ошибок;

  • качественными — комментарии участников, выражения их лиц, язык тела.

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

Список основных элементов для проверки

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

Функциональность

  • Скорость загрузки. Быстро ли сайт загружается на всех устройствах и браузерах? Для его работы нужен быстрый интернет? Работу замедляют видео и изображения в большом разрешении, плохо написанный код, который запускает несколько процессов одновременно.


  • Навигация. Поиск, меню, информационная архитектура просты и понятны для использования? Навигационные элементы не меняются, остаются последовательными вне зависимости от раздела?


  • Функция поиска. При использовании поиска система выдает точные и релевантные результаты? Часто проблема с этим компонентом возникает у агрегаторов или других платформ, которые используют elastic search.

  • Формы и транзакции. Можно ли убрать какие-то поля? Понятно ли человеку, в каком формате указать дату? Есть ли подсказки? Страница с вводом данных карты выглядит надежно?


  • Ссылки. Все ли ссылки и кнопки работают? По тексту понятно, на какую страницу они переносят?

  • Совместимость. В браузере Safari функции работают так же хорошо, как в Google Chrome или Firefox? Реально ли выполнить задачу на телефоне?

  • Обработка ошибок. Если человек совершил ошибку, он поймет, что что-то пошло не так? Даете ли вы информацию о том, как ее исправить?


Дизайн

  • Макеты. Аккуратная ли сетка? Разметка общая для всех страниц? Все элементы на своих местах?


  • Типографика. Хорошо ли читается текст? Не сливаются ли буквы с фоном? Достаточно ли расстояний между строчками для удобства чтения?

  • Цвета. Отражают ли они настроение? Не режут ли глаз? Достаточно ли кнопки или тексты выделяются среди общего полотна?


  • Изображения и иконки. Уместны ли изображения? Все ли иконки понятны или для пояснения их смыслов нужны текстовые описания? Нет ли пикселей на фотографиях? Хорошо ли они загружаются?

  • Белое пространство. Есть ли на сайте «воздух»? Не слишком ли близко элементы расположены друг к другу?

  • Отзывчивость. Дизайн адаптирован под мобильные устройства? Учитывает ли он поведенческие паттерны со смартфона? Иногда разработчики просто масштабируют страницы под маленькие экраны, не думая о том, что опыт взаимодействия с телефоном отличается.


Контент

  • Удобочитаемость. Содержание понятно? Не слишком ли сложные конструкции вы используете? Говорите ли вы с пользователями на их языке — не злоупотребляете ли терминами?

  • Релевантность. Соответствует ли контент запросам пользователей? Актуален ли он? Помогает ли вашим потенциальным клиентам?

  • Точность. Информация проверена? Факты остаются актуальными? Иногда статьи стоит пересматривать и редактировать, поскольку появляются обновленные данные.

  • Заголовки и подзаголовки. Разделяете ли вы смысловые блоки текста? Точно ли их название отражает содержание? Помогают ли они направлять внимание читателей?

  • Призывы к действию. Понимает ли человек, что вы от него хотите? Отражают ли кнопки смысл действий?

  • Согласованность. Последовательный ли у вас тон? Как вы общаетесь с аудиторией — на «ты» или на «вы»? Какой стиль общения выбран — формальный или более разговорный?

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

Резюме

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

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

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

Узнайте, как увеличить конверсию на 41%!
Выберите
ваш сайт
Укажите сайт и получите 7 точек роста.
Рассчитайте
стоимость
Контролируйте стоимость и состав услуги. Авторизуйтесь и выбирайте только то, что нужно вам.
Получите результат
и сопровождение
После оплаты и выполнения задания продолжайте получать регулярные советы и рост конверсий.
Понравилась статья? Жмите лайк или подписывайтесь на рассылку.

А также поделитесь статьей с друзьями в соцсетях.

Команда AskUsers
Команда AskUsers
Популярные статьи