Pourquoi l'attribut  alt  est-il obligatoire ?

Bonjour,

Je me demande pourquoi l’attribut alt sur les images est obligatoire selon les normes du W3C ?
Si je passe mon code dans un validateur, j’ai 150 erreurs qui sont les mêmes pour les 150 images.

Pourquoi est-ce une erreur, et non un warning ?
Dans le contexte de mon développement, l’attribut alt ne sert à rien.

C’est pour les malvoyants ou les non voyants et si ton image ne s’affiche pas (l’url n’est pas bonne, …)

Ça affiche le contenu de l’attribut, si je me souvient bien dans les cas suivants :

• Au survol.
• En cas d’erreur de chargement de l’image.
• Pour le lecteur d’écran, souvent utilisé par les mal/non-voyants, c’est donc une amélioration de l’accessibilité du site.

Il est donc conseillé de mettre la description de l’image dans l’attribut. Par exemple :
Je vais mettre alt="Un nounours rose assis" pour cette image.
Crédit de l’image: J’en sais rien c’était le premier résultat de ma recherche…
Si tu inspecte les éléments d’une page de ZdS tu peut d’ailleurs voir les balises alt sur les images du site.

alt est aussi utile pour les images cassées/pas encore chargées.

C’est une erreur et non un avertissement car la prise en compte des personnes malvoyantes n’est pas une option. C’est une obligation.
Ce serait révoltant de considérer les malvoyants comme marginaux ou de faible importance. Surtout quand ils représentent une part aussi importante de la population (~2% en France).

Je comprends mieux, merci pour ces explications !

J’ai remarqué que la documentation MDN n’indique pas l’attribut alt comme étant 'mandatory’.
Par contre, src est un attribut 'mandatory' sur une image.

The alt attribute contains a textual description of the image, which isn’t mandatory but is incredibly useful for accessibility — screenreaders read this description out to their users so they know what the image shows, and it is also displayed on the page if the image can’t be loaded for some reason.

src: The image URL. This attribute is mandatory for the <img> element.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Img

Je développe un site en réseau local, je vais par conséquent oublier l’attribut alt par facilité, économie de caractères et c’est autorisé (mais déconseillé) par le MDN.

Correction : non, pas au survol (sauf sur certaines versions d’IE qui font n’importe quoi, je crois). Le texte affiché au survol, c’est l’attribut title qui le spécifie (et ça marche sur n’importe quel élément).

Pour le reste, mes voisins du dessus ont tout dit. L’accessibilité c’est important. Et personnellement je le ferais même en local, ne serais-ce que pour garder l’habitude .

J’ai une autre petite question : 31,5 Ko pour une page web HTML sans compter les ressources (sans les images, JS et CSS), est-ce beaucoup ?

Nope c’est pas beaucoup.

Il y a encore des navigateurs qui affichent le texte plutôt qu’un logo montrant que l’image ne peut s’afficher car elle n’a pas pu être chargée ?

Oui, il me semble.

C’est même le comportement normal. Ce n’est pas du tout un truc de vieux.

https://www.frandroid.com/android/applications/606632_bug-dimages-de-facebook-et-instagram-saviez-vous-comment-lalgorithme-vous-voit

Je pense que je n’ai pas été clair. En fait, j’ai souvenir que des navigateurs n’affichaient pas le texte alternatif. J’ai peut être Safari en tête et généralise à tous.

le title d’une image à ce comportement.

title ? C’est pas pour l’infobulle ?

C’est bien title qui fait ça mais il peut être surchargé par celui d’un lien si l’image est dans une balise <a>.

J’ai trouvé ce dont je voulais parler (Source) :

Sur Safari, je ne crois pas déjà avoir vu le texte alternatif d’une image non chargée. On dirait que Chrome aussi mais je ne l’utilise pas.

Correction : non, pas au survol (sauf sur certaines versions d’IE qui font n’importe quoi, je crois). Le texte affiché au survol, c’est l’attribut title qui le spécifie (et ça marche sur n’importe quel élément). Autant pour moi, je me suis effectivement trompé

Bonjour, Comment voir les balises Alt d’une image sur Instagram à partir de son navigateur. Un grand merci d’avance pour votre réponse. Votre blog est génial Je vous souhaite une très bonne journée. Didier

Bonjour, je vous invite à créer un sujet distinct pour poser votre question.

Je ferme celui-ci.