L'erreur ne doit elle pas être avant le champs ?
Le 28 févr. 2014 12:23, jean-pierre villain <[email protected]> a écrit : > > "Pour le aria-describedby je trouve que c'est un confort supplémentaire mais > je note ta remarque." > > En loccurrence ça ne fonctionne pas et c'est tant mieux parce que ce que tu > provoquerais est donc la vocalisation de tous les contenus identifiés dans la > référence du describedby donc tout le contenu du label (votre prénom, > l'input, l'alerte) qui serait donc vocalisé deux fois (théoriquement à > l'infini puisque la référence est circulaire). > Du point de vue du confort c'est discutable ;) > > Le meilleur motif dans ton cas c'est : > > >> <label for="firstname"> >> Votre prénom * >> </label> >> <input type="text" aria-describedby="toto" id="firstname" >> aria-required="true" /> >> >> <p class="erreur" role="alert" id="toto">Veuillez saisir votre >> prénom.</p> > > > Si tu utilise un label implicite le motif le plus efficace est tout > simplement : > >> <label for="firstname"> >> Votre prénom * >> <input type="text" id="firstname" aria-required="true" /> >> >> <span role="alert">Veuillez saisir votre prénom.</span> >> </label> > > > Mais le label explicite est considéré comme étant plus robuste. > > Pour l'utilisation de aria-invalid, tu peux l'utiliser mais je n'en vois pas > l'intérêt l'obligation de saisie est signalée, le message d'erreur est clair, > je ne vois pas d'intérêt à signaler, en plus, que la valeur entrée est > "invalide". > Il est préférable de réserver aria-invalid dans le cas d'une valeur saisie > qui ne correspond pas au format attendu. > > JPV > > ________________________________ > Jean-Pierre Villain - Qelios - 06 98 08 50 49 > > ________________________________ > De : Olivier Keul <[email protected]> > À : "[email protected]" <[email protected]> > Envoyé le : Vendredi 28 février 2014 9h30 > Objet : Re: [Liste GTA] Formulaire et retour d'erreur > > Salut Victor, > > Effectivement c'est une erreur, on est d'accord pour le aria-required et > aria-invalid sur l'input. > >> <label for="firstname"> >> Votre prénom * >> <input type="text" id="firstname" aria-required="true" >> aria-invalid="true" /> >> >> <span class="erreur" aria-describedby="firstname" role="alert">Veuillez >> saisir votre prénom.</span> >> </label> > > > Par contre pourquoi le role ne te semble pas pertinent ? Je trouve que > justement cela permet d'indiquer à l'utilisateur une erreur qu'il doit > corriger si il veut poursuivre. > > Pour le aria-describedby je trouve que c'est un confort supplémentaire mais > je note ta remarque. > > > Le 27 février 2014 18:49, Victor Brito <[email protected]> a écrit : >> >> Salut, Olivier, bonsoir, la liste, >> Pour ma part, j'insérerais les attributs aria-required et aria-invalid dans >> l'élément input et me passerais d'aria-describedby, puisque l'élément span >> est enfant de l'élément label. Quant au role alert, il ne me semble pas >> pertinent. Pour le reste, rien à dire. >> Victor >> Victor Brito Intégrateur XHTML / CSS – Expert Accessiweb en évaluation >> 39 rue Charles Laffitte 92200 Neuilly-sur-Seine Tél. : +33 6 03 15 89 57 >> SIRET : 789 766 334 00013 >> Consulter le site Web professionnel de Victor Brito >> Sur les réseaux sociaux >> Suivre Victor Brito sur Twitter >> Suivre Victor Brito sur Diaspora >> Sans oublier >> La fiche de membre du Groupe de Travail Accessiweb >> Halte à la balkanisation du Web ! >> Un seul Web >> Profession intégrateur (X)HTML / CSS >> Tuyaux de l'accessibilité >> Le 27/02/2014 18:45, Olivier Keul a écrit : >>> >>> Bonjour la liste, >>> >>> Je m'interroge sur la meilleure manière de gérer le retour d'erreur sur un >>> formulaire. >>> >>> Est-ce qu'un markup de ce style vous semble bulletproof ou bien c'est >>> déconnant ? >>> >>>> <label for="firstname"> >>>> Votre prénom * >>>> <input type="text" id="firstname" /> >>>> <span class="erreur" aria-required="true" aria-invalid="true" >>>> aria-describedby="firstname" role="alert">Veuillez saisir votre >>>> prénom.</span> >>>> </label> >>> >>> >>> >>> On a : >>> la classique association for / ID respectivement sur le label et l'input >>> l'attribut aria-required à true pour indiquer le caractère obligatoire du >>> champ >>> l'attribut aria-invalid à true qui indique qu'il y a une erreur >>> l'attribut aria-describedby qui permet de faire l'association avec l'input >>> l'attribut role avec la valeur alert qui permet d'indiquer à la synthèse >>> qu'il y a eu un changement >>> Merci d'avance pour vos retours, >>> >>> Olivier >>> >>> >>> >>> _______________________________________________ >>> liste_gta mailing list >>> [email protected] >>> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org >> >> >> >> _______________________________________________ >> liste_gta mailing list >> [email protected] >> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org >> > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > > _______________________________________________ liste_gta mailing list [email protected] http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
