Comment publier des images accessibles sur les réseaux sociaux ?

Sommaire

• Quel est l’impact des images sur l’accessibilité ?
• Comment savoir si une image a besoin d’un texte alternatif ?
  • Cas nº1 : l’image est informative
  • Cas nº2 : l’image est décorative
• Comment insérer un texte alternatif sur les réseaux sociaux ?
  • Comment insérer un texte alternatif sur LinkedIn ?
  • Comment insérer un texte alternatif sur Instagram ?
  • Comment insérer un texte alternatif sur X (ex-Twitter) ?
  • Comment insérer un texte alternatif sur Mastodon ?
  • Comment insérer un texte alternatif sur Facebook ?
• Comment insérer un texte alternatif avec Hootsuite ou Buffer ?
• Comment rédiger un texte alternatif pour les réseaux sociaux ?
  • Texte alternatif : mauvaises pratiques à éviter
• Conclusion

Quel est l’impact des images sur l’accessibilité ?

Le manque d’accessibilité des images a de multiples impacts utilisateurs. Le premier concerne bien sûr les personnes aveugles, qui ne peuvent pas voir les images, ainsi que les personnes malvoyantes.

Mais l’inaccessibilité des images impacte aussi les personnes concernées par le handicap cognitif, dont les troubles DYS (dyslexie, dysphasie, etc.).

En effet, lorsqu’une image contient du texte, il est impossible de modifier l’affichage de ce texte, car il est comme « figé » dans l’image.

Pourtant, une personne malvoyante ou DYS peut avoir besoin de modifier la taille de ce texte, d’espacer les caractères, et/ou de renforcer les contrastes pour pouvoir lire l’information présente sur l’image.

Par ailleurs, si les images ne sont pas correctement configurées lors de leur publication sur les réseaux sociaux, elles ne seront pas reconnues par les technologies d’assistance dont se servent de nombreuses personnes handicapées pour accéder aux contenus.

Elles n’en auront alors pas connaissance — un comble, si les informations essentielles de votre message se trouvent uniquement dans cette image inacessible.

Comment savoir si une image a besoin d’un texte alternatif ?

Ainsi, lorsque vous illustrez vos publications sur les réseaux sociaux avec une image :

1. demandez-vous si l’image est : informative ? Ou décorative ?
2. fournissez l’alternative textuelle appropriée à chaque cas, grâce à nos conseils ci-dessous.

Cas nº1 : l’image est informative

Une image est informative (ou « porteuse d’information ») si elle est indispensable pour comprendre la publication dans son ensemble : c’est le cas si l’image contient une information ou un texte qui ne figure pas dans le contenu textuel de la publication.

Il sera alors nécessaire de rédiger un texte alternatif pour décrire cette image.

C’est cette alternative textuelle qui permettra aux lecteurs d’écran et à d’autres technologies d’assistance de restituer cette information aux personnes aveugles et malvoyantes.

L’alternative d’une image porteuse d’information est donc un élément fondamental pour l’accessibilité de vos contenus sur les réseaux sociaux !

Exemple 1

Dans ce premier exemple, la publication est uniquement constituée d’une image sans alternative qui présente des illustrations et un texte informant des dates de fermeture de la médiathèque pendant les fêtes de fin d’année.

Dans ce contexte, l’image est indispensable pour comprendre l’objet du message. Il est nécessaire de rédiger un texte alternatif qui permettra notamment de restituer l’information aux personnes aveugles à travers leurs technologies d’assistance.

Exemple 2

Dans ce deuxième exemple, l’information est compréhensible seulement si on réussit à mettre en perspective le texte et les deux images. Mais encore faut-il pouvoir les percevoir…

Afin de permettre aux personnes aveugles ou très malvoyantes de comprendre la publication, il est nécessaire de renseigner une alternative pour chacune des images.

Pensez à vérifier les contrastes de vos images porteuses d’information

Par ailleurs, pour que vos images porteuses d’information puissent être perçues par les personnes déficientes visuelles, mais aussi par certaines personnes ayant un handicap cognitif, il convient aussi de vérifier qu’elles respectent les niveaux de contraste attendus par le Référentiel Général d’Amélioration de l’Accessibilité (RGAA).

• Images porteuses d’information contenant du texte : le texte doit présenter un rapport de contraste d’au moins 3:1 avec la couleur d’arrière-plan s’il est supérieur ou égal à 24px. En-dessous de 24px, ce rapport de contraste doit atteindre 4.5:1, cf. critère 3.2 du RGAA ;
• Images et autres éléments graphiques porteurs d’information ne contenant pas de texte : le rapport de contraste entre les couleurs doit être au moins de 3:1, cf. critère 3.3 du RGAA.

Cas nº2 : l’image est décorative

L’image est décorative si elle n’apporte aucune information supplémentaire à votre publication.

