Содержание статьи:
Что это такое?
Маска для полей ввода телефонных номеров — своеобразный шаблон или набор правил, по которым пользователь обязан вводить информацию в поля форм. Их используют, если необходимо, чтобы все пользователи присылали свои номера телефонов в одном формате, например: +375 (хх) ххх-хх-хх
Такие маски используются, как правило, в полях для ввода телефонных номеров:
- в формах заказа обратной связи;
- в формах оформления заказа на покупку;
- в формах заказа консультаций;
- и т.п.
Примеры использования
Для более чёткого восприятия данные вводятся постепенным нажиманием цифр 1−2-3−4-5-…
Пример 1.
Маска с предварительной подсказкой (плейсхолдером).
Пример 2.
Маска с заранее вставленным кодом страны
Пример 3.
Маска с выбором страны
На первый взгляд использование масок для ввода номеров телефонов может показаться очень хорошим вариантом. Но не спешите с выводами.
Преимущества масок
- Номера телефонов приходят менеджерам в едином формате.
- Наглядное отображение правил ввода.
- Пользователю не нужно вводить код страны.
Недостатки масок
- Иногда логика ввода данных может ввести пользователя в ступор (cм. Пример 1).
- Количество символов в маске всегда предопределено заранее. Это создаёт проблемы, ведь зачастую количество цифр в мобильных и стационарных номерах различны.
Например:- +375 (29) 123-45-67 — мобильный
- +375 (162) 12-34-56 — стационарный телефон (Брест)
- При опечатке или ошибке в номере, пользователю не удобно вносить изменения в уже написанный номер.
- Даже самая жёстко заданная маска телефона не спасёт от ошибок при вводе в форму номера пользователем. При использовании масок периодически информация менеджеру приходит с пропущенными символами.
Например: +375 (29) 123-_5−67 - Т.к. все эти решения реализуются с помощью языка JavaScript, то иногда возможны сбои, т.к. в браузерах некоторых пользователей JavaScript может быть отключён.
Советы по применению
Если вы решили использовать маски для ввода номеров телефона, стоит подумать о целесообразности данного решения в вашем проекте, тщательно взвесить все «за» и «против».
При обдумывании этого вопроса можете руководствоваться следующими советами:
-
Не загоняйте пользователя в рамки
Хорошо, если пользователь имеет возможность вписать номер любой страны. -
Номера телефонов бывают разной длины
Нужно иметь в виду, что количество символов в номерах разных стран отличается. Даже внутри одной страны может отличаться из-за различий в количестве цифр кода города. -
Ввод номера должен быть простым
Не стоит делать громоздкий выбор страны оператора, если компания работает в основном в пределах Республики Беларусь. -
Телефон — не обязательно только цифры
Иногда пользователю удобнее написать номер в произвольной форме. Например: 354−56−14 велком. И менеджеру такая запись будет вполне понятна. -
Маска — не панацея
Даже самая жёстко заданная маска телефона не спасёт от ошибок при вводе в форму номера пользователем. -
Иногда подсказок достаточно
Вместо маски можно использовать дополнительные подсказки (плейсхолдер и пример номера рядом с полем) -
Не забывайте про мессенджеры
Если среди клиентов много интернациональных, то хорошим тоном будет иметь возможность к номеру добавлять удобные варианты для связи (например, мессенджеры).
Вы планируете сделать новый сайт и ищите подрядчика? Обращайтесь в Qmedia — мы поможем выбрать лучший вариант сайта под ваш проект и поможем с дальнейшим продвижение!