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

Над формой или внутри формы?

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

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

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

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

С какой стороны от поля?

Итак, мы определились с тем, что размещение внутри формы оптимальнее. Теперь давайте разберемся с какой стороны от поля заполнения лучше размещать сообщение.

Исследования показали, что в больше степени отвечают ожиданиям сообщения справа от поля. Сообщения, которые располагаются слева от поля, дают худшие результаты. Также оказалось, что сообщения, расположенные над полем, вызывают больше напряжения, чем те, что расположены под полем.

Почему справа лучше?

Важно не просто знать, но еще и понимать, почему расположение справа является наиболее оптимальным. Зная это, вы сможете аргументировать свое дизайнерское решение!

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

Почему слева хуже?

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

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

Почему расположение сверху сложнее для пользователей?

Когда сообщение об ошибке расположено над полем, пользователям приходится сильнее напрягать свое внимание. Это происходит потому что текст сообщения об ошибке находится рядом с с названием поля и с самим полем.

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

Лучшее расположение для мобильных устройств

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

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

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

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

Справа или снизу?

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

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

Автор статьи anthony

Перевод — Дежурка

Смотрите также:

• Дополнительный заголовок в помощь визуальному сканированию
• Как усилить визуальное восприятие текстовых полей
• Как межбуквенное расстояние поможет читабельности прописного текста