Dans l’idéal, si les réseaux sociaux eux-mêmes étaient accessibles, il faudrait que le texte alternatif reste vide pour éviter que les technologies d’assistance ne restituent inutilement sa présence.

Dans les faits, ce n’est pas le cas, parce que le code des réseaux sociaux lui-même est loin d’être accessible ! 🙄

Dans ce contexte, on peut s’interroger sur la pertinence même d’inclure des images décoratives dans les publications dédiées aux réseaux sociaux, puisque ces images seront forcément restituées par les technologies d’assistance.

En fonction du volume, toutes ces images inutiles qui sont malgré tout décrites peuvent provoquer beaucoup d’informations inutiles, de nature à nuire à l’expérience utilisateur (UX) de personnes handicapées.

Mais il y a un paradoxe : d’un point de vue marketing, une publication sans image a beaucoup moins de chance d’être relayée par les algorithmes, et donc d’être consultée.

Alors, que faire ?

Faute de mieux pour l’instant, voici ce qui nous semble le moins pire :

• Si votre publication contient un lien : n’incluez pas d’image décorative dans vos publications sur les réseaux sociaux, et tirez plutôt parti des cartes OpenGraph, qui permettent d’illustrer un lien partagé sur les réseaux sociaux ;
• Si votre publication ne contient pas de lien : n’incluez pas d’image décorative ;
  • Si votre publication ne contient pas de lien, mais que vous ou votre client tenez absolument à inclure une image décorative pour l’illustrer : il est possible d’indiquer « Image décorative » comme alternative textuelle, pour chaque image décorative, en se rappelant que cela n’a aucun intérêt d’un point de vue UX et accessibilité, et qu’il vaudrait mieux éviter de le faire.

Les réseaux sociaux obligent pour l’instant de remplir l’alternative des images décoratives, et ça pose problème

En effet, si vous laissez le texte alternatif vide, les réseaux sociaux vont réagir différemment, mais ce sera toujours une catastrophe :

• certains vont essayer de compenser l’absence d’alternative par du contenu inutile et parasite. C’est le cas de Facebook, dont l’intelligence artificielle va tenter de décrire les informations présentes à l’image avec plus ou moins de succès. Par exemple : alt="Peut-être une image de texte qui dit…" ;
• certains, comme X (ex-Twitter) ou LinkedIn, vont systématiquement ajouter leur propre alternative textuelle : alt="Image", ou bien alt="Pas de description alternative à l’image". Dans les deux cas, cela pose problème : les personnes déficientes visuelles auront certes conscience qu’il y a une image, mais celle-ci n’étant pas réellement décrite, cela ne leur sera d’aucune utilité ! L’effet pervers étant, dans ce cas précis, que l’image n’a pas été décrite précisément parce qu’elle est décorative, et n’a donc pas besoin d’être décrite du tout, même pas par « image » ni par « Pas de description alternative à l’image »… Les équipes de X et de LinkedIn ont fait, ici, preuve d’un zèle nocif pour l’accessibilité ;
• LinkedIn indique, dans une page d’aide dédiée, qu’il peut insérer automatiquement un texte alternatif… sans préciser dans quels cas. Il convient donc de faire preuve de vigilance face à cette fonctionnalité : une notification vous en informera si vous utilisez LinkedIn sur un ordinateur, mais ce ne sera pas le cas si l’image est chargée depuis votre mobile.

Dans tous ces cas, les personnes aveugles ou très malvoyantes n’auront aucun moyen de savoir si elles perdent ou non de l’information.

C’est pourquoi il est crucial de prendre soin de renseigner de manière réfléchie l’alternative aux images, et que vous – oui, vous, qui lisez cet article – avez un grand rôle à jouer à ce propos.

Comment insérer un texte alternatif sur les réseaux sociaux ?

Voyons maintenant comment configurer le texte alternatif lui-même.

Pour la plupart des réseaux sociaux – LinkedIn, Instagram, X/Twitter, Mastodon ou encore Facebook –, l’ajout du texte alternatif est possible au moment où l’on ajoute une image à la publication.

Cette alternative textuelle peut aussi être modifiée après publication de l’image.

Bon à savoir :

• l’intitulé de la fonctionnalité permettant d’ajouter un texte alternatif aux images peut varier d’une plateforme à l’autre : « Texte alternatif » sur LinkedIn, « Ajouter une description » sur X version ordinateur et « Alt » dans l’application mobile, ou encore « Ajouter une description de l’image » sur Mastodon.
• X et LinkedIn limitent à 1000 caractères le contenu du texte alternatif. Faire preuve de concision facilitera d’autant plus la compréhension de votre image par les personnes à qui le texte alternatif est dédié.
• Si l’alternative de votre image comporte un texte de plus de 1000 caractères, c’est mieux de renseigner les informations directement dans le contenu même de votre publication, plutôt qu’en alternative d’image.

Comment insérer un texte alternatif sur LinkedIn ?

Lorsque vous saisissez un message LinkedIn depuis votre ordinateur :

