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

Помогаем пользователям сосредоточиться

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

Концентрация внимания — способность фокусироваться на целевом стимуле в течение определённого периода времени. Человек лучше сосредоточен, если на него воздействует меньше отвлекающих факторов. Другими словами, устранение визуальных отвлекающих факторов повышает концентрацию внимания.

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

Как правило, большинство дизайнеров обозначают необязательное поле с помощью надписи — «(необязательное)». Но спросите себя, зачем людям заполнять необязательное поле — какую выгоду они получат от того, что предоставят ненужную информацию?

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

Например, не просто показывайте надпись «Номер мобильного телефона (необязательно)». Напишите над полем следующее — «Для получения СМС с новостями и предложениями». Так пользователи будут знать, что вы будете использовать их номер телефона для рассылки.

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

Как скрыть поле с помощью чекбокса

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

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

Как скрыть поле с помощью ссылки

Ещё один способ скрыть необязательное поле — использовать ссылку. Она будет находиться под пояснительным текстом и предлагать пользователям ввести нужные данные.

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

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

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

Подписи «(необязательно)» недостаточно

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

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

Перевод статьи Why You Should Hide Your Optional Form Fields из блога UX Movement Newsletter

В нашем Телеграм-канале UX Teddy публикуем так же переводы практических статей из блога UX Movement про проектирование сложных интерфейсов, форм и страниц — подписывайтесь!