Introduction

Le texte alternatif est une courte description qui transmet la signification du contenu multimédia lorsque celui-ci ne peut pas être visualisé, afin que les utilisateurs malvoyants puissent le comprendre. Il profite également à tous les utilisateurs en offrant plus de clarté, et en soutenant une expérience de formation plus inclusive.

Cet article propose des suggestions pratiques pour configurer le texte alternatif des médias que vous utilisez sur la plateforme. 

Pour vous aider à démarrer, voici quelques ressources utiles sur la rédaction d'un texte alt efficace :

• WebAIM : Texte alternatif (s’ouvre dans un nouvel onglet)
• Quelle est l’alternative ? Comment écrire un bon texte alt - Design102 (s’ouvre dans un nouvel onglet)

Espaces de la plateforme où vous pouvez ajouter des images

Voici une liste des espaces de la plateforme où vous pouvez télécharger des images et en configurer le texte alternatif.

Attention ! Ajoutez toujours un texte alternatif pour les images incluses dans le contenu de vos contenus pédagogiques. Docebo n'est pas responsable du contenu que vous téléchargez sur votre plateforme.

Descriptions de cours

Lorsque vous ajoutez des images à une description de cours, saisissez le texte alternatif en cliquant sur l'image puis sur Texte alternatif.

Description du contenu pédagogique

Lorsque vous ajoutez des images à la description des supports de formation, utilisez le champ Description de l’image lors du processus de téléchargement pour ajouter le texte alternatif. La description de l’image correspond au texte alternatif.

Widgets de page

Le widget Image n'est actuellement pas accessible. Si vous devez télécharger des images contenant un contenu significatif, utilisez le widget boîte de contenu personnalisé (sans bouton) ou créez un widget HTML avec un vrai texte placé au-dessus de l'image. 

Pour plus d'informations, consultez l’article Configuration des pages de widgets accessibles.

Rédiger un texte alternatif pour les images

Les images enrichissent le contenu et fournissent un contexte visuel, simplifiant l'expérience utilisateur et aidant ceux qui ont des difficultés de lecture ou qui préfèrent l'apprentissage visuel, réduisent la charge cognitive, et rendent l'information plus facile à saisir d'un coup d'œil. 

Cependant, elles peuvent aussi poser des défis pour les utilisateurs de lecteurs d'écran. Pour garantir que tous les utilisateurs, quelles que soient leurs capacités, puissent comprendre le but et la signification d'une image, il est important de fournir un texte alternatif descriptif.

Rédiger un bon texte alternatif est crucial pour transmettre le message d'une image aux utilisateurs qui ne peuvent pas la voir. Visez la concision et la précision.

Voici quelques directives :

• Soyez concis et précis : décrivez le sujet principal et le but de l'image en aussi peu de mots que possible. Évitez les détails inutiles.
  ✅ Utilisez : Ordinateur portable sur un bureau.
  ❌ Évitez : Une photo d’un ordinateur portable posé sur un bureau avec une tasse de café à côté et quelques papiers.
• Transmettez le message ou la fonction : quelle information ou fonction l'image fournit-elle ?
  • Image montrant un graphique : Tendances des ventes pour le T1 2024, montrant une augmentation de 15 %.
  • Image servant de bouton : Icône loupe pour la recherche.
• Évitez la redondance : les lecteurs d'écran annoncent automatiquement qu’un élément est une image, il n’est donc pas nécessaire d’inclure le mot « image » dans votre texte alternatif. 
  ✅ Utilisez : Un chat duveteux
  ❌ Évitez : Image d’un chat
• Fournissez du contexte : le texte alternatif se rapporte au contexte dans lequel l'image est utilisée. Prenez en considération les informations qui feraient défaut à l’utilisateur s’il ne pouvait pas voir l’image.
• Ignorez le texte alternatif pour les images décoratives : si une image est purement décorative et n’ajoute pas d’information significative, laissez le texte alternatif vide. Cela permet aux lecteurs d'écran de passer outre, et d’éviter ainsi les distractions inutiles. Les miniatures et images d’en-tête, souvent mises en œuvre comme arrière-plans, sont généralement invisibles aux lecteurs d'écran, elles ne nécessitent donc pas de texte alternatif.

Références

• Tutoriel Images | Web Accessibility Initiative (WAI) | W3C (s’ouvre dans un nouvel onglet)
• Images informatives | Web Accessibility Initiative (WAI) | W3C (s’ouvre dans un nouvel onglet)
• Un arbre de décision alt | Web Accessibility Initiative (WAI) | W3C (s’ouvre dans un nouvel onglet)
• Trucs et astuces | Web Accessibility Initiative (WAI) | W3C (s’ouvre dans un nouvel onglet)

Images de texte : pourquoi vous devriez les éviter

Une image de texte (s’ouvre dans un nouvel onglet) est un texte rendu sous forme d’image plutôt que de texte réel et sélectionnable, pour transmettre un message.

Les lecteurs d'écran ne peuvent pas lire le texte intégré dans les images, ce qui signifie que les utilisateurs qui dépendent de cette technologie peuvent manquer des informations importantes. De plus, les utilisateurs malvoyants peuvent avoir des difficultés à lire le texte dans les images en raison d’un faible contraste ou d’arrière-plans complexes. 

Sur les designs responsives, le texte superposé aux images peut devenir mal aligné ou trop petit sur les écrans plus petits, ce qui entrave encore plus l’accessibilité, surtout pour les utilisateurs malvoyants. En revanche, le texte réel peut être redimensionné, agrandi et ajusté pour répondre aux besoins individuels, offrant une plus grande flexibilité et améliorant l’accessibilité pour tous les utilisateurs.

Utilisez du texte séparé au lieu de l’intégrer dans les images. Cela rend le contenu lisible, redimensionnable et adaptable pour tous les utilisateurs. 

Si vous devez utiliser des images de texte, assurez-vous qu'il y a un contraste suffisant entre le texte et son arrière-plan, ou utilisez un fond uni pour améliorer la visibilité. Fournissez toujours un texte alternatif descriptif, mais évitez de vous fier uniquement à l’image pour transmettre des informations essentielles.