1. insérez l’image puis cliquez sur le bouton « alt » ou « Texte alternatif » pour afficher le bloc « Ajouter une alternative » ;
2. saisissez le texte alternatif dans le champ « Texte alternatif ».

Comment insérer un texte alternatif sur Instagram ?

Avec Instagram, depuis votre ordinateur :

1. créez une nouvelle publication, insérez la photo, faites vos modifications (Rogner — Modifier) ;
2. dans le bloc « Créer une publication », dépliez « Accessibilité » et renseignez le champ « Écrivez un texte alternatif ».

Comment insérer un texte alternatif sur X (ex-Twitter) ?

Sur X, avec un ordinateur :

1. ajoutez l’image à votre publication ;
2. sélectionnez « Ajouter une description » ;
3. saisissez le texte alternatif de l’image dans le champ « Description ».

Comment configurer un rappel pour le texte alternatif sur X ?

À noter : X propose une fonctionnalité pour créer un rappel avant la publication de votre message si vous oubliez de saisir un texte alternatif.

Cette fonctionnalité peut être activée depuis les menus suivants, dans l’ordre :

1. « Paramètres » ;
2. « Accessibilité, affichage et langues » ;
3. « Accessibilité » ;
4. bloc « Médias » : cochez la case « Recevoir le rappel de la description d’image ».

Le rappel « N’oubliez pas de garantir l’accessibilité de votre image » sera affiché lorsque vous activerez le bouton « Poster » alors qu’aucun texte alternatif n’a été saisi.

Comment insérer un texte alternatif sur Mastodon ?

Sur Mastodon, le principe sera le même que sur les autres réseaux sociaux.

Sur ordinateur, après avoir inséré le média :

1. cliquez sur « Description manquante » ;
2. insérez le texte alternatif dans le champ « Décrire pour les malvoyant·e·s ».

Comment insérer un texte alternatif sur Facebook ?

Sur Facebook, rebelotte. Après avoir inséré la photo :

1. cliquez sur « Modifier » pour ouvrir « Détails de la photo » ;
2. sélectionnez « Texte alternatif » ;
3. puis sélectionnez le bouton radio « texte alternatif personnalisé ».

Comment insérer un texte alternatif avec Hootsuite ou Buffer ?

Programmez-vous vos publications sur les réseaux sociaux avec des outils tels que Hootsuite ou Buffer ? Oui ?

Alors vérifiez qu’ils vous offrent bien la possibilité d’ajouter un texte alternatif à vos images.

Les pages d’aide de chaque outil devraient vous permettre de trouver cette information. C’est par exemple proposé par Hootsuite, Buffer, etc.

Redoublez de vigilance, et vérifiez que vos textes alternatifs sont bien corrects une fois vos contenus publiés.

Par exemple, cela ne semble pas être toujours le cas avec Meta Business Suite. Lors de nos tests, l’alternative d’image saisie dans l’outil n’a pas été prise en compte lors de la publication ; le texte alternatif de la photo publiée sur Facebook a donc été, à nouveau, alt="Peut-être une image de… ". 🫠

Il a donc fallu modifier la publication, et corriger à la main le texte alternatif, une seconde fois.

Les problèmes d’accessibilité ne sont pas toujours dus aux personnes qui publient des contenus : les plateformes elles-mêmes sont souvent fautives, en implémentant des fonctionnalités qui n’ont pas toujours été assez bien pensées et testées.

Comment rédiger un texte alternatif pour les réseaux sociaux ?

Le texte alternatif d’une image doit reprendre l’information visible, être clair et concis. N’oubliez pas, le but est de transmettre la même information aux personnes handicapées qui utilisent un lecteur d’écran, qu’aux autres.

Texte alternatif : mauvaises pratiques à éviter

N’indiquez pas qu’il s’agit d’une image. ❌ En effet, les lecteurs d’écrans en informent déjà les personnes déficientes visuelles.

Attention également à la très mauvaise pratique de l’« easter egg » : le texte alternatif ne doit pas servir à cacher des messages ou des blagues ! ❌

Le texte alternatif d’une image ne sert pas non plus à cacher des mots clés SEO. ❌

Conclusion

Dans vos publications sur les réseaux sociaux, traitez chaque image avec soin : renseignez son texte alternatif, en y retranscrivant les informations visibles dans l’image.

Pour faire vraiment bien les choses, modifiez si nécessaire vos publications passées en corrigeant les alternatives des images que vous n’auriez pas encore décrites.

Dans les deux prochains articles, nous nous attaquerons à d’autres gros morceaux : l’accessibilité des contenus vidéo et audio, et l’accessibilité des carrousels LinkedIn. 😱

D’ici là, prenez un moment pour compléter votre liste de bonnes pratiques éditoriales, en notant ce qu’il ne faut pas oublier pour que les images soient accessibles sur les réseaux sociaux.

À très bientôt !