В Интернете множество форм заполнения, но делятся они на два типа. Существуют формы заполнения без определенного формата (они содержат только буквы и цифры). А есть поля ввода, которые требуют конкретного формата (они содержат символы помимо букв и цифр). Эти два типа форм нужно оформлять по-разному. Сегодня мы подробно поговрим о вторых формах — полях ввода определенного формата.

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

Неопределенность формата ведет к отказам

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

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

Неопределенности для пользователя остается и в типе вводимых символов. Какие использовать? К примеру, для ввода номер телефона можно использовать дефисы, или пробелы, или точки. А нужно ли брать в скобки код города? Дату можно ввести через точки, дроби или дефисы.

Решение этих вопросов требует дополнительной умственной деятельности. И даже после принятия решения остается вопрос: а правильно ли были выбраны символы? Будут ли данные считаться действительными?

Отсутствие формата мешает в исправлении ошибок

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

К примеру, номер кредитной карты без дефисов сложно проверить и исправить. Номер целиком пользователь вряд ли запомнит (более 19 цифр). Вместо этого он будет проверять номер по частям, переводя взгляд с карты на экран.

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

Задайте формат заполнения при помощи маски ввода

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

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

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

Уделяйте особое внимание полям с форматом

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

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

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

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

• Как усилить визуальное восприятие текстовых полей
• Проблемы модного серого текста в веб-дизайне
• Когда использовать переключатели, а когда чекбоксы