Обтекание элемента метки в элементе легенды - PullRequest
5 голосов
/ 27 октября 2008

У меня никогда не было причины помещать элемент label внутри элемента легенды (никогда не думал об этом и не видел, как это было сделано). Но с проектом, который я реализую, это заманчиво сделать.

Вот что мне хочется:

<fieldset>
<legend><label for="formInfo">I would like information on</label></legend>
<select id="formInfo">
    <option value="Cats">Cats</option>
    <option value="Dogs">Dogs</option>
    <option value="Lolz">Lolz</option>
</select>
</fieldset>

Он работает должным образом (щелчок по метке фокусирует соответствующий ввод) в Firefox3, Safari, Opera и IE6 / 7 и проходит проверку, но мне просто интересно, есть ли какие-либо известные причины (доступность? Семантика? Браузер вопросы) почему это не следует делать

Ответы [ 2 ]

12 голосов
/ 27 октября 2008

Где твой </fieldset>?

Семантически, legend описывает fieldset, так же как label описывает одно поле.

Предполагается, что наборы полей используются для группировки семантически связанных полей (например, набор полей «адрес» может иметь поля ввода для улицы, города и страны).

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

Если у вас есть только одно поле, то вам вообще не нужен набор полей или легенда.

Так что, в принципе, вы не должны делать то, что делаете.

Если вы делаете это, чтобы иметь дополнительные элементы для присоединения правил CSS или событий Javascript, вам лучше использовать общие элементы, такие как div и span, которые не будут путать преобразование текста в речь и другие невизуальные агенты пользователя.

т. Е. Вставка div или span фактически нейтральна с точки зрения доступности / семантики (она ничего не подразумевает) по сравнению с неправильным использованием семантического элемента (даже если только немного, как в этом случае), что потенциально может ввести в заблуждение , Представьте себе даже сценарий в лучшем случае для вашего макета в браузере преобразования текста в речь: текст читается вслух дважды, один раз как легенда и один раз как метка - зачем кому-то нужна фраза «Я хотел бы» как информация о "читать вслух им дважды? Тем более что это имеет смысл только в контексте выбора элемента управления select.

0 голосов
/ 27 октября 2008

ну, сам элемент label кажется нормальным - это описание элемента "formInfo", так что не беспокойтесь. Семантически, однако, что это говорит об элементе legend? Это должен быть заголовок для всего набора полей ....

...