Юзабилити сайта: что это и как проверить удобство за 15 шагов

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

Не начинайте с вопроса «Нравится ли мне сайт?». Запишите конкретный сценарий: «Найти услугу, понять состав и отправить запрос на расчёт». Для магазина это может быть поиск товара с нужными характеристиками, для студии: просмотр подходящей работы и обращение.

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

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

1. Понятно ли предложение. По первому экрану можно объяснить своими словами, что продаёт компания и кому это подходит.
2. Видны ли существенные условия. География, состав услуги, ограничения и способ расчёта не спрятаны за общими обещаниями.
3. Совпадает ли название ссылки с результатом. «Цены» ведут к ценам или понятному объяснению расчёта, а «Контакты» к способам связи.
4. Можно ли вернуться назад. После просмотра работы, товара или раздела понятно, как продолжить выбор, не начиная всё сначала.
5. Удобно ли меню на телефоне. Оно открывается, закрывается и не перекрывает важное действие без возможности его завершить.
6. Читается ли текст. Не приходится постоянно увеличивать страницу; строки, подписи и условия заказа различимы.
7. Различимы ли ссылки и кнопки. Человек понимает, на что можно нажать, без перебора случайных элементов.
8. Можно ли нажать нужную кнопку пальцем. Соседние элементы не приводят к постоянным ошибочным нажатиям.
9. Не мешают ли всплывающие окна. Их можно закрыть, после закрытия доступны текст, меню и форма.
10. Понятен ли состав предложения. Для услуги перечислен результат работы, для товара доступны нужные для выбора характеристики.
11. Объяснены ли цена и следующий шаг. Если стоимость индивидуальная, указано, какие сведения нужны для расчёта и как его получить.
12. Просит ли форма только необходимые сведения. Посетитель понимает, зачем нужны обязательные поля и какой способ связи выбрать.
13. Помогают ли сообщения об ошибках. Сайт показывает, какое поле нужно исправить, и сохраняет остальные введённые данные.
14. Видно ли подтверждение отправки. После заявки человек понимает, что сообщение принято и чего ждать дальше. Тестовая заявка действительно доходит компании.
15. Можно ли пройти основной путь с клавиатуры. При переходах клавишей Tab видно положение фокуса, важные элементы доступны, меню и окна не создают ловушек.

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

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

Для каждой проблемы достаточно пяти полей:

Страница и устройство: Адрес, модель телефона или ширина окна

Задание: Что человек хотел сделать

Препятствие: Что произошло и чего он ожидал

Подтверждение: Скриншот, запись экрана или последовательность действий

Проверка после правки: Как убедиться, что проблема устранена


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

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

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

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

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

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

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