|
|
|
# Tanaguru Webextension
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Outil d'évaluation de l'accessibilité Web (et plus).
|
|
|
|
|
|
|
|
## A propos
|
|
|
|
|
|
|
|
* Auteur : Tanaguru
|
|
|
|
* Projet : Tanaguru Webextension (Firefox et Chrome)
|
|
|
|
|
|
|
|
## Sommaire
|
|
|
|
- [A propos](#a-propos)
|
|
|
|
- [Sommaire](#sommaire)
|
|
|
|
- [Installer la webextension sur votre navigateur](#installer-la-webextension-sur-votre-navigateur)
|
|
|
|
- [Utiliser la webextension](#utiliser-la-webextension)
|
|
|
|
|
|
|
|
## Installer la webextension sur votre navigateur
|
|
|
|
La webextension est disponible sur les stores de Mozilla Firefox et Google Chrome.
|
|
|
|
- [webextension Tanaguru pour Firefox](https://addons.mozilla.org/fr/firefox/addon/tanaguru-webext)
|
|
|
|
- [webextension Tanaguru pour Chrome](https://chrome.google.com/webstore/detail/tanaguru-webext/hhopdkekcmkdfpdjbpajmmfbheglcaac)
|
|
|
|
|
|
|
|
## Utiliser la webextension
|
|
|
|
Une fois, l’installation réalisée, un bouton **« Tanaguru »** apparait dans la barre d’outils du navigateur. Ce bouton permet à l’utilisateur via l’affichage d’une fenêtre popup de connaître la version de la webextension, la procédure pour démarrer les tests et l'accès au lien permettant de consulter le site de Tanaguru pour plus d’informations.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Pour démarrer les tests, **rendez-vous sur la page à analyser**.
|
|
|
|
|
|
|
|
Ouvrez l'outil de développement. (raccourci clavier : **ctrl+maj+i**)
|
|
|
|
|
|
|
|
Accès à l'outil de développement sur Firefox : **« Menu > Outils supplémentaires > Outils de développement web»**
|
|
|
|
|
|
|
|
Accès à l'outil de développement sur Chrome : **« Menu > Plus d'outils > Outils de développement»**
|
|
|
|
|
|
|
|
Puis dans l'outil de développement activez l’onglet **« Tanaguru Webext RGAA/WCAG»**.
|
|
|
|
|
|
|
|
|
|
|
|
Nous sommes ici sur la page d'accueil de la webextension, d'ici vous pouvez personnaliser votre analyse puis démarrer l'analyse de la page dans l'onglet actif.
|
|
|
|
Activez le bouton **« Analyser cette page »**, le tableau de bord s'affiche. Selon la « complexité » du DOM de la page à analyser, les premiers résultats peuvent mettre un peu de temps avant de s'afficher.
|
|
|
|
|
|
|
|
Depuis le tableau de bord vous pouvez relancer la même analyse (avec les mêmes filtres activés) ou revenir sur la page d'accueil pour configurer une nouvelle analyse.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Chaque résultat est accompagné de trois boutons :
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
* **« Mettre en évidence sur la page »** permet d’appliquer une présentation particulière afin de faire ressortir visuellement l’élément sur la page ;
|
|
|
|
* **« Révéler dans l'inspecteur »** permet d'identifier et de sélectionner le nœud HTML correspondant dans l’inspecteur de la page ;
|
|
|
|
* **« À propos de cet élément »** permet de consulter et récupérer les différentes informations propres à l'élément (comme par exemple les représentations XPath et CSS). |
|
|
|
\ No newline at end of file |
