Узнав об элементе формы и о том, как сделать форму интерактивной , давайте посмотрим, как можно помочь пользователям избежать повторного ввода данных.
Используйте автозаполнение максимально эффективно
Заполнение форм может занять много времени. Например, повторный ввод своего адреса на каждом сайте, где вы хотите что-то купить, — это не лучший опыт покупок.
Здесь вам может помочь автозаполнение. Вы вводите свой адрес один раз. С этого момента ваш браузер будет предлагать вам возможность автоматически заполнять тот же адрес для других форм.
Вы переехали в другой город? Не беспокойтесь о том, что старый адрес останется навсегда. Вы можете редактировать данные адреса, сохраненные вашим браузером, чтобы поддерживать их актуальность.
Как работает автозаполнение в браузере?
Поле адреса может выглядеть по-разному на разных сайтах. Как браузер узнает, что это поле адреса?
Браузеры используют эвристику для идентификации поля адреса. Каковы значения атрибутов name , type и id ? Присутствует ли атрибут autocomplete в элементе управления формой?
На основе этой информации браузеры могут предлагать возможность автозаполнения поля ранее введенными данными того же типа. Браузеры могут даже предложить автозаполнение всей формы.
Помогите браузерам с автозаполнением
Давайте посмотрим, что вы можете сделать, чтобы помочь браузерам предлагать правильные параметры автозаполнения.
Используйте разумные значения атрибутов
Как вы узнали, браузеры могут идентифицировать тип данных, просматривая атрибуты элемента управления формой.
<label for="email">Email</label>
<input type="email" name="email" id="email">
Есть ли у вас поле, в котором пользователи должны ввести свой адрес электронной почты? Используйте email в качестве значения атрибута name , id и type . Три подсказки для браузера, что это поле электронной почты.
Атрибут автозаполнения
Существуют и другие примеры, когда браузерам все еще может быть сложно идентифицировать тип данных исключительно по атрибутам name , id и type . Вы можете помочь здесь, используя атрибут autocomplete .
Вы уже вводили имя в браузере, который используете? Браузер, вероятно, предложит вам еще раз заполнить это поле в демо-версии.
Вы можете узнать больше об использовании автозаполнения и автозаполнения в следующем модуле.
Проверьте свое понимание
Проверьте свои знания автозаполнения
На основании каких атрибутов предлагается автозаполнение?
name .typeautocomplete