Utiliser Axe Expert avec la technologie d'assistance

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Not for use with personal data
warning

L'extension Axe Expert est officiellement retirée. Pour en savoir plus, consultez la page Remplacement Axe Expert . Ces pages seront supprimées en juillet 2024. Envoyez un e-mail à helpdesk@deque.com pour toute question ou préoccupation.

Deque Systems, Inc. considère NVDA/Windows comme la principale plate-forme pour les utilisateurs de lecteurs d'écran de l'extension axe Expert. Nous vous recommandons d'utiliser NVDA ou JAWS sur Windows et VoiceOver sur Mac.

Avant de commencer :

Veuillez consulter axe Expert Extension for Chrome VPAT.pdf pour consulter le rapport de conformité volontaire de l'accessibilité des produits de Deque pour l'extension axe Expert.

Utiliser l'extension Axe Expert pour Google Chrome avec NVDA

Référence des raccourcis clavier de Chrome DevTools :

Avant de commencer : Google a récemment mis à jour le guide d'utilisation des outils de développement du navigateur Chrome et les documents de référence Web. Pour les raccourcis clavier généralement applicables à l'utilisation de l'extension axe Expert dans Google Chrome, consultez Référence des raccourcis clavier - Google Developers Chrome DevTools.

Les instructions suivantes expliquent généralement comment utiliser l'extension axe Expert dans Google Chrome avec les lecteurs d'écran Windows, y compris NVDA. Des instructions sont fournies pour installer, lancer, naviguer dans l'interface utilisateur, ajuster les paramètres, effectuer une analyse d'accessibilité et exporter les résultats. Cette documentation n'inclut pas d'instructions pour travailler avec l'extension axe Expert SimulAT ou la fonctionnalité de script dans NVDA, et les instructions ne contiennent pas le niveau de détail impliqué dans le reste de ce guide de l'utilisateur. La documentation incluse ici sert uniquement de guide de démarrage rapide pour les utilisateurs du logiciel de lecture d'écran NVDA.

Dans cette rubrique :

Installer l'extension Axe Expert

L'installation de l'extension axe Expert dans les DevTools de Google Chrome est légèrement différente de l'installation de l'extension axe Expert de Deque pour Mozilla Firefox, qui a un processus d'installation différent pour les usagers d'axe Monitor (qui utilisent un lien d'installation depuis l'application), que pour les usagers d'axe Expert Extension (qui téléchargent d'abord un fichier .xpi à partir d'un référentiel).

Important

Les instructions suivantes sont fournies uniquement à titre d' exemple pour vous donner une idée du processus d'installation. Les étapes spécifiques du processus peuvent différer en fonction de vos exigences uniques en matière de sécurité et de type/version de navigateur. Par exemple, en fonction de votre organisation, vous devrez peut-être charger une ** extension décompressée** avec le mode développeur activé. Consultez votre direction pour obtenir des instructions d’installation spécifiques. La meilleure pratique recommandée par Deque est que tous les clients travaillent avec leur Deque Engagement Manager ou le service d'assistance Deque pour obtenir la version appropriée et les fichiers d'installation sous licence appropriée.

Depuis la page d'extensions du Chrome Web Store

Le moyen le plus simple d'installer l'extension Expert de axe est via un lien direct vers la page d'extension Google Chrome dans le Chrome Web Store. Si vous avez déjà installé une extension de navigateur Google Chrome, le processus est le même. Cependant, l'extension Expert de axe n'est généralement pas recherchable dans le Chrome Web Store, un lien direct est donc nécessaire :

Lien vers axe Expert dans Chrome Web Store.

Pour obtenir des instructions d'installation complètes à l'aide du lien fourni, reportez-vous à la rubrique Télécharger et installer dans la section Mise en route de ce guide.

À partir d'un lien d'installation

Le fichier d'installation compressé .crx est accessible directement à partir d'un lien dans le menu latéral droit d'axe Monitor, vous permettant de lancer le processus d'installation à partir du navigateur Google Chrome.

