Usability Guidelines

1. Формы:

 

1.1 Поля, обязательные для заполнения, обозначены звёздочкой перед своим названием. У формы есть пояснение об обозначении обязательных полей.

 

 

Почему: Читая слева на право, пользователь быстрее увидит обязательные для заполнения поля.

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

 

1.2 Названия полей выровнены по правой стороне. Расстояние от названия до поля для всех полей одинаковое.

 

 

Почему: Выравнивание по правому краю не создаёт гребень из текста. Длинные расстояния сильно затрудняют ассоциацию названия поля с самим полем. Не редко приходится проверять правильность заполнения ещё раз.

 

1.3 Следует оградить пользователя от ввода одной и той же информации.

Пример 1: В форме авторизации можно избавить пользователя от повторного ввода информации добавив флажок Remember Login:

 

 

 

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

 

 

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

 

1.4 Недоступные в данный момент интерфейсные элементы заблокированы, а не скрыты.

 

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

1.6 Подписи к интерфейсным элементам размещены и названы единообразно.

 

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

1.7 Пункты меню и кнопки, инициирующие другие действия пользователя, обозначены в конце многоточием «…».

Пример: «Save as...», «Choose…» требует многоточия, т.к. следующим действием пользователь должен будет выбрать или указать что-то, например название файла.

1.8 Выводить минимальное или стандартное значение для элементов формы, где пользователю в любом случае придётся ввести самое частое или очевидным значением.

 

Пример: В корзине интернет-магазина в поле количества товара по-умолчанию должна стоять единица.

 

1.9 Переход по элементам формы (в порядке следования полей) может осуществляться клавишей <Tab>.

2. Кнопки:

2.1 Надписи на кнопках следует писать в инфинитивной форме глагола (искать, показать, посмотреть). Не следует использовать другую часть речи либо форму глагола (готово).

Пример: Update, Go, Submit, Cancel, Enter, Home, Next, Previous.

Примечание: Глаголы Get и Find лучше использовать в контексте того, что хотим получить или найти. Например: Find Company, Get My Horoscope.

 

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

 

Пример: Find User

 

2.3 Между кнопками стоящими рядом, должно быть пустое пространство, щелчок по которому не обрабатывается.

 

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

 

2.5 Нет разных состояний кнопок, которые выглядят одинаково.

2.6 Кнопки находятся в секции, на которую они оказывают непосредственное воздействие.

2.7 Кнопки с невозможными на данный момент действиями не исчезают, а заблокированы.

 

2.8 Кнопка негативного действия («Удалить», «Стереть», «Отменить») всегда самая правая.

 

2.9 Давать кнопке текст «ОК» можно только в модальних вікнах, у парі з кнопкою "Cancel". У випадку коли вікно служить виключно для виводу інформації (наприклад, повідомлення неправильного паролю, або системної помилки) кнопка «ОК» може бути сама.