Рекомендации по интерфейсу форм

[@sagus]

Без картинок как-то не наглядно.

[@plsc_Rover]

Вот ещё пост, затрагивающий тему формочек: habrahabr.ru/company/luxoft/blog/152967/ — с картинками.

[@coocheenin]

Указанный по ссылке пост куда эффективнее по восприятию, чем данный.

[@Shiz]

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

Для каких рекомендаций картинки будут наиболее ценны?

[@Piskov]

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

[@bumbay]

Спасибо за старание и полезный материал.

[@Vorchun]

Пользуюсь этим проверочным списком: www.cxpartners.co.uk/cxblog/form_design_guidelines_crib_sheet_free/

[@coocheenin]

Супер! Спасибо за линк.

[@algor]

Примеры там странные. Что сразу бросается в глаза:
* выбран пол «female», но все равно ошибка «Please enter a gender» (видимо, можно вводить только мужской, но зачем тогда радиобаттон)
* пол по умолчанию выбран, очень сомнительное решение
* пароль от 8 до 20 с обязательными заглавными, строчными и цифрами, но зато без спецсимволов
* неоднозначная идея использовать крестик как маркер некорректно заполненного поля, хотя в интерфейсах крестик используется как правило для действия «удалить», «закрыть».

[@JerryJJ]

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

Кнопка Reset вовсе не бесполезная. Просто ситуации, когда она нужна, возникают не так часто.

А вот заменять кнопки ссылками — это из разряда «вредных советов». Назначение кнопки — выполнение действия, ссылки — переход к новому набору данных, материалу, контексту. Путать их не стоит.

[@Tseikovets]

Ещё можно добавить:

When electronic forms are designed to be completed on-line, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues.

(Когда электронные формы предназначены для заполнения в режиме on-line, форма должна обеспечивать доступ людей, использующих вспомогательные технологии, к информации, элементам полей и функциональности, необходимой для её заполнения и отправки, включая все направления и вызовы.)

[Electronic and Information Technology Accessibility Standards (Section 508). — Subpart B — Technical Standards. — § 1194.22 Web-based intranet and internet information and applications. — Item (n)]

[@kai]

Афтор! Жги картинками! А то очередная «как прожить жизнь? — правильно!»

[@FWhisper]

Ещё The Research-Based Web Design & Usability Guidelines (от U.S. Dept. of Health and Human Services) полезной будет по этой теме — обычно её для тестирования web usability использую.

[@Boilerplate]

Прошло 10 лет и все ссылки из комментариев сдохли( Какая печаль...