← К публикациям
Дизайн и разработка

Форма заявки, которую удобно заполнить: проверка за один рабочий проход

Подписи, ошибки, клавиатура и понятное подтверждение — детали, которые важнее декоративной анимации кнопки.

CreativeMedia2 мин чтения
Форма заявки, которую удобно заполнить: проверка за один рабочий проход

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

Обоснуйте каждое поле

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

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

Сохраните понятные подписи

W3C рекомендует связывать элементы формы с описывающими их подписями. Placeholder не стоит использовать как единственный ориентир: при вводе он исчезает. Рекомендации W3C по подписям полей.

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

Сделайте ошибку полезной

Сообщение «ошибка 400» не подсказывает следующий шаг. Укажите, какое поле требует внимания и как его исправить. Если отправка не удалась из-за соединения, сохраните введённый текст и предложите повторить действие. Не заставляйте человека угадывать, дошло ли обращение.

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

Проверьте то, что происходит после

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

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