L'utilisation de la balise HTML fieldset a-t-elle une signification au-delà du regroupement de formulaires?

Question

Généralement, je l’ai vu avec des formulaires, mais j’ai trouvé utile de regrouper des ensembles de données liés (par exemple, lorsque vous avez plusieurs tables sur une page, utilisez un ensemble de champs autour de chaque table ou groupe de tables liées pour définir une signification visible et un nom de groupe (légende)). Est-ce abuser de la balise fieldset au point où, dans mes utilisations, elle n’a plus aucune signification sémantique?

Answer 1

Je vois des avantages sémantiques au blocage de contenu dans des ensembles de champs avec des légendes.

Bien que le W3C ait associé l’utilisation de champs et de légendes à des formulaires, le fait de l’utiliser en dehors de la balise de formulaire ouvre de nouvelles limites à l’expérimentation. Potentiellement similaire à la liste de définitions utilisée.

Personnellement, je ne pense pas que le " champ " dans fieldset est spécifique au champ de formulaire. C'est une relation héritée de son utilisation dans la balise de formulaire. le champ est en référence au groupe.

Imaginez que vous alliez dans vos parcs et loisirs locaux pour jouer au softball avec vos amis. Il y a 3 champs disponibles. Tous ont des signes sur la clôture & "BASEBALL UNIQUEMENT &";

Préparez-vous votre équipement et rentrez chez vous?

étiqueter l'utilisation de champs et de légendes en dehors de l'abus de balises de formulaire est une vision étroite.

Aucun endroit dans la définition mentionne-t-il les formes:

  

L'élément FIELDSET permet aux auteurs de   regrouper les contrôles liés par thème   et des étiquettes. Le regroupement des contrôles permet   plus facile pour les utilisateurs de comprendre leur   but tout en même temps   faciliter la navigation par tabulation pour   agents utilisateurs visuels et discours   navigation pour utilisateur axé sur la parole   agents. Le bon usage de cet élément   rend les documents plus accessibles.

Je considère le contrôle de formatage des balises xhtml. div p blockquote etc.

<h1>The Big Book about Everything</h1>
<fieldset>
    <legend>Jokes</legend>
    <h2>30 pages of humorous Jokes</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>
<fieldset>
    <legend>Poems</legend>
    <h2>20 pages of well written poems</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>
<fieldset>
    <legend>Horror</legend>
    <h2>3 Short and scary stories</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>
<fieldset>
    <legend>Mystery</legend>
    <h2>3 Short and mysterious stories</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>

Answer 2

Je crois que ce serait un abus. http://www.w3.org/TR/REC -html40 / interact / forms.html # h-17.10 états & "; L'élément FIELDSET permet aux auteurs de regrouper par thème contrôles et les libellés ".

Answer 3

Le champ " " Le bit dans le nom fieldset fait référence à <form> les champs.

Utiliser form en dehors de <=> s pour regrouper des données de base est clairement une mauvaise utilisation sémantique.

Cependant, votre code HTML sera validé et Dieu ne pourra pas tuer un chaton.

Answer 4

champs concerne le groupe de contrôle de formulaire . En regroupant les contrôles de formulaire associés, les auteurs peuvent diviser un formulaire en parties plus petites et plus faciles à gérer, améliorant ainsi le désastre lié à la convivialité qui peut survenir lorsque les utilisateurs sont confrontés à un trop grand nombre de contrôles de formulaire.

Cela ne signifie pas qu'un groupe de champs regroupe toujours les champs dans un formulaire , même si la spécification traite de ce dernier. uniquement dans le contexte d'une interaction de l'utilisateur avec la forme ...

Donc, le " abuser de " Cela peut provenir du fait que les spécifications HTML 4 et XHTML n'exigent pas que les champs et la légende soient contenus dans des éléments de formulaire. FIELDSET peut même être l'enfant de l'élément BODY. C'est une syntaxe valide pour placer des champs en dehors des formulaires.

Mais, lorsque vous décrivez quelque chose comme un ensemble de champs qui n'est pas vraiment un ensemble de champs, vous créez simplement une confusion.

Il est préférable de penser que les balises HTML / XHTML décrivent la signification d'un élément plutôt que son apparence. Vous pouvez ensuite utiliser CSS pour que l’élément ressemble à ce que vous voulez.

Si vous regroupez des données à des fins de présentation, vous pouvez trouver ici un alternative intéressante à CSS .

Pour référence:

.fieldset {
border-right: 1px solid #75736E;
border-bottom: 1px solid #75736E;
border-left: 1px solid #F2F0EE;
border-top: 1px solid #F2F0EE;
padding: 10px 3px 3px 3px;

}

.outer {
border-left: 1px solid #75736E;
border-top: 1px solid #75736E;
border-right: 1px solid #F2F0EE;
border-bottom: 1px solid #F2F0EE;
width: 200px; /* CHANGE THIS FOR BOX SIZE */
} 

.legend {
float: left;
margin-left: 15px;
margin-top: -8px;
padding-left: 5px;
padding-right: 5px;
font-weight: bold;
background: #FFF;
} 

<div class="legend">Lipsum.com Is The Best</div>
<div class="outer">
<div class="fieldset">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
Donec congue fermentum metus. Quisque vel ante. 
Cras purus metus, dignissim at, luctus et, sollicitudin eget, urna. 
Maecenas eget lacus. Aenean bibendum risus non erat mattis semper. 
Aliquam placerat nibh eget lacus. Sed blandit eleifend justo. Nam elit. 
Fusce feugiat orci id eros facilisis laoreet. 
Integer vestibulum condimentum purus. 
Proin vehicula congue lacus. Quisque placerat diam nec enim. 
Nunc lorem. Maecenas nec sem sed nulla tristique faucibus.</div></div>

Answer 5

Si vous souhaitez regrouper des tables, envisagez d'utiliser un élément d'en-tête (h1-h6) approprié pour chaque groupe. Des tables individuelles peuvent être décrites à l'aide de la légende 'element. L'attribut "summary" est également disponible pour chaque table.

À partir de la spécification:

  

Chaque table peut avoir un associé   légende (voir l’élément CAPTION) qui   fournit une brève description de la   but de la table. Une description plus longue   peut également être fourni (via le résumé   attribut) au profit des personnes   en utilisant un utilisateur vocal ou basé sur le braille   agents.

Et pour l'enregistrement, l'élément 'fieldset' n'est pas destiné à être utilisé en dehors des formulaires. Et dans les formulaires, il est prévu de regrouper conceptuellement des champs de saisie tels que des "informations personnelles" ou des "adresses de facturation", etc.

Voici un article intéressant qui explique ce que les utilisateurs de lecteurs d'écran entendent lors de la navigation dans les champs. http: // www .rnib.org.uk / wacblog / articles / too-much-accessibility / too-much-accessibility-fieldset-legends /

Answer 6

La balise fieldset est également utile pour les lecteurs d'écran et certaines autres technologies d'assistance.