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

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

Значения атрибута:

1. none Без виртуальной клавиатуры.
2. text Стандартная раскладка виртуальной клавиатуры с учетом локализации. Является значением, установленным по умолчанию.
3. decimal Дробные значения чисел, содержащие разряд и соответствующий символ-разделитель, учитывающий локализацию.
4. numeric Числовая раскладка виртуальной клавиатуры.
5. tel Раскладка для ввода номера телефона.
6. search Виртуальная клавиатура, оптимизированная для работы с поиском.
7. email Виртуальная клавиатура, оптимизированная для ввода электронной почты.
8. url Виртуальная клавиатура, оптимизированная для ввода ссылок.

Пример:

<input type="text" inputmode="numeric" placeholder="Enter your phone number">

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

Дополнительная информация на MDN

Спасибо за внимание.