Что такое юзабилити сайта: анализ, примеры, чек-лист

Что такое юзабилити сайта: анализ, примеры, чек-лист

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

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

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

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

Принципы юзабилити веб-сайтов

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

Умеренность в дизайне

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

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

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

Структурированный контент

Текст — базовый элемент, от которого в огромной степени зависит удобство сайта. Заинтересованный пользователь скорее обращает внимание на логику, информативность и отсутствие ошибок в тексте и лишь потом оценит объем контента на странице. 

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

Коммуникация с посетителями

Человек на сайте не должен задаваться вопросами «как», «куда» и «где»? Споткнувшись один-два раза о запутанную или сложную навигацию и не получив подсказок, он может уйти к конкурентам.

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

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

Все важное — на виду

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

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

Нужна проработка юзабилити?

Создадим или доработаем дизайн вашего проекта.

Подробнее

Как оценить юзабилити сайта

Необходимость провести анализ usability, как правило, вызвана следующими причинами: 

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

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

Подготовка к анализу usability сайта

Проверку начинают с планирования ключевых этапов.  

Цели

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

В этом случае цель юзабилити анализа — разобраться, в чём конкретно новое оформление хуже старого. 

Гипотезы

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

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

Сценарии

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

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

Технические параметры аудита

Перед проверкой следует согласовать основные технические параметры предстоящего аудита.

Модерация:

  • Да — респонденты (участники тестирования) проходят путь пользователя под контролем модератора, выполняя его задания и отвечая на вопросы;
  • нет — тестирование ведется в автономном режиме, данные собираются автоматически, обратная связь отсутствует.

Цели:

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

Локация:

  • очно — фокус-группа и модератор находятся в одном, общем месте (лаборатории);
  • удаленно — участники тестирования расположены независимо друг от друга.

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

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

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

  • Процент отказов (BR, bounce rate) — количество посетителей, покинувших сайт со страницы входа. Причина, может быть в не релевантном запросу контенте, сложной навигации и слабом дизайне и т.д. Проблемы с BR ведут к понижению веб-ресурса в поисковой выдаче.
  • Вернувшиеся пользователи (RV, returning visitors) — посетители, которые в течение расчетного периода заходили на страницу несколько раз. Большие показатели этой метрики говорят о лояльности аудитории, и позволяют предполагать удовлетворительное качество usability сайта.
  • Глубина просмотра (PPV, pages per visit) — количество страниц, просмотренных пользователем в рамках одного визита. Высокое значение этого поведенческого фактора свидетельствует о привлекательности сайта и позитивно влияет на ранжирование.
  • Время, проведенное пользователем на сайте (TSS, time spent on site) — очевидный маркер качества площадки. Чем дольше посетители остаются на сайте, тем он полезнее. Поисковики, ориентируясь на TSS, определяют место страницы в выдаче.

Указанные метрики — часть стандартного набора инструментов Google Analytics (GA) и Яндекс.Метрики (ЯМ). В расчетах некоторых поведенческих факторов эти системы могут использовать различные алгоритмы и по-своему отображать результаты анализа. Однако принципиальной разницы для понимания сути проблем и разработки стратегии по оптимизации интернет-платформы в них нет.

Тестирование юзабилити сайта

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

Коридорный тест

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

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

Анализ отзывов

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

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

A/B-тестирование

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

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

Наблюдение со стороны

Тестирование с участием фокус-группы. Допускается очный и удаленный формат. Участники работают с приложением/сайтом в стандартном режиме или выполняют задания под контролем модератора. Последний следит за процессом при помощи Яндекс.Вебвизора или любого доступного сервиса видеозаписи экрана. 

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

Экспертный аудит

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

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

Чек-лист юзабилити сайта

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

База

  • Сервис адаптивен, стабильно отображается на экранах со всеми популярными разрешениями. 
  • Скорость загрузки — 1-2 сек.
  • Сайт имеет SSL-сертификат.
  • Главная страница поддерживает основные принципы юзабилити — человеку очевидно, где он, и что делать дальше.
  • Региональные версии (если они есть) определяются корректно и легко переключаются.
  • У ресурса есть заметный favicon.
  • Для всех страниц прописаны внятные тайтлы.
  • Для сайта с регистрацией есть возможность входа через социальные сети.
  • Полноценная страница-404 с доступом к меню.

Навигация

  • Клик по логотипу активирует переход на главную страницу.
  • Главное меню расположено в шапке. Разделы верхнего уровня продублированы в подвале.
  • Меню ограничено основными разделами (до 8 ссылок).
  • Порядок пунктов меню подчинен логике: самое важное — в начале.
  • Названия пунктов понятны.
  • Ссылка раздела, в котором находится посетитель, выделена и неактивна.
  • Внутренние страницы имеют активные «хлебные крошки».
  • Кнопка «Назад» присутствует во всех разделах. 
  • На сайте нет «тупиковых» страниц.

Поиск

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

Дизайн и UI

  • Текст на сайте имеет формат текста, а не изображения.
  • Все иконки в интерфейсе осмыслены и логичны.
  • У страниц общий внешний вид и структура, они единообразны.
  • Общие блоки и элементы не меняют место при переходе на новую страницу.
  • Значимый контент — слева, второстепенный — справа.
  • Кликабельность интерактивных элементов очевидна, они достаточно крупные.
  • Курсор меняет вид при наведении на активный элемент.
  • Текстовая строка имеет длину не более 80 символов.
  • Сайт допускает внутреннее перемещение при помощи клавиатуры.
  • Комфортный размер шрифта — минимум 16px.

Конверсия

  • Конверсионные элементы хорошо заметны.
  • Каждый коммерческий раздел позволяет совершить целевое действие.
  • Текст на кнопках исключает двусмысленное толкование результата нажатия.

Контакты, формы, обратная связь

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

Текст

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

Изображения

  • Все изображения несут смысловую нагрузку, имеют высокое качество, для них прописаны alt и title.

Вывод

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

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

Нужна проработка юзабилити?

Создадим или доработаем дизайн вашего проекта.

Подробнее