Champ texte Dans un formulaire, un champ texte permet de saisir du texte sur une seule ligne, comme un nom ou un numéro de téléphone. Exemples Les exemples ci-dessous reproduisent les variantes de ces champs texte, en incluant celle avec une consigne et celle avec une aide à la saisie. Les champs en erreur peuvent être vus en laissant vides les champs et en cliquant sur Suivant. Texte Texte (facultatif) Texte avec longueur minimale et maximale Texte avec consigne et aide à la saisie (facultatif) Texte pour une consigneTexte d’aide à la saisie Texte avec motif et masque de saisie Exemple : AAAA 9999 99994 lettres A, 4 chiffres 9, 4 chiffres 9 Leave this field blank Accessibilité L’étiquette du champ texte doit être à proximité du champ texte.L’étiquette du champ texte doit être codée dans une balise <label>.La balise <label> doit être liée au champ texte.L’attribut autocomplete doit être utilisé pour spécifier avec précision le type de données devant être entrée lorsqu’on demande une information personnelle à l’utilisateur (le prénom ou une adresse courriel, par exemple). Pour savoir quelles sont les valeurs nécessaires pour l’attribut, consultez la liste officielle dans le WCAG 2.1.La bordure du champ doit avoir un taux de contraste d'au moins 3:1 avec l'arrière-plan. Information complémentaire au champ Tout texte apportant de l’information complémentaire au champ (un signe de $, une consigne, le message d’erreur) doit y être lié. Pour ce faire, il faut : Ajouter l’attribut aria-describedby sur le champAjouter l’attribut id sur la balise contenant le texte (<p>, <span>, <div>)Lier l’attribut aria-describedby à l’attribut id (aria-describedby="id du texte")
