FIELDSET
, et offre une aide pour les personnes ayant un handicap cognitif.LEGEND
autour des différents titres de rubrique.Pour une liste complète des outils utilisés pour évaluer l'accessibilité des pages web, et un résumé de leurs principales fonctionnalités, reportez-vous à la page Outils d'aide à l'évaluation.
LEGEND
est présente pour donner un titre au bloc d'informations encadré par la balise FIELDSET
.
LEGEND
est présente pour donner un titre au bloc d'informations encadré par la balise FIELDSET
. LEGEND
est présente pour donner un titre au bloc d'informations encadré par la balise FIELDSET
.LEGEND
est implémentée. Cependant, il est possible de vérifier, à l’aide de Jaws, que chaque bloc d’informations a un titre.
Ce critère est implémenté par l'intégrateur HTML, le rédacteur et l'ergonome.
Dans le cas d'une page en HTML, l'utilisation de la balise LEGEND
, associée à la balise FIELDSET
, permet de donner un titre à chaque bloc d'informations.
Cela permet une identification aisée des différents groupes d'informations.
<fieldset>
<legend>Intitulé de la rubrique du formulaire</legend>
Contenu de la rubrique...
</fieldset>
Voici un formulaire qui demande à l'utilisateur de fournir une adresse de livraison et une adresse de facturation, si elles sont différentes. Les deux blocs ne sont pas clairement identifiés. Ainsi, un utilisateur navigant à l'aide d'une synthèse vocale et tabulant de champ en champ n'entendra que le nom de ce champ sans savoir à quel bloc il appartient.
<form action="#" mehtod="#">
<fieldset>
<strong>Adresse de livraison :</strong><br />
<p> <label for="nom_l">Nom</label> : <input type="text" id="nom_l" nam="nom_l" /></p>
<p><label for="prenom_l">Prénom</label> : <input type="text" id="prenom_l" nam="prenom_l" /></p>
<p><label for="adr_l">Adresse</label> : <input type="text id="adr_l" name="adr_l" /></p>
<p><label for="cp_l">Code postal</label> : <input type="text" id="cp_l", name="cp_l" /></p>
<p><label for="ville_l">Ville</label> :<input type="text" id="ville_l" name="ville_l" /></p>
</fieldset>
<fieldset>
<strong>Adresse de facturation :</strong>
<p><label for="nom_f">Nom</label> : <input type="text" id="nom_f" nam="nom_f" /></p>
<p><label for="prenom_f">Prénom</label> : <input type="text" id="prenom_f" nam="prenom_f" /></p>
<p><label for="adr_facture">Adresse</label> : <input type="text id="adr_facture"
name="adr_facture" /></p>
<p><label for="cp_f">Code postal</label> : <input type="text" id="cp_f", name="cp_f" /></p>
<p><label for="ville_f">Ville</label> :<input type="text" id="ville_f" name="ville_f" /></p>
</fieldset>
</form>
Chaque titre de rubrique "adresse de livraison" et "adresse de facturation" est encadré de la balise LEGEND
. Ainsi, lorsqu'une personne aveugle, utilisant le lecteur d'écran Jaws passe de champ en champ dans la rubrique "adresse de livraison", elle entend "adresse de livraison : nom", "adresse de livraison : prénom" etc... Puis, lorsqu'elle passe dans le bloc "adresse de facturation", elle entend "adresse de facturation : nom", "adresse de facturation : prénom" etc...
<form action="#" mehtod="#">
<fieldset>
<legend><strong>Adresse de livraison :</strong></legend><br />
<p><label for="nom_l">Nom</label> : <input type="text" id="nom_l" nam="nom_l" /></p>
<p><label for="prenom_l">Prénom</label> : <input type="text" id="prenom_l" nam="prenom_l" /></p>
<p><label for="adr_l">Adresse</label> : <input type="text id="adr_l" name="adr_l" /></p>
<p><label for="cp_l">Code postal</label> : <input type="text" id="cp_l", name="cp_l" /></p>
<p><label for="ville_l">Ville</label> :<input type="text" id="ville_l" name="ville_l" /></p>
</fieldset>
<fieldset>
<legend><strong>Adresse de facturation :</strong></legend><br />
<p><label for="nom_f">Nom</label> : <input type="text" id="nom_f" nam="nom_f" /></p>
<p><label for="prenom_f">Prénom</label> : <input type="text" id="prenom_f" nam="prenom_f" /></p>
<p><label for="adr_facture">Adresse</label> : <input type="text id="adr_facture"
name="adr_facture" /></p>
<p><label for="cp_f">Code postal</label> : <input type="text" id="cp_f", name="cp_f" /></p>
<p><label for="ville_f">Ville</label> :<input type="text" id="ville_f" name="ville_f" /></p>
</fieldset>
</form>
Blocs de formulaire non identifiés (format mp3, 399 ko)
Blocs de formulaire correctement identifiés (format mp3, 284 ko)