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

Базовые свойства

Всем полям формы можно назначить html-свойства не прибегая к использованию сторонних расширений или библиотек.

Размер
Вы можете менять высоту и ширину поля, используя html-атрибуты width и height. Для textarea задается размер в сроках и столбцах, cols и rows.

Значение по умолчанию
Значение по умолчанию используется для того чтобы облегчить ввод данных пользователем. Например, если большинство посетителей вашего сайта из России, было бы логично подставлять это значение в поле «Страна».

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

CSS-класс
Всем полям формы можно задать СSS-класс для изменения внешнего вида. В стилях можно настроить отступы и фон элемента и даже задать тень.

Дополнительная функциональность

Автодополнение
Чтобы упростить работу с формой, используйте автодополнение там, где это возможно. Например, при поиске товара, давайте пользователю возможность выбрать из нескольких вариантов. Однако помните что «авто-комплит» создает дополнительную нагрузку на сервер. Если данных, которые могут быть подставлены в поле с автодополнением, много, лучше прибегнуть к кэшированию запроса.

Проверка введенных данных
Наверное, все помнят, что использовать данные, полученные от пользователя, небезопасно. Кроме искажения информации, это грозит еще и нарушением безопасности данных. Для того чтобы уменьшить эти риски используют валидацию. Проверять на корректность необходимо все данные полученные от пользователя, например, e-mail адрес должен состоять из нескольких латинских символов, включая дефис, подчеркивание и цифры, после них всегда должен быть at (@), далее опять какое-то количество латинских символов, обязательно «точка» как разделитель имени домена и доменной зоны. Если пользователь введет неверную информацию, вы как минимум не сможете связаться с ним по электронной почте. Однако, если проверить это поле и выдать соответствующее предупреждение, пользователь введет корректные данные и вы без труда сможете с ним контактировать.