L'image possède-t-elle un "texte alternatif" ?

Si l'image est purement décorative, il n'est pas nécessaire de renseigner ce champ. Une image est considéré décorative si elle peut être retirée de la page sans en affecter le sens.

Si l'image transmet de l'information significative et n'est pas purement décorative, on doit inscrire une courte description du contenu de l'image et/ou de sa fonction dans son champ Texte alternatif (ou Texte de remplacement). Cette description sera lue par les lecteurs d'écran. Utilisez la méthode qui correspond le mieux à vos besoins parmi les méthodes suivantes :

• Au dépôt de l'image dans le répertoire de fichiers :
  Éditer l'image ()*, onglet Général, champ Texte alternatif. Cette valeur s'appliquera partout où l'image est insérée.
  
  
• En éditant l'image d'un élément de type Texte et images ou Images seulement :
  Éditer l'élément, onglet Images, Paramètres de l'image (), champ Texte alternatif.
  
  
• En éditant l'image insérée directement dans un champ texte :
  Sélectionner et éditer l'image () dans le texte, champ Texte de remplacement.

_______________

* Si vous ne voyez pas l'icône crayon, assurez-vous d'avoir coché la case "Vue avancée" se trouvant sous la liste.

La vidéo a-t-elle des sous-titres et l'audio a-t-il une transcription ?

Certains utilisateurs sont incapables :

• D'entendre le son : Tout contenu audio doit être accompagné d'une transcription et tout vidéo doit être accompagné de sous-titres.
  
  
• De voir un contenu vidéo : Tout contenu vidéo doit être édité de manière à garantir que le contenu important est accessible via la piste audio. Si ça n'est pas le cas, ces contenus doivent être décrits dans une piste de narration distincte appelée "audio description".
  
  
• D'opérer une souris : Tout contenu multimédia doit être diffusé dans un lecteur qui peut être utilisé uniquement à l'aide du clavier et dont les commandes sont correctement étiquetées afin qu'elles soient annoncées aux utilisateurs de lecteurs d'écran et puissent être utilisées efficacement par les utilisateurs de saisie vocale.

La page Web ou le document comprend-il une hiérarchie de titres, des listes et d'autres éléments sémantiques pour bien communiquer la structure du document ?

Hiérarchie

Les titres (hiérarchie de lecture) permettent aux visiteurs du site de voir rapidement comment une page est organisée; ils doivent offrir le même avantage aux utilisateurs non voyants.

Les pages doivent suivre une structure d'entête hiérarchique, sans sauter de niveaux. Autrement dit, chaque titre ne doit pas être présenté sans son titre parent. Vous ne devriez donc pas avoir un entête h3 sans entête h2 ou un entête h2 sans entête h1. Cela permet aux utilisateurs de technologies d'assistance de parcourir la page en parcourant les titres de manière logique pour accéder aux informations qu'ils recherchent sans avoir à parcourir l'intégralité du texte de la page de haut en bas.

Ce n'est jamais une bonne idée d'utiliser des en-têtes à des fins de formatage. Il est toujours préférable d'utiliser les en-têtes pour leur destination sémantique et d'utiliser CSS pour formater le texte à la place.
Notez qu'en tant qu’édimestre, vous n’avez pas accès à modifier ces css. Vous êtes limités à utiliser la feuille de styles de la coquille. Si le besoin de dérogation de la hiérarchie concerne une section de la page qui peut être vue comme une section à part du contenu principal de la page (p.ex. l'affichage d'un encadré annonce), il est alors acceptable que cette section possède sa propre hiérarchie.

Listes

Assurez-vous, quand il s'agit d'une liste d'items, de bien utiliser les options de liste  ou .

Lors de la création de contenu, il est important de déterminer que votre contenu est en réalité une liste d'éléments. Si les listes sont créées en tant que listes, les lecteurs d'écran peuvent informer leurs utilisateurs qu'ils ont atterri sur une liste et peuvent fournir des informations supplémentaires telles que le nombre d'éléments dans la liste. Il s'agit d'informations extrêmement utiles pour les utilisateurs afin de leur permettre de décider s'ils vont continuer à lire le contenu de la liste.

