Форма заявки: поля, подсказки и ошибки
Определите минимальные поля формы, объясните следующий шаг и подготовьте состояния ошибки. Здесь речь об интерфейсе, а не настройке аналитики.
Форма заявки нужна, чтобы посетитель передал данные для следующего разговора. Начните с вопроса к тому, кто принимает обращения: без чего он действительно не сможет ответить? Остальные сведения можно уточнить позже. Количество полей само по себе не определяет результат, но каждое обязательное поле должно иметь причину.
Форма заявки: оставьте нужные поля
Для предварительного разговора часто достаточно канала связи и короткого описания задачи. Если расчёт зависит от размера или типа объекта, можно предложить эти поля дополнительно. Форма записи на конкретную дату устроена иначе: там потребуется выбор времени и подтверждение доступности. Сначала определите сценарий, затем составляйте поля.
| Поле | Как принять решение |
|---|---|
| Телефон или почта | Дайте поддерживаемый канал. Не требуйте оба без рабочей причины. |
| Имя | Объясните обязательность или оставьте необязательным. |
| Задача | Подскажите, какие исходные данные помогут первому ответу. |
| Файл | Добавляйте, если вложение можно безопасно принять и обработать. |
| Реквизиты | Запрашивайте на соответствующем этапе, когда они нужны для работы. |
Подпись поля должна оставаться видимой
Пишите «Телефон для ответа» или «Электронная почта», а не прячьте назначение только внутри поля. Подсказка исчезает при вводе, постоянная подпись помогает проверить заполненное. Тип поля и автозаполнение должны соответствовать данным. На телефоне посетителю будет проще воспользоваться подходящей клавиатурой и сохранёнными контактами.
Не делайте маску телефона чрезмерно строгой. Проверьте ввод с кодом страны, пробелами, вставку из буфера и исправление цифры в середине. Если компания работает только с определёнными регионами или каналами, объясните это текстом. Безмолвное отклонение корректного контакта выглядит как поломка.
Подготовьте все состояния
- Обычное: подписи читаются, обязательность понятна, способ ответа указан.
- Ошибка: рядом с полем написано, что исправить; сообщение доступно без различения красного цвета.
- Отправка: повторное нажатие не создаёт несколько обращений, посетитель видит происходящее.
- Успех: сервер подтвердил приём; сообщается следующий шаг, введённые данные не выводятся лишний раз.
- Сбой: текст не исчезает, есть возможность повторить действие или обратиться другим способом.
Нажатие на кнопку ещё не означает, что запрос принят. Интерфейс должен получать подтверждение сервера. Даже после этого отдельно проверяется доставка ответственному. События аналитики и сквозная проверка описаны в материале о проверке заявок.
Учебный пример подсказки
Для расчёта перегородок под полем задачи можно написать: «Укажите примерные размеры и город. Если плана пока нет, опишите помещение». Это приглашение к разговору. Не называйте предварительную заявку готовым заказом, если после неё нужно согласовать объём, стоимость и договор. Надпись на кнопке должна это учитывать.
Форма заявки: сценарии проверки
Форму нужно заполнить клавиатурой: порядок перехода логичен, фокус виден, сообщение об ошибке связано с полем. Кнопка должна называться по действию. Для технической реализации подписей используйте рекомендации W3C WAI. На телефоне увеличьте страницу и проверьте, что кнопка и подсказки остаются доступны.
Не собирайте данные «на всякий случай». Кто является оператором, какие основания и документы нужны, где хранятся сведения и кто имеет к ним доступ, определяют под конкретный процесс компании. Текст этого журнала не заменяет такую проверку. Не копируйте чужое согласие с другим названием организации и не считайте галочку универсальным решением.
Перед запуском заполните форму с телефона, попробуйте пустые поля, ошибочный адрес, отказ сети и повторное нажатие. Сохраните результаты в чек-листе запуска. Назначьте человека, который заметит сбой после обновления сайта.