107 votes

Accessibilité: recommandez-vous une convention de texte alternatif pour les SVG et MathML?

Aperçu

HTML5 permet désormais le balisage et dans un document HTML sans dépendre de namespaces externes (aperçu complet ici). Chacun possède son propre analogue d'attribut alt (voir ci-dessous) qui est effectivement ignoré par les logiciels de lecteur d'écran actuels. Ainsi, ces éléments sont inaccessibles aux utilisateurs aveugles.

Y a-t-il des plans pour mettre en place une convention de texte alternatif standard pour ces nouveaux éléments? J'ai examiné la documentation et je n'ai rien trouvé!

Détails Supplémentaires

Concernant SVG: le texte alternatif d'un SVG peut être considéré comme le contenu de la balise racine title ou desc.

  Un titre d'image
  Ceci est la description plus détaillée de l'image
  ...

J'ai trouvé un lecteur d'écran qui le lit ainsi, mais est-ce la norme? Les méthodes précédentes d'insertion de SVG avaient également des problèmes d'accessibilité car les balises ``sont traitées de manière incohérente par les lecteurs d'écran.

Concernant MathML: le texte alternatif de MathML doit être stocké dans l'attribut alttext.

  ...

Étant donné que les lecteurs d'écran ne semblent pas en tenir compte, la bibliothèque de rendu mathématique MathJax insère du texte dans un attribut aria-label pendant l'exécution.

...

Malheureusement, NVDA, JAWS, et d'autres ne lisent pas encore de manière fiable ces étiquettes. (Plus sur WAI-ARIA)

Concernant les deux: n'ayant pas de succès avec les attributs ARIA largement non pris en charge, j'ai essayé d'utiliser les attributs title. Ceux-ci semblent également être ignorés sur ces éléments HTML "étrangers".

Conclusion

Plus qu'un simple hack, je cherche le mode recommandé pour placer du texte alternatif sur ces nouveaux éléments HTML. Peut-être y a-t-il une spécification du W3C que j'ai omise? Ou est-il encore trop tôt dans le jeu?

``

1voto

MiniEggs Points 11

La réponse d'Andrew est bonne. De plus, si vous utilisez react-icons, vous pouvez simplement ajouter les attributs à l'icône et la balise de titre ou l'attribut caché sera ajouté. Par exemple:

import { FiX } from 'react-icons/fi'

-2voto

ZiggyTheHamster Points 407

Je n'ai pas testé cela, mais vous pourriez essayer d'ajouter alt="quoi que ce soit" à un conteneur DIV. Oui, ce n'est pas un attribut valide pour DIV, mais je peux voir que les anciens lecteurs d'écran ne se soucient pas de l'emplacement où alt apparaît.

Par exemple :

    ...

Évidemment, cela sous-entend que les lecteurs d'écran liront (incorrectement) les attributs alt sur des éléments autres que IMG. Je n'ai pas testé, mais c'est mieux que d'attendre que les lecteurs d'écran rattrapent le coup si cela fonctionne.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X