Skip to main content

Accessibilite pour les createurs de contenu : rediger et produire du contenu inclusif

L'accessibilite ne commence pas avec le design et ne se termine pas avec le code. Les createurs de contenu — redacteurs, editeurs, specialistes du marketing et producteurs multimedia — ont un impact direct et significatif sur la capacite de chacun a utiliser le contenu numerique. Les mots que vous choisissez, la structure que vous creez, les images que vous decrivez et les medias que vous produisez determinent tous l'experience des utilisateurs en situation de handicap.

La bonne nouvelle est que rediger de maniere accessible revient en grande partie a bien rediger. Un contenu clair, structure et descriptif profite a tous les utilisateurs, pas seulement a ceux qui utilisent des technologies d'assistance.

Rediger dans un langage clair

Une redaction claire et directe est une exigence d'accessibilite, pas seulement une preference de style. Les utilisateurs ayant des handicaps cognitifs, des troubles d'apprentissage tels que la dyslexie, les personnes dont la langue n'est pas la langue maternelle, et les utilisateurs simplement presses ou distraits beneficient tous d'un contenu facile a comprendre.

Redigez des phrases courtes en voix active. Utilisez des mots courants plutot que du jargon ou de la terminologie technique — et lorsque des termes specialises sont necessaires, expliquez-les. Divisez les longs passages en paragraphes plus courts avec des sous-titres descriptifs. Utilisez des listes pour presenter plusieurs elements ou etapes. Evitez les expressions idiomatiques, les metaphores et les references culturellement specifiques qui peuvent ne pas bien se traduire.

Le WCAG exige que le contenu soit aussi lisible que possible et, au niveau AAA, qu'un contenu supplementaire ou une version alternative soit fourni lorsque le texte necessite un niveau de lecture superieur au niveau du secondaire inferieur.

Texte alternatif pour les images

Le texte alternatif est l'une des responsabilites de contenu les plus importantes. Chaque image qui transmet une information necessite une alternative textuelle qui communique la meme information aux utilisateurs qui ne peuvent pas voir l'image. Les lecteurs d'ecran lisent le texte alternatif a voix haute, et il apparait lorsque les images ne se chargent pas.

Rediger un bon texte alternatif consiste a communiquer le but, pas seulement l'apparence. Posez-vous la question : quelle information cette image transmet-elle que l'utilisateur doit connaitre ? Une photo d'une equipe en reunion pourrait necessiter un texte alternatif comme « Equipe collaborant sur des plans de projet autour d'une table de conference » plutot que « photo.jpg » ou un vague « photo d'equipe ».

Differents types d'images necessitent des approches differentes :

Les images informatives qui transmettent du contenu necessitent un texte alternatif descriptif qui communique l'information. Soyez concis — generalement moins de 125 caracteres — mais assurez-vous que l'information essentielle est presente.

Les images fonctionnelles telles que les icones utilisees comme boutons necessitent un texte alternatif qui decrit la fonction, pas l'apparence. Une icone de loupe dans un bouton de recherche devrait avoir le texte alternatif « Rechercher », pas « loupe ».

Les images decoratives qui ajoutent un interet visuel mais aucune information doivent avoir un texte alternatif vide (alt="") pour que les lecteurs d'ecran les ignorent completement. Les photos de stock utilisees uniquement a des fins esthetiques entrent souvent dans cette categorie.

Les images complexes telles que les graphiques, les diagrammes, les infographies ou les schemas necessitent plus qu'un bref attribut alt. Fournissez un texte alternatif court qui identifie l'image, puis fournissez une description detaillee a proximite — soit sous forme de texte visible, de legende ou de description longue liee.

Texte des liens

Les liens doivent avoir du sens hors contexte. Les utilisateurs de lecteurs d'ecran naviguent frequemment en affichant une liste de tous les liens d'une page. Si chaque lien dit « En savoir plus » ou « Cliquez ici », cette liste est inutile.

Redigez un texte de lien qui decrit ou mene le lien ou ce qu'il fait. Au lieu de « Cliquez ici pour telecharger notre guide d'accessibilite », ecrivez « Telecharger notre guide d'accessibilite ». Au lieu de « En savoir plus », ecrivez « En savoir plus sur les niveaux de conformite WCAG ».

N'utilisez jamais une URL brute comme texte de lien, sauf si l'URL elle-meme est l'information communiquee. Les URL sont difficiles a lire a voix haute et encore plus difficiles a comprendre lorsqu'elles sont entendues.

Titres et structure

