# Формы, которые заполняют до конца

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

Published: 2025-07-21 · Source: https://subxcat.com/ru/articles/forms-people-finish · Author: SUBXCAT

Форма — место, где интерес человека превращается в действие: заявку, заказ, регистрацию. И место, где его чаще всего теряют. Не потому, что форма сложная, а потому, что она мелко раздражает много раз подряд.

## Убери поля

Самое действенное, что можно сделать с формой, — сократить её. Пройди по каждому полю и спроси: кто прочитает этот ответ и что с ним сделает? Если ответ «пусть будет», поле лишнее.

Частые кандидаты на удаление:
- «Повторите пароль» — лучше кнопка «показать пароль»;
- отдельные поля для имени, отчества и фамилии там, где хватает одного;
- «Откуда вы о нас узнали» на шаге оплаты;
- телефон, если звонить никто не собирается.

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

## Порядок и группы

Длинную форму делят на смысловые группы: контакты, адрес, оплата. Многошаговая форма хороша, если шаги действительно разные и видно, сколько осталось. Плохо, если каждый шаг — одно поле и кнопка «Далее»: это та же длинная форма, только медленнее.

Одна колонка почти всегда лучше двух: взгляд идёт сверху вниз, и ничего не теряется справа.

## Проверка по ходу, но не на каждую букву

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

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

## Сообщения об ошибках

Сообщение говорит, что не так и как исправить, — человеческим языком и рядом с полем.

- Не «Неверный формат», а «В номере не хватает цифр».
- Не «Ошибка 422», а «Этот адрес уже зарегистрирован. Войти?»
- Не красить красным всю форму, а отметить конкретное поле.

И никогда не стирай введённое после ошибки. Форма, которая очищает все поля из-за одного неверного, — самый надёжный способ убедить человека закрыть вкладку. То же при сбое на сервере: запрос не прошёл, а данные остаются на месте.

## Автозаполнение и клавиатура

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

```html
<input type="email" name="email" autocomplete="email">
<input type="tel" name="phone" autocomplete="tel">
<input name="code" inputmode="numeric" autocomplete="one-time-code">
```

`type` и `inputmode` заодно открывают на телефоне нужную клавиатуру: с @ для почты, цифровую для кода. Код из SMS с `autocomplete="one-time-code"` подставляется одним касанием.

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

## Кнопка отправки

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

После нажатия кнопка показывает, что запрос идёт, и не даёт отправить форму дважды. Двойной заказ из-за медленной сети — неприятность и для человека, и для поддержки.

## Как проверить

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

SUBXCAT разбирает ключевые формы продукта поле за полем и доводит их до состояния, в котором их заканчивают.