Pour installer l'extension axe Expert à partir d'un lien d'installation (axe Monitor) :

  1. Accédez à la section Liens rapides de l’écran d’accueil dans axe Monitor à l’aide du navigateur Chrome.
  2. Sélectionnez Télécharger l'extension axe Expert.

Lorsque vous sélectionnez le lien d'installation de l'extension axe Expert, un message s'affiche vous demandant si vous souhaitez installer l'extension axe Expert.

  1. Appuyez sur la touche Tab et sélectionnez le bouton Charger l'extension non empaquetée... (ou appuyez sur Alt_I).

À partir d'un fichier CRX

L'extension Google Chrome compressée est proposée sous forme de fichier compressé avec l'extension du fichier .crx et offre une clé privée afin que vous n'ayez jamais à vous soucier de la mise à jour manuelle de l'extension, car cela est géré automatiquement.

Pour installer l'extension axe Expert à partir d'un .crx fichier (extension axe Expert) :

  1. Contactez votre responsable d'engagement Deque ou le service d'assistance Deque pour obtenir le programme d'installation du fichier CRX requis.
  2. Accédez au .crx fichier téléchargé sur votre ordinateur.
  3. Appuyez Enter.

Vérifier l'installation

L'installation ne devrait prendre que quelques secondes. Une fois l'installation terminée, un message s'affiche indiquant que l'extension axe Expert a été installée avec succès. Vous pouvez toujours vérifier le succès de l'installation en essayant d'ouvrir l'extension axe Expert dans Google Chrome DevTools. Pour plus d'informations, voir Ouvrir l'extension axe Expert. Les étapes suivantes vous guident tout au long de la vérification de l'installation via la navigation vers l'entrée de l'extension axe Expert sur la page de l'extension Google Chrome.

  1. Dans le champ Adresse (emplacement) de Google Chrome, saisissez chrome://extensions/ et appuyez sur Entrée.

  2. Activez TAB trois fois pour accéder à la liste des extensions Google Chrome installées.

  3. Appuyez sur la touche Down Arrow pour localiser l'élément de liste de l'extension axe Expert.

    Les extensions Google Chrome s'affichent dans l'ordre croissant et selon l'ordre d'installation le plus récent. Elles doivent donc figurer en premier dans la liste.

  4. Écoutez les options « désactiver, supprimer ». Lorsque vous entendez ces options annoncées après axe Expert, l'extension a été installée avec succès.

Ouvrez l'extension axe Expert dans Google Chrome

L'extension Axe Expert est installée dans la barre d'onglets DevTools de Chrome.

  1. Appuyez et maintenez Ctrl+Shift+I pour lancer Chrome DevTools.
  2. Appuyez et maintenez Ctrl\_\] jusqu'à ce que vous entendiez « axe Expert ».

Lors de la première installation et s'il n'existe aucune autre extension intégrée aux outils de développement de Google Chrome, l'onglet Expert d'axe se trouve à l'extrême droite de la barre d'onglets de la boîte à outils.

  1. Appuyez sur Entrée pour activer l’onglet Axe Expert dans la fenêtre DevTools.

L'extension axe Expert est désormais active dans la fenêtre DevTools de Google Chrome et prête à être utilisée.

Comprendre et naviguer dans l'interface utilisateur de l'extension axe Expert

Sélection du panneau du menu principal

Dans le volet gauche d'axe Expert Extension, quel que soit le panneau actuellement sélectionné, vous disposez d'un menu déroulant principal qui fournit des liens vers chacun des cinq panneaux principaux d'axe Expert Extension.

  1. Vérifiez l'activation de l'onglet axe Expert en appuyant sur la touche Tab pour déplacer le focus vers le menu principal, qui se lit comme « Navigation globale ».

    Le cadre est annoncé comme cadre « données/index ».

    Onglet par défaut : le volet Analyser est actif par défaut au lancement de axe Monitor. Utilisez l’onglet Analyser pour effectuer une analyse d’accessibilité ; il s’agit probablement de l’onglet que vous utilisez 99,5 % du temps. Utilisez le menu Axe Expert Extension Options pour sélectionner Settings et Sign in to axe Monitor.

  2. Déplacez le focus vers le menu principal de navigation globale de l'extension Axe Expert et appuyez sur Entrée.

    Le menu principal de l'extension Axe Expert s'ouvre et affiche cinq choix de panneaux :

  3. Appuyez sur les touches down arrow et up arrow pour parcourir les éléments du menu principal de l'extension Axe Expert. Appuyez sur Enter pour sélectionner un élément de menu.