Tableaux

Utilisez les tableaux avec parcimonie. La consultation d'un tableau d'envergure est difficile sur un appareil mobile. Assurez-vous de bien identifier les entêtes (de lignes ou de colonnes) comme étant des entêtes.

Les tableaux doivent être utilisés uniquement pour présenter des lignes et des colonnes de données, et non pour organiser la mise en page de la page. Lors de la création d'un tableau de données, comprenez que les utilisateurs voyants peuvent facilement parcourir et comprendre le tableau en examinant une cellule de données avec ses entêtes, et en la comparant à d'autres cellules de données. Les personnes qui ne peuvent pas voir le tableau dans sa globalité n'ont pas accès à tous les repères visuels qui rendent cela possible. Par conséquent, ils dépendent de l'auteur de la table de leur avoir fourni un balisage qui définit explicitement les rôles et les relations de toutes les parties de la table. Par exemple, tous les entêtes de colonne doivent être identifiés comme des entêtes de colonne et les entêtes de ligne doivent être identifiés comme des entêtes de ligne.

L'interface présente-t-elle un contraste suffisant entre la couleur du texte et la couleur d'arrière-plan ?

Certains utilisateurs ont du mal à percevoir le texte s'il y a trop peu de contraste entre le premier plan et l'arrière-plan. Certains rapports de contraste spécifiques doivent être respectés afin de se conformer à des niveaux acceptables d'accessibilité.

L'objectif de l'UdeM est d'atteindre au moins une note de passage de niveau AA (ou 90% dans Lighthouse) au niveau des contrastes pour les textes. Afin de respecter les directives de niveau AA, le texte ou les images de texte doivent avoir un rapport de contraste d'au moins 4.5:1 (ou 3:1 pour un texte de grande taille).

La présentation visuelle des éléments suivants doit aussi avoir un rapport de contraste d'au moins 3:1 par rapport aux couleurs adjacentes :

• Composants de l'interface utilisateur : Éléments visuels requis où la distinction des couleurs est essentielle à la compréhension (p.ex. pastille de couleurs déterminant un état particulier).

• Objets graphiques : Graphiques ou parties de graphiques où la distinction des couleurs est essentielle à la compréhension de l'information.

Plusieurs outils gratuits ont été développés pour faciliter la vérification des combinaisons de couleurs pour l'accessibilité. Voici deux excellents exemples :

• L'analyseur de contraste des couleurs du groupe Paciello pour Windows ou Mac est une application téléchargeable qui vous permet de vérifier le contraste de deux couleurs. 
• Le vérificateur de contraste des couleurs WebAIM est un site Web qui constitue un excellent compagnon pour l'analyseur de contraste des couleurs. Sa fonctionnalité la plus utile est un ensemble de liens « Éclaircir » et « Foncer » qui peuvent être utilisés pour apporter des modifications subtiles aux couleurs existantes jusqu'à ce qu'une note de réussite soit atteinte.
• L'outil Lighthouse intégré à Chrome via DevTools peut aussi être utilisé pour évaluer le niveau d'accessibilité d'une page web. Vous pouvez faire une recherche sur Comment utiliser Lighthouse sur Chrome, ou sur Firefox.

Si vous détectez un contraste insuffisant sur lequel vous n'avez aucun contrôle ou si vous n'êtes pas sûrs, n'hésitez pas à communiquer avec l'équipe des Communications numériques.

La page Web (ou le document) a-t-elle un titre décrivant son sujet ou son objectif ?

Le titre d'une page Web ou d'un document doit décrire sa fonction ou son objectif.

• Le titre est généralement le premier contenu annoncé par les lecteurs d'écran lorsqu'une nouvelle page est chargée.
• Le titre apparaît dans l'onglet du navigateur.
• Le titre identifie la page lorsqu'elle est ajoutée aux favoris.
• Le titre identifie la page dans les résultats des moteurs de recherche.

