des champs accessibles avec label

Juste pour prêcher la bonne paroles aux développeurs web, voici un focus sur une balise HTML trop souvent oublié :<label>

Comme son nom l’indique, cette balise sert à étiqueté un champs de formulaire, c’est à dire à créer un lien entre le champs et le sens de ce champs : le texte qu’il le décris.

A quoi ça sert ?

1. Souvent Toujours, la relation est évidente car le texte se trouve juste à côté, en tout cas graphiquement ce que ne voit pas une personne atteinte de handicap visuel !
2. Pour tout ceux qui possède un handicap moteur, c’est à dire tout ceux qui n’ont pas joué à Quake et autre FPS, atteindre un bouton radio en moins d’une seconde est véritable défit ! La balise <label> permet de cliquer sur le texte accompagnant pour cocher ou non un bouton radio ou une case à coché, ce qui va leur simplifier la vie !

Comment ça fonctionne :

<label for="yes" title="Oui">Oui</label>
<input type="radio" id="yes" name="test" />
<label for="no" title="Non">Non</label>
<input type="radio" id="no" name="test" />

Cela fait longtemps que j’utilise cette balise qui permet d’améliorer considérablement l’ergonomie d’une application sans pour autant être difficile à mettre en place et sans nécessiter l’approbation de qui que ce soit.