Le menu se ferme, le lecteur d'écran annonce « bouton réduit », suivi du nom de l'élément de menu sélectionné.

Panel-Specific Context Menu (Analyze menu)

Accédez à des contrôles supplémentaires spécifiques au panneau et à des liens vers les panneaux associés et les fonctionnalités relatives sur d'autres panneaux pour le panneau sélectionné via le menu déroulant du bouton à ellipses verticales dans la barre supérieure du volet de contenu de droite dans le panneau Analyser. Ce menu déroulant est parfois appelé de manière informelle « menu à trois points ».

Utilisez le menu contextuel du panneau Analyser :
  • Tab Utilisez le bouton Analyze sur le panneau Analyze pour déplacer le focus vers un menu contextuel qui est annoncé comme le main landmark Analyze google menu button collapsed.
  • Appuyez sur Enter pour afficher les éléments du menu contextuel Analyser.
  • Arrow down ou pour mettre en surbrillance un élément de menu et appuyez sur Enter pour sélectionner l'élément de menu actuellement en surbrillance.

Chaque panneau d'Axe Expert Extension est composé de deux à trois sous-panneaux d'information. Les sous-panneaux contiennent également des sections d’information identifiées par des titres.

Passer d'un panneau à un autre

  • En mode navigation, appuyez sur la flèche vers le haut ou la flèche vers le bas pour sélectionner le panneau que vous souhaitez activer et appuyez sur Entrée.
  • En mode formulaires, accédez au volet actif, puis utilisez les touches fléchées (flèche droite ou flèche gauche) pour passer à d'autres volets (aucune touche Entrée n'est nécessaire).

Après avoir travaillé en mode formulaires, forcez NVDA à revenir en mode navigation en appuyant sur la touche NVDA et la barre d'espace.

Disposition du clavier et mode formulaires

Disposition du clavier NVDA : appuyez sur la touche Échap ou sur la touche NVDA et la barre d'espace pour sortir du mode formulaires dans NVDA. La touche NVDA est la insert touche, sauf si vous la remplacez par Caps Lock, ce que vous pouvez faire dans le menu de configuration NVDA.

Sélectionnez un ensemble de règles

Vous souhaiterez peut-être ajuster l'ensemble de règles dans le panneau Règles. Le panneau Règles contient des cases à cocher avec la légende Ruleset, dans lesquelles trois ensembles de règles peuvent être trouvés. Les règles WCAG 2.0 AA sont actives par défaut. L'utilisation d'un ensemble de règles autre que celui par défaut de WCAG 2.0 AA implique d'effectuer des ajustements facultatifs dans l'onglet Règles.

Vous pouvez effectuer une analyse hors ligne à l'aide de l'un des ensembles de règles standard d'axe Expert Extension sans vous connecter à un serveur axe Monitor, ou vous pouvez utiliser votre propre ensemble de règles personnalisé.

Norme par défaut : si vous utilisez l'extension axe Expert prête à l'emploi, vous effectuerez une analyse WCAG 2.1 AA à l'aide de l'ensemble de règles WCAG 2.1 AA par défaut.

Sélectionnez un ensemble de règles :

  1. Appuyez sur R dans NVDA.

La case à cocher WCAG 2.1 niveau AA est cochée par défaut. Il s'agit d'un ensemble de règles standard fourni avec l'extension axe Expert. L'ensemble de règles par défaut est utilisé jusqu'à ce que vous demandiez à axe Expert Extension d'en utiliser un autre. Vous ne pouvez pas supprimer les ensembles de règles fournis dans le cadre de l'extension axe Expert.

  1. Sélectionnez un ensemble de règles via la case à cocher associée.