Des mécanismes sont-ils en place pour permettre aux utilisateurs de contourner des blocs de contenu d'un document (par exemple des signets dans un PDF) ?

Signets (fichiers PDF)

Il est recommandé que les fichiers PDF volumineux contiennent des signets. Ceux-ci permettent aux utilisateurs de passer efficacement à un chapitre particulier ou à une section majeure. Avant d'ajouter des signets à un PDF, assurez-vous que le document est balisé et possède une bonne structure d'entête et de niveaux formant un plan du document.

Une fois que vous avez un PDF balisé avec une bonne structure, sélectionnez Signets dans le volet de navigation d'Adobe Acrobat Pro. Sélectionnez ensuite Nouveaux signets à partir de la structure…. Une boîte de dialogue apparaîtra montrant les différents éléments structurels qui sont utilisés dans le document. Sélectionnez H1, H2 et des niveaux de titres supplémentaires si vous le souhaitez. Lorsque vous décidez d'un niveau de détail approprié dans vos signets, essayez d'équilibrer le besoin de navigation avec le besoin de simplicité. Gardez à l'esprit que plus vous avez de signets, plus il faudra de temps aux lecteurs d'écran pour les lire.

Le texte du lien est-il significatif, indépendant du contexte ?

Le texte d'un lien doit être unique dans une page, doit être significatif lorsqu'il est lu hors contexte et doit aider les utilisateurs à identifier leur destination ou ce à quoi elle sert s'ils cliquent ce lien. Le texte d'un lien tel que "Cliquez ici" ou "Voir plus" ne répond pas à ces critères. Tenez compte des différentes manières dont les utilisateurs interagissent avec les liens :

• Les utilisateurs de lecteurs d'écran peuvent générer une liste de liens et les parcourir par ordre alphabétique. Un texte de lien redondant ou ambigu tel que "Voir plus" n'a pas de sens dans ce contexte.
• Les utilisateurs de la technologie de reconnaissance vocale peuvent sélectionner un lien avec une commande vocale telle que « clic » suivi du texte du lien. Par conséquent, il est également utile d'utiliser un texte de lien unique, court et facile à dire.

Prenons l'exemple suivant où le texte du lien est « cliquez ici », ce qui ne répond pas aux critères :

Une meilleure approche serait de reformuler la phrase ainsi :

Si le caractère pratique d'utiliser le même libellé pour les liens se trouvant à la fin de blocs de texte répétés, par exemple des liens "En savoir plus" à la fin d'une série de courtes accroches, il existe une variété de techniques acceptables pour rendre ces liens plus accessibles sans ajouter d'encombrement ni sacrifier la lisibilité. Par exemple, donner un titre significatif au lien (en éditant le lien et en renseignant le champ Titre). Ce titre sera lu par les lecteurs d'écran.

Le site Web présente-t-il une navigation cohérente ?

Les utilisateurs Web, en particulier les utilisateurs handicapés, dépendent de la prévisibilité des pages Web. Si la navigation est cohérente d'une page à l'autre d'un site, il est beaucoup plus facile pour les utilisateurs de lecteurs d'écran ou d'agrandissement d'écran de trouver des éléments particuliers dans la navigation.

Utilisez les menus fournis avec la coquille de manière cohérente sur toutes les pages de votre site. Assurez-vous que les menus apparaissent de façon homogène partout.

En outre, tous les liens, boutons, images ou autres composants utilisés de manière répétée sur votre site doivent être étiquetés de manière cohérente. Par exemple, si un site inclut un lien "Consulter le document ici" sur certaines pages et un lien "Lire le document" sur d'autres pages, cela peut prêter à confusion car les utilisateurs de lecteurs d'écran familiers à un libellé donné peuvent essayer de rechercher sur l'ensemble du site et pourraient ainsi manquer des occurrences si les éléments sont libellés autrement.