Version 2.1 24. septembre 2007 Tutorial des barres d'outils dans Mozilla Firefox Responsable du projet : Auteur : Collaborateurs : Marc Johannot Cide Cyrille Verdon, Pouly Romain
TUTORIIAL Les barres d'outils d accessibilité de Mozilla Firefox : Accessibar Accessibility Toolbar Web Developer Toolbar Les comparaisons des barres d'outils d'accessibilité des navigateurs suivants : Mozilla Firefox Internet explorer Opéra TUTORIAL...2 1. BARRES D ACCESSIBILITÉ FIREFOX...3 1.1. Accessibility Toolbar...3 1.1.1. Navigation... 3 1.1.2. Text Equivalents... 4 1.1.3. Scripting... 5 1.1.4. Style... 5 1.1.5. Validators... 6 1.1.6. Tools... 6 1.1.7. Keyboard... 7 1.1.8. Options... 7 1.1.9. Zoom... 7 2. SUPPORT...8 Page 2 sur 8
1.. Barres d accessiibiilliitté Fiireffox 1.1. Accessibility Toolbar «Accessibility Toolbar» est une version anglaise plus complexe que l Accessibar. On peut facilement télécharger le plugin depuis le site officiel de Mozilla Firefox 1. Il existe une version française de l Accessibility, mais n est valable que sur Firefox 1.5 et antérieur, encore en test. Elle n a que certaines fonctions et ne fonctionnent pas toutes! 2. 1.1.1. Navigation «Title» 3 vous indique les en-têtes (titre, H1) du moins si les en-têtes ont été bien définies. «Headings», une fenêtre avec les titres de la page s ouvre. Elle vous indique les titres (H) et leur niveau. «Menu and Navigation Bars» vous ouvre une fenêtre avec les différents menus (si sélectionné, coloré en jaune) et le descriptif des différents liens. «Image Maps» vous ouvre une fenêtre qui vous montre une liste des menus graphiques et des informations les concernant, ainsi que les liens correspondants. «Links» vous ouvre une fenêtre avec tous les liens de la page. Si sélectionné, le lien se met en jaune. Vous avez la possibilité de naviguer entre ces liens grâce aux boutons. «Forms» vous indique les différents formulaires 4 et les surlignent en jaune. «Data Tables» vous montre la liste des tables de données et des informations les concernant. «Language Changes» regarde la liste des mots dans une langue autre que la globalité du texte et vous dit le texte assié. 1 Voir le lien suivant : http://addons.mozilla.org/fr/firefox/addon/1891. 2 Voir le lien suivant : http://ersplus.free.fr/spip/article.php?id_article=171. 3 Qu est-ce qu un «title»? : http://laurent.petitprez.free.fr/didacticiel.php?l=html-4. 4 Qu est-ce qu un formulaire? : http://www.commentcamarche.net/html/htmlform.php3. Page 3 sur 8
«Frames» 5, dans un site fait en frames, la liste des frames vous mets la zone en jaune quand vous la sélectionnez. «Access Keys» vous donne la liste des touches de raccourci qui ont été programmées par la page. «Show Data Table Headers» met en évidence les en-têtes des tables de données. 1.1.2. Text Equivalents «List of Images» vous donne la liste des images avec leur lien, taille, etc. et les encadrent en jaune. «List of Objects» vous donne les objets dans la page et les encadrent en jaune une fois sélectionné. Les attributs de l objet sont aussi décrits. «List of Abbreviations» vous ouvre une fenêtre ou toutes les abréviations listées sont commentées. «Show Text Equivalents» vous montre le texte équivalent pour toutes les images 6. «Expand Abbreviations» vous montre l équivalent complet de l abréviation ou de l acronyme (si l abréviation à bien été définie). «Hide Images» vous cache les images. «Hide Background Images» vous cache les images de fond. «Hide Objects» vous cache les objets. «Hide All» vous cache tout. 5 Définition du mot «frame» : Une fonctionnalité souvent décriée qui permet d'afficher plusieurs duments HTML dans une même fenêtre. 6 Pourquoi fournir un équivalent aux images? : http://www.culture.gouv.fr/cri/accessibilite/regleun.html. Page 4 sur 8
1.1.3. Scripting «List of Events» vous montre les événements 7 (JavaScript ou CSS) en les colorant en jaune. «Disable Scripting» désactive tout le Java script. «Disable Automatic Refresh» désactive le JavaScript qui réactualise automatiquement la page. «Disable New Windows» désactive le JavaScript qui crée des nouvelles fenêtres depuis cette page. «Disable Mouse Events» désactive les clics de la souris. «Disable Window Events» désactive les événements sur une page (ouverture d'une nouvelle page, redimensionnement, etc.). «Disable Form Events» désactive le JavaScript qui attache un formulaire à la page. 1.1.4. Style «Disable CSS» désactive les CSS. «Disable Tag Styling» désactive les balises de mise en forme. «Disable Table Layout» désactive la disposition en tableau. «High Contrast View 1» vous montre la page en noir avec les textes en blanc (Désactive automatiquement les CSS!). «High Contrast View 2» vous montre la page en blanc avec les textes en noir (Désactive automatiquement les CSS!). «Choose Lal Stylesheet», pour choisir une feuille de style dans vos dossiers. «Enable Lal Stylesheet», pour activer votre propre feuille de style. 7 Qu est-ce qu un événement? : http://www.ping.be/~ping9985/html/jvs_genat.html. Page 5 sur 8
1.1.5. Validators Sous ce menu, vous trouverez différents validateurs, ces outils vont contrôler la validité de vos duments et corriger la syntaxe de votre code si des erreurs sont relevées (traitent le plus fréquemment HTML, CSS, XML et encore les flux RSS 8 ). «W3C 9 HTML Validator» «W3C CSS Validator» «W3CLink Checker» «W3C Tidy» «WDG 10 HTML Validator» «WDG Link Valet» «Results Replace Page», activer cette option permet de remplacer la page actuelle par une nouvelle page contenant les résultats du test de validité. 1.1.6. Tools «FAE 11 Report» lance un rapport d accessibilité. L option de menu d accessibilité doit être permise. «FAE Configuration», options de configuration de FAE. «FAE» ("Functional Accessibility Evaluator") vous permet de tester une de vos pages en entrant l'url de celle-ci. «WebAIM WAVE», comme pour l'option "FAE", WebAIM WAVE permet de tester vos pages. «Cynthia Says» identifie les erreurs reconnues par le standard «section 508» 12 et permet de choisir le degré de priorité de la norme WCAG (1,2 ou 3). «WebXact» permet de tester la qualité et l'accessibilité de vos pages. «TAW» permet de tester vos pages. Analyse se base sur les règles du W3C et WCAG. 8 Qu'est-ce que le RSS? : http://fr.wikipedia.org/wiki/rss_%28format%29. 9 Voir site officiel du W3C : http://www.w3.org/. 10 Voir site officiel du WDG : http://htmlhelp.com/tools/validator/. 11 Voir le site officiel du FAE : http://fae.cita.uiuc.edu/. 12 Qu'est-ce que la section 508? : http://fr.wikipedia.org/wiki/section_508. Page 6 sur 8
1.1.7. Keyboard «Enable Deyboard Enhancements» permet les perfectionnements du clavier. «Keyboard Shortcut Options», introduire au clavier les options de raccourci. «Keyboard Enhancement Options», introduire au clavier les options de perfectionnement. «Disable Access Keys» désactive les raccourcis claviers. 1.1.8. Options «Commands and styling Chages affect current page», les changements de styles et de commandes changent que pour la page actuelle. «Commands and styling changes affect all pages», les changements de styles et de commandes changent sur toutes les pages. «Reset styling and settings», mise a zéro des changements. «Show Accessibility Menu» affiche dans la barre des tâches l'onglet "Accessibility". «Help» vous ouvre la page d aide de l Accessibility en anglais. «About» vous indique son créateur, sa version,... «Check for Updates» cherche les dernières mise à jour. «Report a Bug» rapporte un bug. 1.1.9. Zoom «Zoom in et Zoom Out» vous permet non seulement d agrandir le texte d une page mais aussi les images. Ne fonctionne pas sur les objets. Page 7 sur 8
2.. Supportt Mise à disposition de contact dans un cas critique suivant: Assistance : besoin d'aide, problème, etc. Améliorations : idées intéressantes, remarques pertinentes, etc. Adresse de messagerie : accessibilité-wiki.dsi@vd.ch Page 8 sur 8