Все об интернет-маркетинге
из первых рук
Подписаться на рассылку подписаться
на рассылку
нас уже
111 713

10 правил юзабилити на все времена

Мы ведем наш дайджест с 2012 года, и обладаем главной базой приемов по продвижению интернет-проектов.

Десять правил выведены гуру юзабилити Якобом Нильсеном — одним из основателей компании “Nielsen Norman Group”, оказывающей консультационные услуги в области юзабилити. Свои правила Нильсен назвал “эвристиками”.

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

Якоб Нильсен сформулировал 10 эвристик в 1990 году, но, несмотря на прошедшие годы, они не теряют своей актуальности. В этой статье я приведу их перевод, дополню содержание своим опытом, а также проиллюстрирую примерами с современных сайтов.


Когда можно использовать эвристики?


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


10 эвристик Якоба Нильсена


1. Информированность о состоянии системы


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

Одна из частых ошибок многих интернет-магазинов — после оформления и отправки формы заказа пользователем оставлять его наедине с самим собой. Сразу возникает много сомнений — а работает ли магазин? Все ли верно я сделал? Может быть, ошибся в контактных данных? Когда я получу свой заказ? Особенно страшно, когда заказ был оплачен, например, банковской картой.

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


2. Схожесть системы с реальным миром


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

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

В качестве примера — сайт по продаже книг. Сначала в меню слева я выбрала категорию — “Книги на бумаге” (первый шаг обведен в зеленый прямоугольник). На следующем уровне навигации я ожидала увидеть тематики, категории книг, но вместо этого сайт стал общаться со мной на своем, только ему понятном языке:


3. Свобода действий


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

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

Например, при удалении страницы система дает возможность ее восстановить:


4. Единообразие и стандарты


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

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

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

Если же все товары у вас находятся в “Каталоге товаров”, то при переходе со страницы на страницу пользователь не должен вдруг обнаружить раздел “Наша продукция”.


5. Предотвращение ошибок


Сведите к минимуму количество условий, в которых могут быть допущены ошибки.

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

Или еще лучше — с примерами данных:

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


6. На виду, а не в памяти


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

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


7. Гибкость и эффективность


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

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

В приведенном примере пояснения к уже привычной для многих пользователей интернет-опции “Заказать звонок” явно избыточны и содержат ненужную информацию.

Еще один пример гибкости на сайте — использование выпадающих списков в формах регистрации/заказа вместо полей свободного ввода с клавиатуры. Исследования подтверждают: выбирать из вариантов гораздо проще, чем вписывать данные. Особенно странно выглядят формы, в поля которых требуется ВПИСАТЬ город проживания или дату доставки.


8. Эстетичный и минималистичный дизайн


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

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

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

И хотя про избавление от лишних полей в формах не говорил только ленивый, но сайтов, где для оформления заказа требуется заполнить аж 10—15 пунктов, меньше не становится. Замечу, что это только первый шаг оформления заказа, впереди еще оплата!


9. Понимание проблем и их решение


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

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


10. Справочные материалы и документация


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

Справочные материалы должны быть лаконичными и содержать только четкие руководства к действиям.

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

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

Например, так:

И так:


Являются ли эвристики панацеей?


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

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

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




Комментарии (9)

Алекс 12.12.2013
Анастасия, вы по прежнему мой кумир, очень познавательно!

Aneliya 14.12.2013
Спасибо, очень кстати.

Анастасия Бадина
Анастасия Бадина
16.12.2013
Алекс и Aneliya, спасибо, я рада, что статья была для вас полезна!

Денис 19.12.2013
Очень часто даже и не замечаем на своих проектах таких недочетов, а кажется, что сайт просто идеальный:) Анастасия, благодарю за такой список минимальных критериев в юзабилити!

Анастасия Бадина
Анастасия Бадина
20.12.2013
Денис, спасибо за отзыв!

Сергей 26.02.2014
Вот они, мелочи из которых складывается общее впечатление о web-ресурсе. Я считаю, что эвристика просто необходима, ведь лучше предотвратить ошибку, чем потом исправлять. Спасибо, полезная статья.

илья 21.12.2014
искал это - надо к экзамену. Спасибо за хороший перевод и примеры !

Олег 05.02.2015
Огромное спасибо за труд! Сжато, по теме, всё что нужно. P.S.: Посмотрел остальные ваши статьи - приятно почитать. Нравится стиль изложения, спасибо!

Семен Бочкарев 14.03.2015
Спасибо за статью, примеры наглядны, объяснение эвристик емкое.

Добавление комментария:

CAPTCHA

Статьи выпуска: