web-dev-qa-db-fra.com

À quoi sert le "pour" dans une étiquette?

Je viens de parcourir un paramètre for dans une balise HTML:

<label for="required-firstname"> First Name </label>
<small>*</small>
<input name="required-firstname" type="text" tabindex="2" 
       id="required-firstname" size="24" maxlength="40">

Je convertis ce formulaire en un PHP traité, puis-je me débarrasser des paramètres for =? (Et par curiosité, que fait-il?)

63
lynn

De w3schools.org:

La balise définit une étiquette pour un élément d'entrée.

L'élément label ne s'affiche pas comme quelque chose de spécial pour l'utilisateur. Cependant, il offre une amélioration de la convivialité pour les utilisateurs de souris, car si l'utilisateur clique sur le texte dans l'élément d'étiquette, il bascule le contrôle.

L'attribut for de la balise doit être égal à l'attribut id de l'élément lié pour les lier ensemble.

HTH!

en ajoutant mon $ .02 en tant qu'accessibilité SME - ainsi que l'utilisabilité, le LABEL associe également le champ de saisie à la bonne étiquette afin que les personnes utilisant des lecteurs d'écran sachent à quoi sert le champ.

90
Jonas

La balise d'étiquette HTML définit une étiquette pour un élément de formulaire. Ils sont généralement utilisés avec des cases à cocher et des boutons radio, et lorsque l'utilisateur clique sur l'étiquette, il fait basculer le bouton. Avec une entrée de texte (et vous devrez vérifier cela pour être sûr), je pense que cela ne fait que mettre l'accent sur l'entrée lorsque l'utilisateur clique sur l'étiquette.

18
Bill the Lizard

Il spécifie à quel élément cette étiquette est liée. Dans votre exemple de code, l'étiquette est là pour le champ de saisie required-firstname . Si l'utilisateur clique sur cette étiquette, le focus ira au champ de saisie lié. C'est une amélioration de l'utilisabilité et je pense que vous feriez mieux de le laisser tel quel. C'est une bonne pratique.

8
Pawel Krakowiak

L'attribut "pour" est un élément nécessaire pour l'accessibilité de votre formulaire. Ne l'omettez pas. Pour une personne utilisant un lecteur d'écran (SR) pour qu'une page Web lui soit annoncée, l'attribut "for" relie le contrôle à l'étiquette. En règle générale, un utilisateur SR doit parcourir un formulaire, d'un contrôle (qui est un élément focalisable pour le SR) au suivant. Sans l'attribut "for", l'utilisateur SR devra changer de mode sur le SR et sonder le formulaire pour essayer de déterminer quel contrôle correspond à quelle étiquette, ce qui peut être long et déroutant. L'attribut "pour" peut également être utile pour la technologie d'assistance liée aux problèmes de moteur.

WebAIM.org a une grande page expliquant les ramifications d'accessibilité de "pour": http://webaim.org/techniques/forms/controls

5
user3219915

Il lie l'étiquette à un identifiant d'élément de formulaire. Certains éléments de formulaire, comme les cases à cocher, peuvent être activés en cliquant sur leur étiquette.

5
VirtuosiMedia

Dans certains navigateurs, lorsque vous cliquez sur un texte dans une balise for, vous cochez la case à laquelle il est associé (c'est-à-dire for = id) ou mettez l'accent sur cette case. C'est une chose ADA

3
Peter Turner