Si le texte alt devrait-il être ajouté à une image d'une personne pour la conformité de WCAG?
Question
J'essaie de respecter les règles d'accessibilité de la WCAG pour les attributs de texte ALT. L'arborescence de décision sur le lien suivant explique lorsque des attributs de texte ALT sont requis et lorsqu'ils ne sont pas: Arbre de décision de texte alt . Je me demande si une image d'une personne dans une biographie (par exemple dans la page "Notre équipe" de la société) doit avoir un attribut texte alt pour la conformité de WCAG. Je suis incertain parce que je ne décrirais pas une image d'une personne comme "purement décoratif", mais je ne sais pas si je dirais que cela "contribue à une signification" à une page non plus.
Le contexte
J'ai configuré une page Web pour travailler à l'aide d'un WordPress Plugin ( membres de l'équipe ) qui ne permet pas de s'ajouter au texte alt aux images de personnes (car les images sont css background-images) et je suis invité à ajouter du texte alt aux images avant que le site puisse être mis en ligne.
Même pour quelqu'un qui ne peut pas le voir, il peut être définitivement informatif qu'il existe une image qui contient la personne en question. Il est important de conserver le texte pertinent pour le contexte et pour la raison pour laquelle l'image est présentée là-bas. Si la personne pêche, mais l'image n'a été choisie que parce que c'est la personne en question, donnez simplement le nom et ne mentionne pas qu'il pêche. Si l'image représente seulement qu'il s'agit d'une personne et montre une illustration d'une personne mais pas la personne en question ...
... Cette illustration doit avoir un attribut ALT vide ou est un cas valide pour une image d'arrière-plan. Cet article contient une très bonne explication de quand et comment utiliser l'attribut Alt avec de très bons exemples.
Dans votre cas, c'est une image de la personne mentionnée et devrait avoir un texte alt. Mais il devrait s'agir d'un élément d'image pour pouvoir fournir ces informations en premier lieu. L'élément a le sens sémantique qu'une image est présentée, pourquoi elle est présentée peut être notée dans l'attribut alt mais également dans le texte environnant. Si l'élément est fermé par un autre élément qui ne contient aucun texte décrivant, l'attribut alt devrait avoir ce texte. Si l'élément est dans le même élément que le texte décrivant, ce texte est suffisant et l'attribut alt doit être vide (mais non omis!).
Les deux sont corrects:
<div>
<a href="jdoe.png"><img src="jdoe_small.png" alt="John Doe"></a>
John Doe
</div>
<div>
<img src="jdoe.png" alt="">
John Doe
</div>
Dans votre cas, l'image de fond ne sera pas remarquée par des personnes utilisant des lecteurs d'écran. Vous manquez donc des informations sémantiques qu'une image est présente. Résoudre ce problème signifie que vous devez ajouter uniquement le texte du lecteur d'écran indiquant qu'il y a une image et qu'il contient la personne en question. Ou vous pouvez omettre cette information, mais en plus de cela, cela est discriminant, il est également totalement inutile. Pourquoi ne pas simplement remplacer l'image d'arrière-plan avec l'élément d'image sémantique? Toute autre solution est plus difficile à mettre en œuvre et est éventuellement déroutante pour l'utilisateur.