Шаблоны проектирования веб-приложений

INPUT HINTS/PROMPTS (ПОДСКАЗКИ ПРИ ВВОДЕ/ПРИГЛАШЕНИЕ К ВВОДУ)

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

Предоставьте пользователям необходимые подсказки, объяснения или инструкции, и покажите им, как они должны вводить данные (рис. 2.27). В тех ситуациях, когда данные могут быть введены несколькими способами, применяйте шаблон FORGIVING FORMAT (о котором упоминалось ранее).

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

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

Существует несколько способов, как предоставить пользователям подсказки и инструкции (рис. 2.28):

Рис. 2.28. При заполнении регистрационной формы Windows Live пользователи получают инструкции по вводу пароля, альтернативного электронного адреса и секретного вопроса. Кроме того, когда пользователи приступают к заполнению поля, им предоставляется дополнительная информация и возможность получить помощь, пройдя по специальной ссылке

• Предоставьте примеры, как можно ввести данные. Например, если в поле ввода электронного адреса можно ввести несколько адресов, покажите пример того, как несколько введенных электронных адресов разделены запятыми или другим разделительным знаком.

• Покажите, какие форматы приемлемы для таких данных, как даты, номера телефонов, номера кредитных карт и т. д. Для дат покажите допустимые форматы следующим образом: мм/дд/гг, дд/мм/гг или мм/дд/гггг; для номеров телефонов в России покажите формат ввода как xxx-xxx-xxxx и т. д.).

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

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

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

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

Конец ознакомительного фрагмента.

Текст предоставлен ООО «ЛитРес».

Прочитайте эту книгу целиком, купив полную легальную версию на ЛитРес.

Безопасно оплатить книгу можно банковской картой Visa, MasterCard, Maestro, со счета мобильного телефона, с платежного терминала, в салоне МТС или Связной, через PayPal, WebMoney, Яндекс.Деньги, QIWI Кошелек, бонусными картами или другим удобным Вам способом.

1

SaaS – это модель продажи программного обеспечения, при котором поставщик разрабатывает веб-приложение, занимается его хостингом и управляет им (либо самостоятельно, либо через посредника), предоставляя клиентам возможность пользоваться им через Интернет. Клиенты не платят за право собственности на это программное обеспечение; они оформляют на него платную подписку.

2

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

3

После выхода работы Кристофера Александра в сфере архитектуры, понятие шаблонов было популяризировано и стало применяться в области программного обеспечения. Этому способствовала также работа Эрика Гаммы, Ричарда Хелма, Ральфа Джонсона и Джона Влиссидеса (часто эту группу называют GoF, от англ. Gang of Four – «банда четырех»): «Приемы объектно-ориентированного проектирования. Паттерны проектирования» (Питер, 2007). Впоследствии шаблоны также стали популярны в области взаимодействия компьютера и человека, этому способствовали работы Тидвелла (Tidwell, www.designinginterfaces.com), Уэли (Welie, www.welie.com), Борчерса (Borchers, 2001), Грэхэма (Graham, 2003) и Ван Дюйна (Van Duyne et al., 2002, 2006).

4

Чтобы упорядочить разнообразие и несогласованность форм используемых шаблонов и чтобы найти способ объединения шаблонов и их языков от разных авторов в особые тематические коллекции шаблонов, участники конференции CHI 2003 предложили язык разметки на основе XML под названием Pattern Language Markup Language (PLML; произносится как «пэл-мэл»). Чтобы получить больше информации, см. работу Финчера (Fincher, 2003).