Aucune confirmation supplémentaire n'est nécessaire.

Paramètres : connexion au serveur, sélection du projet et portée

La première chose que vous remarquerez dans le panneau Paramètres est un ensemble de champs de formulaire qui vous permettent de connecter l'extension axe Expert à un serveur axe Monitor. Après vous être connecté à axe Monitor, un menu de sélection de projet avec un bouton s'affiche. Deux nouvelles sections s'affichent lorsque vous sélectionnez un projet : Problèmes à télécharger et Portée.

Vous souhaiterez peut-être vous connecter à votre serveur axe Monitor et sélectionner un projet pour activer le téléchargement et le téléversement des résultats d'analyse. Si l'extension axe Expert n'est pas connectée à un serveur axe Monitor, la liste déroulante est annoncée comme « hors ligne, aucun projet » ou « cliquable hors ligne, aucun projet cliquable », et la fonctionnalité de sélection de projet est annoncée comme « indisponible ». Pour plus de détails, voir Sign in to axe Monitor et sélectionner un projet axe Monitor respectivement.

Avant d’utiliser le panneau Analyse pour analyser une page Web, vous souhaiterez peut-être ajuster les options de la section Étendue du panneau Paramètres pour affiner ce qui sera ciblé ou ignoré. Pour plus de détails, voir Définitions de la portée.

Options d'enregistrement d'événements

Le panneau Options d'enregistrement de script accessible via le lien Options du panneau d'onglets Scripts comporte une section appelée Événements à capturer contenant des cases à cocher où vous pouvez configurer les événements à enregistrer ou à ignorer lors de l'enregistrement de scripts. Pour plus d'informations, voir Sélectionner les événements à capturer.

Analyser une page pour détecter les violations des règles d'accessibilité

  1. Ouvrez la page que vous souhaitez tester dans Chrome.

  2. Ouvrez Chrome DevTools (Ctrl_Shift_I) et sélectionnez l’onglet axe Expert.

    Reportez-vous à Open axe Expert Extension pour plus d'informations.

  3. Localisez le bouton ANALYSER ou le lien Exécuter à nouveau si vous réanalysez une page dans le volet Analyser de l'extension Axe Expert (peu importe celui que vous sélectionnez, ils remplissent tous deux la même fonction).

  4. Le bouton Analyser.

L'étiquette du bouton Analyser change pour afficher 'en cours d'analyse' pendant un scan.

Vous savez que l'analyse est terminée lorsque vous pouvez naviguer avec les flèches ou la touche Tabulation pour quitter le bouton Analyser.

Lorsqu'aucune violation d'accessibilité n'est constatée

Si aucune violation d'accessibilité n'est détectée, la ligne après le bouton de téléchargement indique : Félicitations ! Aucune violation d'accessibilité n'a été constatée. Vous devez maintenant effectuer des tests manuels à l’aide de technologies d’assistance telles que NVDA, VoiceOver et JAWS.

Travailler avec les résultats d'analyse

Bouton Exporter et nombre de violations : Si une ou plusieurs erreurs ont été détectées, utilisez la cinquième option de lien, Export, dans le menu du panneau Analyze pour exporter les résultats vers un fichier CSV.

Download et Upload liens : Le Analyze menu du panneau inclut également les options de téléchargement... et de téléversement... Ces éléments sont annoncés comme « désactivés » lorsqu'ils ne sont pas connectés à un serveur axe Monitor. Pour plus d'informations, voir Téléverser les résultats d'analyse et Télécharger un script.

Analysez les résultats de l'Extension axe Expert de deux manières :

  • Exportez les résultats vers un tableur pour une analyse plus approfondie.
  • Examinez les résultats dans le panneau d'Analyse.

Exporter les résultats

Si vous devez travailler avec des résultats d'analyse dans un tableur tel que Microsoft Excel, permettant le tri et d'autres manipulations de données, sélectionnez Export dans le menu Extension Expert axe Analyze pour télécharger un fichier de valeurs séparées par des virgules (CSV). Travailler avec des résultats exportés est particulièrement utile aux utilisateurs de lecteurs d'écran pour faciliter la navigation entre les violations lorsque les résultats incluent plusieurs violations de plusieurs règles.

