Юзабилити сайта — это удобство выполнения нужной задачи: найти услугу, сравнить материалы, отправить обращение или изменить запись. Проверять его полезно через конкретные действия, а не через общее впечатление от красоты страницы.
Ниже — чек-лист для первичного просмотра. Он поможет собрать воспроизводимые затруднения и подготовить работу над ними. Такой просмотр не объяснит автоматически все причины ухода посетителей, но даст предметный список для обсуждения.
При аудите юзабилити сайта важно заранее выбрать задачи и границы проверки. Тогда результатом станет описание препятствий с примерами, а не перечень личных предпочтений проверяющего.
В материале
Выберите действие и исходные условия
Начните с одного обычного действия. Например, человеку нужно выяснить, выполняет ли компания определённую работу, какие сведения подготовить и как получить ответ. Чем конкретнее задача, тем проще заметить, где сайт перестаёт помогать.
Не формулируйте задание словами интерфейса. Фраза «нажмите пункт “Услуги” и откройте форму» уже подсказывает путь. Лучше описать потребность: «Нужно обсудить изготовление детали; найдите подходящее направление и способ передать информацию».
Задайте стартовую страницу. Посетитель может открыть не главную, а отдельную услугу или материал. Проверьте, понятно ли ему, где он находится, кто предлагает работу и куда двигаться дальше без обязательного возвращения к началу сайта.
- Сформулирована задача без подсказки о нужной кнопке.
- Выбрана исходная страница и устройство.
- Понятно, какой наблюдаемый результат завершает действие.
- Подготовлены обычные материалы вместо удобных демонстрационных примеров.
Если проверяете сайт самостоятельно, учитывайте знание его устройства. Вы уже знаете названия разделов и расположение форм. Пригласите человека, который не участвовал в разработке, выполнить задачу, и наблюдайте за его действиями, не объясняя маршрут заранее.
С согласия участника можно сохранять необходимые заметки о ходе проверки. Для описания затруднения обычно достаточно страницы и последовательности действий. Не нужно собирать личные сведения, которые не относятся к задаче.
Проверьте ориентиры и названия
Откройте исходную страницу и посмотрите, можно ли понять её назначение. Заголовок должен помогать сопоставить содержание с задачей. Декоративное название без объяснения может затруднить выбор даже в аккуратном меню.
Сравните обозначения в разных местах. Если в меню услуга называется одним словом, в карточке другим, а в форме третьим, человеку приходится самостоятельно выяснять, идёт ли речь об одном предложении. Согласуйте названия или объясните различия.
Проверьте путь назад и переход к соседнему варианту. Неверный выбор не должен заставлять начинать всё сначала. Для сложного состава услуг полезно понимать, в каком разделе находится посетитель и какие варианты доступны рядом.
- По заголовку можно понять содержание страницы.
- Ссылки описывают ожидаемый переход.
- Одинаковые действия называются последовательно.
- Состояние выбранного пункта различимо.
- После открытия подробностей можно продолжить выбор.
Не оценивайте меню только по количеству пунктов. Короткий список может скрывать непонятные объединения, а длинный — состоять из знакомых ясных названий. Проверка должна показать, находит ли человек подходящее направление.
Посмотрите и на различие ссылок с обычным текстом. Если кликабельность становится понятна только после случайного наведения, на телефоне этот ориентир может не помочь. Нужное действие должно оставаться заметным в обычном состоянии страницы.
Проверьте содержание перед обращением
Для выбора недостаточно увидеть красивую обложку. Посетителю нужны сведения, которые относятся к его задаче: состав услуги, ограничения, примеры и порядок следующего шага. Отметьте вопросы, на которые страница не отвечает.
В проекте «Бестмастерс» наша работа включала структуру, тексты и дизайн сайта производителя металлоконструкций. Информацию распределяли по блокам вокруг услуг и условий работы. Такой пример помогает обсуждать, какие сведения нужны человеку до передачи задачи производителю.
Для собственного сайта составьте похожую проверку без предположений о поведении клиента. Может ли посетитель понять, подходит ли его задача компании? Доступен ли пример соответствующего вида работы? Ясно ли, что потребуется сообщить при обращении?
- Основные условия представлены текстом и доступны для чтения.
- Примеры относятся к выбранному предложению.
- Важные ограничения не спрятаны после формы.
- Человек понимает следующий шаг и его результат.
Если сведения уже есть, проверьте порядок их подачи. Условия, которые нужны для выбора, полезно показать до обязательного обращения. Необходимость каждый раз объяснять одно и то же в переписке — повод проверить содержание страницы.
Проверьте чтение при обычном размере экрана. Длинная строка, текст поверх подробной фотографии и случайное выделение могут мешать разбирать условия. Оценивать нужно настоящий материал, а не только короткий образец заголовка.
Пройдите форму до получения результата
Назначение поля должно быть понятно до ввода и после него. Проверьте обязательные поля, допустимый формат и пояснения. Если человек должен приложить файл, условия такого действия стоит сообщить до неудачной попытки отправки.
Руководство W3C по подписям полей объясняет связь подписи с соответствующим элементом формы. Для первичного просмотра проверьте хотя бы понятность назначения каждого поля; техническую доступность оценивают отдельно.
Попробуйте отправить форму с пропущенным обязательным полем и с неподходящим значением. Нужна подсказка о том, что исправить. Одного изменения цвета может быть недостаточно для понимания причины.
В руководстве W3C об уведомлениях формы рассматриваются сообщения об ошибках и успешном выполнении. Полезно проверить, не теряются ли уже введённые сведения и понятно ли, как продолжить после замечания.
- У каждого поля есть понятное назначение.
- Ошибка связана с конкретным полем или действием.
- Сообщение помогает исправить ввод.
- После отправки понятен результат.
- Обращение действительно получает нужный сотрудник.
Используйте контрольные данные без сведений реальных клиентов. Заранее предупредите ответственного о проверке и подтвердите получение результата. Сообщение «успешно отправлено» на странице не заменяет эту часть.
Повторите обычное действие с телефона и клавиатуры. Посмотрите, доступно ли управление, видно ли активное поле и можно ли завершить ввод без мыши. Найденные трудности запишите как отдельные наблюдения.
Запишите находки так, чтобы их можно было исправить
Проверьте и ситуации без подходящего результата. В каталоге это может быть пустая подборка после выбора условий, на сайте услуг — отсутствие нужного направления. Посмотрите, объясняет ли страница происходящее и даёт ли разумный следующий шаг, вместо того чтобы оставлять пустое место.
Не подсказывайте участнику правильный ответ сразу после паузы. Сначала выясните, что он ожидает увидеть и почему выбрал этот путь. Вопрос «что вы сейчас ищете?» помогает понять затруднение, а фраза «нужная кнопка справа» скрывает его.
Отдельно отмечайте ожидание и технический сбой. Человек может не заметить подтверждение выполненного действия, хотя система сработала. Или наоборот: интерфейс показывает успех, но результат не получен. Внешне обе ситуации похожи на «непонятно, отправилось ли», а исправления будут различаться.
Найденное затруднение ещё не показывает, как часто оно встречается. Наблюдение помогает найти причину конкретного затруднения и подготовить изменение. Чтобы оценить распространённость проблемы, потребуются подходящие данные и отдельно согласованный способ измерения.
Перед передачей списка сгруппируйте находки по причинам. Разные страницы могут использовать одну форму или общий элемент меню. Тогда повторяющиеся симптомы стоит связать с общей задачей, сохранив примеры. Это поможет исполнителю оценить объём и не потерять проверку отдельных сценариев.
Фраза «неудобная форма» не объясняет работу. В записи нужны страница, действие, наблюдаемый результат и следствие для задачи. Предлагаемое исправление стоит отделить от самого наблюдения.
| Действие | Наблюдение | Что проверить дальше |
|---|---|---|
| Найти нужную услугу | Названия в меню и на странице различаются | Можно ли согласовать обозначения |
| Сравнить варианты | Условия расположены в разных местах | Какие сведения нужны рядом |
| Исправить ввод | Форма показывает общее сообщение | Можно ли указать конкретную причину |
| Завершить обращение | Результат отправки непонятен | Как подтвердить действие и получение |
Это условные примеры записей, а не результаты проверки определённого сайта. В собственном списке сохраняйте фактическое поведение. Если проблема не повторяется, отметьте обстоятельства, вместо того чтобы выдавать предположение за установленную причину.
Сначала обсудите препятствия, из-за которых действие не завершается. Затем — затруднения выбора и чтения. Косметические замечания тоже можно сохранить, но они не должны скрывать неработающее обращение.
После исправления повторите исходную задачу. Появление нового элемента ещё не подтверждает, что затруднение устранено. Если требуется переработка интерфейса, найденные сценарии станут основой для новых макетов сайта и их проверки.
Что делать дальше
- Выберите обычную задачу посетителя и стартовую страницу.
- Пройдите ориентиры, содержание и форму по чек-листу.
- Запишите затруднения с примерами и отделите их от предположений.
- Пришлите нам сайт и сценарий, чтобы обсудить проверку удобства.
Читайте также