search

codegouvfr / react-dsfr

🇫🇷 The French Government Design system React toolkit
https://react-dsfr.codegouv.studio
MIT License
406 stars 51 forks source link

Problème de sémantique HTML dans le composant Footer #217

Open humchaop opened 8 months ago

humchaop commented 8 months ago

Il y a une erreur de sémantique dans le composant Footer. Le texte du logo "Intitulé officiel" est dans une balise <p> inclus dans une balise <a>. Les balises <p> n'étant pas autorisées dans les balises <a>, nous avons une anomalie d'accessibilité.

Il faudrait supprimer la balise <p> ou la remplacer par un <span>.

Exemple de code : Composant Footer default Composant Footer default

enguerranws commented 8 months ago

Inclure des balises block dans un élément <a> était une erreur de validation en HTML / XHTML 4 et moins, ce n'est plus le cas en HTML5. Ça ne pose (à ma connaissance), pas de souci d'accessibilité également : l'arbre d'accessibilité me semble clean (cf. screenshot), l'élément est bien accessible au clavier et la lecteur de texte fonctionne bien également.

Capture d’écran 2024-01-15 à 15 27 35

@humchaop Je reste à dispo si tu constates un impact négatif, pour éventuellement faire remonter ça à l'équipe du DSFR (ici, nous ne faisons que suivre l'implem HTML / CSS qu'ils mettent en place).

enguerranws commented 2 months ago

@humchaop s'il n'y a pas de nouvelles, je propose de clore le ticket.