Exporter les résultats vers un fichier CSV :

  1. Sélectionnez Export dans le menu déroulant spécifique au panneau Analyze .

Une boîte de dialogue typique pour enregistrer un fichier s'affiche.

  1. Sélectionnez un dossier pratique, indiquez un nom descriptif pour le fichier, Save puis sélectionnez.

    Assurez-vous que le dossier souhaité est sélectionné shift+tabbing dans l'arborescence des dossiers la première fois que vous affichez la boîte de dialogue Enregistrer le fichier à l'aide du lien Exporter. L'extension axe Expert enregistre les résultats exportés dans l'emplacement de téléchargement par défaut configuré dans les paramètres de votre navigateur Chrome. Une fois qu'un dossier est sélectionné, axe Expert Extension mémorise votre sélection pour les exportations futures.

Examen des résultats d'analyse dans l'extension axe Expert

Tous les résultats d'analyse d'axe Expert Extension sont affichés sous la rubrique Violations trouvées. Il s'agit généralement du seul titre dans le Analyze panneau, donc l'utilisation de h devrait vous y amener directement.

Examiner les violations des règles :

  • Appuyez deux fois sur la flèche vers le haut pour voir la ligne où le nombre de violations constatées est signalé.

    L'extension axe Expert affiche une liste ordonnée de tests ayant identifié des violations, ainsi que le nombre de violations pour chaque règle. Les noms de règles dans la liste sont des liens qui, une fois affichés, affichent une liste de toutes les violations de cette règle.

    Une liste typique de violations pourrait ressembler à ceci :

Liste de x éléments

  1. Lien : Les éléments doivent avoir un contraste de couleur suffisant (où x est le nombre de violations).
  2. Lien : la valeur de l'attribut ID doit être unique (violations...)

Approfondir les violations individuelles :

  • Sélectionnez le lien de la règle dans la liste.

Lorsqu'un lien de règle est sélectionné, vous verrez un panneau affichant la première violation de la règle.

Présentation du panneau des violations des résultats d'analyse

Cette section décrit les informations séquentielles affichées lorsque vous naviguez vers le bas avec la flèche dans une violation de règle individuelle.

  • Affichage d'une violation individuelle : commencez par la liste des règles qui ont généré des violations (voir la section précédente pour une description et un exemple de ce à quoi ressemble la liste).

  • Navigation et impact des violations multiples

  • Bouton Précédent : À la fin de la liste, vous verrez un bouton nommé 'Précédent'. Le bouton précédent est désactivé lorsque vous visualisez la première violation de règle.

  • # de violations totales : en naviguant vers le bas à partir du bouton Précédent pour voir une ligne indiquant : « violation 1 sur X » où X est le nombre total de violations spécifiques à la règle active.

  • Impact : en naviguant plus loin vers le bas à partir de la ligne # de violations totales affiche les informations d'impact liées à la violation. La ligne d’impact contient le niveau d’impact : mineur, modéré, grave ou critique.

  • Bouton Next  : un bouton suivant s'affiche après les informations d'impact. Le bouton suivant est annoncé comme désactivé si vous examinez la dernière violation d'une règle spécifique.

  • Description : en utilisant la touche flèche vers le bas à partir du bouton suivant, une description sur une ligne de la règle violée ainsi qu'un lien Plus d'informations s'affiche. Par exemple, cette ligne indiquera « Garantit que le contraste entre les couleurs de premier plan et d'arrière-plan respecte les seuils de rapport de contraste WCAG 2 AA » lorsqu'une violation de la règle de contraste des couleurs est enregistrée.

  • More info lien : sélectionnez Plus d'informations pour consulter le contenu de l'Université Deque qui fournit plus de contexte et d'informations générales sur la règle enfreinte en plus des informations détaillées sur la façon de corriger.

  • Applicable Ruleset (Standard) and Success Criteria : Une liste de deux éléments suit le lien Plus d'informations. Le premier élément de la liste répertorie l'ensemble de règles actif utilisé lors de l'analyse de l'extension axe Expert. WCAG 2.0 AA est l'ensemble de règles d'extension axe Expert, noté « wcag2aa ». Le deuxième élément de la liste spécifie le critère de réussite de la règle active (par exemple, wcag143 pour le critère de réussite WCAG 2.0 1.4.3 - contraste des couleurs).

  • Inspect and Highlight links : Le lien Inspecter met en évidence l'élément non conforme dans DevTools. Le deuxième lien, Surligner, met en évidence visuellement l’élément non conforme de la page Web dans la fenêtre principale du navigateur Chrome.

  • Section Navigation : Plusieurs titres h2 supplémentaires représentent des sections de panneau de contenu non conforme :

  • Target : la cible identifie un chemin de sélecteur CSS vers l'élément HTML non conforme.

  • HTML : affiche un extrait de balisage HTML incluant l'élément non conforme.

  • Summary : Le résumé contient une section pour corriger n'importe laquelle des sous-sections suivantes, suivi d'une liste de correctifs suggérés. La présentation et la formulation précises d’une solution suggérée dépendent de la violation spécifique. La liste des correctifs suggérés est une information essentielle dans tout rapport ou analyse, car elle permet généralement d’identifier l’erreur exacte et fournit souvent la solution la plus simple.

