Людям с ограниченными физическими возможностями не так то легко пользоваться HTML формами. Одно дело перемещаться по страницам с написанным контентом, и совсем другое прыгать по полям HTML формы и вводить туда информацию. Исходя из этого, будет вовсе не лишним добавить в форму немного дополнительных элементов, которые облегчат их использование, как и в случае с доступними ссылками.
Метки
У каждого поля формы должна быть своя метка. Тег <label> решает эту задачу, а атрибут for определяет элемент формы, к которому относится данная метка.
<form>
<label for="yourName">Ваше имя</label>
<input type="text" name="yourName" id="yourName" />
...
В обычных браузерах у меток есть свои преимущества: при выборе пользователем метки, автоматически активизируется соответствующий элемент формы.
Обратите внимание, что необходимо использовать и атрибут name, и атрибут id – атрибут name нужен для обработки данных HTML формы, а атрибут id ассоциирует метку с данным элементом формы.
Группы родственных элементов
Родственные поля формы, например, имя (фамилия, имя, отчество, звание и т.д.) или адрес (строка 1, строка 2, индекс, область, район, город и т.д.), можно группировать при помощи тега <fieldset>.
Внутри групп полей формы также можно использовать групповые метки, которые определяются при помощи тега <legend>.
Современные браузеры, как правило, помечают группы полей формы при помощи окружающей группу рамки, а групповые метки отображаются в верхнем левом разрыве этой рамки.
<form action='somescript.php' >
<fieldset>
<legend>Имя</legend>
<p>Имя <input type="text" name="firstName" /></p>
<p>Фамилия <input type="text" name="lastName" /></p>
</fieldset>
<fieldset>
<legend>Адрес</legend>
<p>Адрес <textarea name="address" ></textarea></p>
<p>Индекс <input type="text" name="postcode" /></p>
</fieldset>
...
Группы вариантов выбора
Тег <optgroup> позволяет группировать варианты в выпадающем меню. Он требует использования атрибута label, значение которого отображается как невыбираемый псевдозаголовок, предшествующий данной группе.
<select name="country">
<optgroup label="Африка">
<option value="gam">Гамбия</option>
<option value="mad">Мадагаскар</option>
<option value="nam">Намибия</option>
</optgroup>
<optgroup label="Европа">
<option value="fra">Франция</option>
<option value="rus">Россия</option>
<option value="uk">Великобритания</option>
</optgroup>
<optgroup label="Северная Америка">
<option value="can">Канада</option>
<option value="mex">Мексика</option>
<option value="usa">США</option>
</optgroup>
</select>
Навигация по полям
Как и в случае с ссылками, у пользователя должна быть возможность перемещаться по полям формы (и группам полей) не используя указатель мыши. Для этого используются те же возможности, что и со ссылками, - порядок табуляции и клавиши доступа.
Для этого к любому тегу формы, как тег <input> и тег <legend>, добавляются атрибуты accesskey и tabindex.
<input type="text" name="firstName" accesskey="f" tabindex="1" />