Utilisez les titres pour creer une hierarchie de contenu significative, pas pour le style visuel. Les utilisateurs de lecteurs d'ecran naviguent par les titres pour parcourir le contenu et acceder aux sections qui les interessent. Les titres doivent suivre un ordre logique — H1 pour le titre de la page, H2 pour les sections principales, H3 pour les sous-sections au sein de ces sections — sans sauter de niveaux.

Chaque page devrait avoir exactement un H1. Les sous-titres doivent etre suffisamment descriptifs pour qu'un utilisateur puisse comprendre le contenu de la section a partir du titre seul.

Tableaux

Utilisez les tableaux pour les donnees tabulaires — des informations qui ont des relations significatives entre les lignes et les colonnes. N'utilisez jamais les tableaux pour la mise en page visuelle. Lorsque vous utilisez des tableaux, incluez des cellules d'en-tete appropriees en utilisant les elements <th> avec des attributs scope indiquant s'il s'agit d'en-tetes de ligne ou de colonne. Pour les tableaux complexes avec plusieurs niveaux d'en-tetes, utilisez les attributs id et headers pour associer explicitement les cellules de donnees a leurs en-tetes.

Fournissez une legende ou un resume qui decrit l'objectif du tableau, en particulier pour les tableaux de donnees complexes.

Listes

Lorsque vous presentez un groupe d'elements lies, utilisez de vraies listes HTML — des listes ordonnees (<ol>) pour les elements sequentiels et des listes non ordonnees (<ul>) pour les elements non sequentiels. Ne creez pas de fausses listes en utilisant des sauts de ligne et des tirets ou des caracteres de puces. Un balisage de liste correct indique aux lecteurs d'ecran combien d'elements contient la liste et ou se trouve l'utilisateur dans celle-ci.

Contenu video et audio

Le contenu multimedia a des exigences specifiques en matiere d'accessibilite :

Des sous-titres doivent etre fournis pour toutes les videos preenregistrees avec audio. Les sous-titres doivent inclure tous les dialogues parles, identifier qui parle lorsque ce n'est pas visuellement evident et inclure les effets sonores significatifs. Les sous-titres doivent etre synchronises avec l'audio et disponibles en tant que sous-titres fermees que les utilisateurs peuvent activer ou desactiver.

Des transcriptions doivent etre fournies pour le contenu audio uniquement preenregistre, comme les podcasts. Les transcriptions doivent inclure tout le contenu parle, identifier les intervenants et decrire les sons non vocaux pertinents.

Des audiodescriptions doivent etre fournies pour les videos preenregistrees ou des informations visuelles importantes ne sont pas transmises par la piste audio. Les audiodescriptions narrent les elements visuels significatifs — actions, changements de scene, texte a l'ecran — pendant les pauses naturelles du dialogue.

La lecture automatique de l'audio doit etre evitable. Si l'audio se lance automatiquement pendant plus de trois secondes, fournissez un mecanisme pour mettre en pause, arreter ou controler le volume independamment du volume systeme.

Documents accessibles

Les PDF et autres documents telechargeables doivent egalement etre accessibles. Cela signifie qu'ils necessitent une structure de balisage appropriee (titres, listes, tableaux), un ordre de lecture logique, du texte alternatif pour les images, une langue de document definie et des signets pour la navigation dans les documents longs.

Lorsque c'est possible, fournissez les informations importantes sous forme de contenu web plutot que de documents telechargeables. Le contenu web est inheremment plus flexible et plus facile a rendre accessible que le PDF.

Contenu sur les reseaux sociaux

L'accessibilite s'etend aux reseaux sociaux. Ajoutez du texte alternatif aux images publiees sur les plateformes de reseaux sociaux — la plupart des grandes plateformes le supportent desormais. Utilisez le CamelCase dans les hashtags pour que les lecteurs d'ecran puissent les analyser correctement (par exemple, #AccessibiliteWeb plutot que #accessibiliteweb). Evitez de transmettre des informations uniquement par des images ou des videos sans alternatives textuelles.

Caracteristiques sensorielles

Ne fournissez jamais d'instructions qui reposent uniquement sur des caracteristiques sensorielles telles que la forme, la couleur, la taille, la position visuelle, l'orientation ou le son. Au lieu de « cliquez sur le bouton vert » ou « voir la barre laterale a droite », fournissez un contexte supplementaire : « cliquez sur le bouton Envoyer » ou « voir la section Articles connexes ».

Votre site web est-il accessible ?

Scannez votre site web gratuitement et obtenez votre score WCAG en quelques minutes.

Scanner votre site gratuitement