Notes de navigation sur les violations multiples

Utilisez les boutons Previous et Next

Utilisez les boutons previous next pour accéder à la violation précédente/suivante si l'analyse a enregistré plusieurs violations de règles. La violation mise à jour x sur y est annoncée automatiquement par la plupart des lecteurs d'écran lors de la sélection des boutons previous ou next . Par exemple, si le panneau affiche actuellement la première violation sur dix et que vous sélectionnez le bouton next , NVDA annonce automatiquement « violation deux sur dix ». Les boutons next et previous constituent le seul moyen de navigation vers une violation de règle particulière.

Accéder à une violation individuelle

Pour atteindre la huitième violation sur dix de la règle x, cliquez sur la règle x, puis next cliquez sept fois.

À propos de la dernière violation

next Cliquer lorsque la dernière violation d'une règle donnée est actuellement affichée n'affiche pas automatiquement la première violation de la règle suivante. En fait, next le bouton est désactivé lorsque la dernière violation de règle s'affiche. Revenez à la liste des règles et sélectionnez la règle suivante à inspecter.

Examinez toutes les violations d’accessibilité pour toutes les règles. Exportez le rapport vers un fichier CSV pour examiner rapidement toutes les violations des règles en un seul endroit.

Utiliser des règles personnalisées

Le Rules panneau est la quatrième sélection dans le menu principal. Si vous avez écrit un fichier JSON de règles personnalisées à analyser par l'extension axe Expert, utilisez le Rules panneau pour ajouter votre ensemble de règles. Une fois ajouté au Rules panneau, vous pouvez sélectionner votre ensemble de règles dans l' Rules onglet. Le Custom Ruleset panneau contient deux champs de formulaire et un bouton : Name for Custom Rules, Enter JSON, et SAVE AND USE RULESET.

Ajouter des règles personnalisées

  1. Spécifiez un nom pour votre ensemble de règles personnalisées dans le champ (Nom pour les règles personnalisées et Entrer JSON).

Assurez-vous que le nom ne contient que des lettres ou des chiffres (aucun espace, tiret ou autre symbole n'est autorisé dans le nom du jeu de règles).

  1. Saisissez ou collez vos JSON règles dans le Enter JSON champ.

  2. Sélectionnez SAVE ET USE RULESET.

Rules Le panneau affiche un message de réussite ou d'erreur si vous avez spécifié un nom non valide ou utilisé un JSON non valide. Vous pouvez voir le nom de votre ensemble de règles dans la section Ensembles de règles personnalisés du menu latéral gauche du volet Règles. Supprimez un ensemble de règles personnalisé en sélectionnant la case à cocher correspondante, puis en sélectionnant Supprimer l'ensemble de règles.

Is this page helpful?

Help us improve this page

Still need help?