{ "key": "rgaa", "name": "RGAA", "fullName": "Référentiel général d’amélioration de l’accessibilité", "org": "DINUM", "country": "FR", "baseVersion": "4.1.2", "wcagVersion": "2.1", "locales": ["fr"], "defaultLocale": "fr", "license": "Licence Ouverte / Etalab 2.0", "source": "https://github.com/DISIC/accessibilite.numerique.gouv.fr", "attribution": "RGAA 4.1.2 © DINUM (Direction interministérielle du numérique) — Licence Ouverte / Etalab 2.0", "idPattern": "^\\d+\\.\\d+$", "criterionUrl": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#{id}", "vocabulary": { "theme": { "fr": "Thématique" }, "criterion": { "fr": "Critère" }, "test": { "fr": "Test" }, "conformant": { "fr": "Conforme (C)" }, "nonConformant": { "fr": "Non conforme (NC)" }, "notApplicable": { "fr": "Non applicable (NA)" }, "auditorHeading": { "fr": "Critère d’accessibilité" } }, "sampleMethodology": { "requiredKinds": [ { "id": "accueil", "label": { "fr": "Page d’accueil" }, "keywords": ["accueil", "home", "index", "racine", "homepage"] }, { "id": "contact", "label": { "fr": "Contact" }, "keywords": ["contact", "nous contacter", "nous ecrire", "coordonnees"] }, { "id": "mentions-legales", "label": { "fr": "Mentions légales" }, "keywords": ["mentions legales", "mentions", "legal notice", "legal"] }, { "id": "declaration-accessibilite", "label": { "fr": "Déclaration d’accessibilité" }, "keywords": ["declaration d accessibilite", "declaration accessibilite", "accessibilite", "accessibility statement", "accessibility"] }, { "id": "plan-du-site", "label": { "fr": "Plan du site" }, "keywords": ["plan du site", "sitemap", "site map"] }, { "id": "aide", "label": { "fr": "Aide" }, "keywords": ["aide", "help", "faq", "assistance"] }, { "id": "authentification", "label": { "fr": "Authentification" }, "keywords": ["authentification", "authentication", "connexion", "identification", "login", "log in", "sign in", "se connecter", "auth"] }, { "id": "pages-representatives", "label": { "fr": "Pages représentatives" }, "keywords": ["representative", "representatif", "representatives", "gabarit", "template", "modele", "formulaire", "recherche", "resultats"] }, { "id": "elements-transverses", "label": { "fr": "Éléments transverses" }, "keywords": ["transverse", "transversaux", "en-tete", "entete", "header", "navigation", "menu", "pied de page", "footer"] } ] }, "secondaryMappings": [ { "ruleId": "dyn-live-region", "criterion": "7.4", "note": { "fr": "Relève aussi de 7.4 (changement de contexte) selon le classement Ara ; projection WCAG-fidèle = 7.5.", "en": "Also classified under 7.4 (change of context) per Ara; the WCAG-faithful projection is 7.5." }, "enabled": false } ], "rules": [ { "id": "download-link-format", "criterion": "6.1", "wcag": ["2.4.4"], "severity": "mineur", "advisory": true, "match": { "tag": "a", "attrs": [ { "name": "href", "op": "matches", "value": "\\.(pdf|docx?|pptx?|xlsx?|odt|ods|odp|rtf|csv|zip|rar|7z|gz|epub|mp3|mp4|avi|mov)(\\?|#|$)" } ], "text": { "op": "lacks", "value": "(pdf|docx?|pptx?|xlsx?|odt|ods|odp|rtf|csv|zip|rar|7z|gz|epub|mp3|mp4|avi|mov|\\d+\\s*(ko|mo|go|kb|mb|gb|octets?|bytes?))" } }, "message": { "en": "Download link whose visible text states neither the file format nor its size.", "fr": "Lien de téléchargement dont l’intitulé ne précise ni le format ni le poids du fichier." }, "remediation": { "en": "State the file format and size in the link text, e.g. “Annual report (PDF, 2 MB)”.", "fr": "Indiquez le format et le poids du fichier dans l’intitulé du lien, par exemple « Rapport annuel (PDF, 2 Mo) »." } }, { "id": "optgroup-without-label", "criterion": "11.8", "wcag": ["1.3.1"], "severity": "majeur", "match": { "tag": "optgroup", "attrs": [ { "name": "label", "op": "absent" } ] }, "message": { "en": " without a label attribute — the group of options is unnamed (RGAA test 11.8.2).", "fr": " sans attribut label — le regroupement d’options n’est pas nommé (test RGAA 11.8.2)." }, "remediation": { "en": "Add label=\"…\" naming what the options in this group have in common, e.g. .", "fr": "Ajoutez label=\"…\" nommant ce que les options du groupe ont en commun, par ex. ." } }, { "id": "dir-value-invalid", "criterion": "8.10", "wcag": ["1.3.2"], "severity": "majeur", "match": { "attrs": [ { "name": "dir", "op": "present" }, { "name": "dir", "op": "matches", "value": "^(?!(rtl|ltr)$).+$" } ] }, "message": { "en": "dir attribute with a value other than rtl or ltr — the reading direction change fails RGAA test 8.10.2.", "fr": "Attribut dir dont la valeur n’est ni rtl ni ltr — le changement de sens de lecture échoue au test RGAA 8.10.2." }, "remediation": { "en": "Use dir=\"rtl\" or dir=\"ltr\", matching the reading direction of the text it carries.", "fr": "Utilisez dir=\"rtl\" ou dir=\"ltr\", en accord avec le sens de lecture du texte porté." } }, { "id": "doctype-missing", "criterion": "8.1", "wcag": ["4.1.1"], "severity": "majeur", "doc": { "signal": "doctype", "op": "absent" }, "message": { "en": "The captured page declares no document type — the browser parsed no ahead of (RGAA test 8.1.1).", "fr": "La page capturée ne déclare aucun type de document — le navigateur n’a analysé aucun avant (test RGAA 8.1.1)." }, "remediation": { "en": "Emit as the first line of the document, before . A doctype placed after , or malformed, is ignored by the parser and counts as absent.", "fr": "Émettez en première ligne du document, avant . Un doctype placé après , ou malformé, est ignoré par l’analyseur et compte comme absent." } } ], "overrides": { "presentational-element": { "advisory": false, "severity": "majeur" }, "presentational-attribute": { "advisory": false, "severity": "majeur" }, "presentational-spacing": { "advisory": false, "severity": "majeur" } }, "themes": [ { "number": 1, "name": { "fr": "Images" }, "count": 9 }, { "number": 2, "name": { "fr": "Cadres" }, "count": 2 }, { "number": 3, "name": { "fr": "Couleurs" }, "count": 3 }, { "number": 4, "name": { "fr": "Multimédia" }, "count": 13 }, { "number": 5, "name": { "fr": "Tableaux" }, "count": 8 }, { "number": 6, "name": { "fr": "Liens" }, "count": 2 }, { "number": 7, "name": { "fr": "Scripts" }, "count": 5 }, { "number": 8, "name": { "fr": "Éléments obligatoires" }, "count": 10 }, { "number": 9, "name": { "fr": "Structuration de l’information" }, "count": 4 }, { "number": 10, "name": { "fr": "Présentation de l’information" }, "count": 14 }, { "number": 11, "name": { "fr": "Formulaires" }, "count": 13 }, { "number": 12, "name": { "fr": "Navigation" }, "count": 11 }, { "number": 13, "name": { "fr": "Consultation" }, "count": 12 } ], "criteria": [ { "id": "1.1", "theme": 1, "title": { "fr": "Chaque [image porteuse d’information](#image-porteuse-d-information) a-t-elle une [alternative textuelle](#alternative-textuelle-image) ?" }, "titlePlain": { "fr": "Chaque image porteuse d’information a-t-elle une alternative textuelle ?" }, "tests": { "1": [ "Chaque image (balise `` ou balise possédant l’attribut WAI-ARIA `role=\"img\"`) [porteuse d’information](#image-porteuse-d-information) a-t-elle une [alternative textuelle](#alternative-textuelle-image) ?" ], "2": [ "Chaque [zone](#zone-d-une-image-reactive) d’une [image réactive](#image-reactive) (balise ``) [porteuse d’information](#image-porteuse-d-information) a-t-elle une [alternative textuelle](#alternative-textuelle-image) ?" ], "3": [ "Chaque bouton de type `image` (balise `` avec l’attribut `type=\"image\"`) a-t-il une [alternative textuelle](#alternative-textuelle-image) ?" ], "4": [ "Chaque [zone cliquable](#zone-cliquable) d’une image réactive côté serveur est-elle doublée d’un mécanisme utilisable quel que soit le dispositif de pointage utilisé et permettant d’accéder à la même destination ?" ], "5": [ "Chaque image vectorielle (balise ``) [porteuse d’information](#image-porteuse-d-information), vérifie-t-elle ces conditions ?", "La balise `` possède un attribut WAI-ARIA `role=\"img\"` ;", "La balise `` a une [alternative textuelle](#alternative-textuelle-image)." ], "6": [ "Chaque [image objet](#image-objet) (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), vérifie-t-elle une de ces conditions ?", "La balise `` possède une [alternative textuelle](#alternative-textuelle-image) et un attribut `role=\"img\"` ;", "L’élément `` est immédiatement suivi d’un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à un [contenu alternatif](#contenu-alternatif) ;", "Un mécanisme permet à l’utilisateur de remplacer l’élément `` par un [contenu alternatif](#contenu-alternatif)." ], "7": [ "Chaque image embarquée (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), vérifie-t-elle une de ces conditions ?", "La balise `` possède une [alternative textuelle](#alternative-textuelle-image) et un attribut `role=\"img\"` ;", "L’élément `` est immédiatement suivi d’un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à un [contenu alternatif](#contenu-alternatif) ;", "Un mécanisme permet à l’utilisateur de remplacer l’élément `` par un [contenu alternatif](#contenu-alternatif)." ], "8": [ "Chaque image bitmap (balise ``) [porteuse d’information](#image-porteuse-d-information), vérifie-t-elle une de ces conditions ?", "La balise `` possède une [alternative textuelle](#alternative-textuelle-image) et un attribut `role=\"img\"` ;", "Un [contenu alternatif](#contenu-alternatif) est présent entre les balises `` et `` ;", "L’élément `` est immédiatement suivi d’un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à un [contenu alternatif](#contenu-alternatif) ;", "Un mécanisme permet à l’utilisateur de remplacer l’élément `` par un [contenu alternatif](#contenu-alternatif)." ] }, "methodology": { "1": "1. Retrouver dans le document les images structurées au moyen d’un élément `` ou d’un élément possédant l’attribut WAI-ARIA `role=\"img\"` ;\n2. Pour chaque image, déterminer si l’image est porteuse d’information ;\n3. Dans le cas où il s’agit d’un élément ``, vérifier que l’image est pourvue au moins d’une alternative textuelle parmi les suivantes :\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label` ;\n - Contenu de l’attribut `alt` ;\n - Contenu de l’attribut `title`.\n4. Dans le cas où il s’agit d’un élément possédant l’attribut WAI-ARIA `role=\"img\"`, vérifier que l’image est pourvue au moins d’une alternative textuelle parmi les suivantes :\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label`.\n5. Si au moins une alternative textuelle est trouvée, **le test est validé**.", "2": "1. Retrouver dans le document les éléments `` ;\n2. Pour chaque élément ``, déterminer si la zone réactive est porteuse d’information ;\n3. Vérifier que la zone réactive est pourvue au moins d’une alternative textuelle parmi les suivantes :\n - Contenu de l’attribut WAI-ARIA `aria-label` ;\n - Contenu de l’attribut `alt` ;\n4. Si au moins une alternative textuelle est trouvée, **le test est validé**.", "3": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image\"` ;\n2. Pour chaque élément `` pourvu de l’attribut type=\"image\", déterminer si l’image utilisée est porteuse d’information ;\n3. Vérifier que l’élément `` est pourvu au moins d’une alternative textuelle parmi les suivantes :\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label` ;\n - Contenu de l’attribut `alt` ;\n - Contenu de l’attribut `title`.\n4. Si au moins une alternative textuelle est trouvée, **le test est validé**.", "4": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `ismap` ;\n2. Pour chaque élément `` pourvu de l’attribut `ismap`, vérifier la présence d’un lien ou d’un ensemble de liens (ou bien d’un autre type de composant d’interface qui jouerait un rôle similaire comme une liste de sélection, par exemple) permettant d’accéder aux mêmes ressources que lorsque l’image fait l’objet d’un clic.\n3. Si c’est le cas, **le test est validé**.", "5": "1. Retrouver dans le document les éléments `` ;\n2. Pour chaque élément ``, déterminer si l’image est porteuse d’information ;\n3. S’assurer que l’élément `` est pourvu d’un attribut WAI-ARIA `role=\"img\"` ;\n4. Si ce n’est pas le cas, le test est invalidé.\n5. Le cas échéant, vérifier que l’élément `` est pourvu au moins d’une alternative textuelle parmi les suivantes :\n - Contenu de l’élément `` ;\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label` ;\n6. Si au moins une alternative textuelle est trouvée, **le test est validé**.", "6": "1. Retrouver dans le document les balises ouvrantes `` pourvues de l'attribut `type=\"image/…\"` ;\n2. Pour chaque balise ouvrante `` pourvue de l'attribut `type=\"image/…\"`, déterminer si l’image utilisée est porteuse d'information ;\n3. Vérifier que l’élément `` est pourvu d’un attribut WAI-ARIA `role=\"img\"` ;\n4. Vérifier que l’élément `` est pourvu au moins d’une alternative textuelle parmi les suivantes :\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label` ;\n - Contenu de l’attribut `title`.\n5. Si au moins une alternative textuelle est trouvée, **le test est validé** ;\n6. Sinon, vérifier que l'élément `` est :\n - Soit immédiatement suivi d'un lien ou bouton adjacent permettant d'accéder à un contenu alternatif ;\n - Soit un mécanisme permet à l'utilisateur de remplacer l'élément `` par un contenu alternatif.\n7. Si c'est le cas, **le test est validé**.", "7": "1. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, déterminer si l’image utilisée est porteuse d’information ;\n2. Vérifier que l’élément `` est pourvu d’un attribut WAI-ARIA `role=\"img\"` ;\n3. Vérifier que l’élément `` est pourvu au moins d’une alternative textuelle parmi les suivantes :\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label` ;\n - Contenu de l’attribut `title`.\n4. Si au moins une alternative textuelle est trouvée, **le test est validé** ;\n5. Sinon, vérifier que l’élément `` est :\n - Soit immédiatement suivi d’un lien ou bouton adjacent permettant d’accéder à un contenu alternatif ;\n - Soit un mécanisme permet à l’utilisateur de remplacer l’élément `` par un contenu alternatif.\n6. Si c’est le cas, **le test est validé**.", "8": "1. Retrouver dans le document les éléments `` ;\n2. Pour chaque élément ``, déterminer si l’image utilisée est porteuse d’information ;\n3. Vérifier que l’élément `` est pourvu d’un attribut WAI-ARIA `role=\"img\"` ;\n4. Vérifier que la balise ouvrante `` est pourvue au moins d’une alternative textuelle parmi les suivantes :\n - Passage de texte associé via l’attribut WAI-ARIA `aria-labelledby` ;\n - Contenu de l’attribut WAI-ARIA `aria-label`.\n5. Si au moins une alternative textuelle est trouvée, **le test est validé**.\n6. Si les étapes 3 et 4 ne sont pas satisfaites, vérifier que l’élément `` est :\n - Soit pourvu d’un contenu alternatif présent entre les balises `` et `` ;\n - Soit immédiatement suivi d’un lien ou bouton adjacent permettant d’accéder à un contenu alternatif ;\n - Soit un mécanisme permet à l’utilisateur de remplacer l’élément `` par un contenu alternatif.\n7. Si c’est le cas, **le test est validé**.\n\nNote : si l'élément `` dispose d'un rôle `img`, son alternative ne peut être fournie que par les techniques listées à l'étape 4." }, "techniques": ["H36", "H37", "H53", "F65", "H24"], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [ "axe:area-alt", "axe:image-alt", "axe:input-image-alt", "axe:object-alt", "axe:role-img-alt", "axe:svg-img-alt", "canvas-fallback-missing", "chart-no-accessible-name", "img-alt-missing", "input-image-alt-missing", "object-embed-no-name" ] }, "automation": { "tests": { "1": "judgment", "2": "rendered", "3": "static", "4": "judgment", "5": "judgment", "6": "judgment", "7": "judgment", "8": "judgment" }, "rules": [ { "id": "axe:area-alt", "tests": ["2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:image-alt", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:input-image-alt", "tests": ["3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:object-alt", "tests": ["6"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:role-img-alt", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:svg-img-alt", "tests": ["5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "canvas-fallback-missing", "tests": ["8"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "chart-no-accessible-name", "tests": ["1", "5", "8"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "img-alt-missing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "input-image-alt-missing", "tests": ["3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "object-embed-no-name", "tests": ["6", "7"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "1.2", "theme": 1, "title": { "fr": "Chaque [image de décoration](#image-de-decoration) est-elle correctement ignorée par les technologies d’assistance ?" }, "titlePlain": { "fr": "Chaque image de décoration est-elle correctement ignorée par les technologies d’assistance ?" }, "tests": { "1": [ "Chaque image (balise ``) [de décoration](#image-de-decoration), sans [légende](#legende-d-image), vérifie-t-elle une de ces conditions ?", "La balise `` possède un attribut `alt` vide (`alt=\"\"`) et est dépourvue de tout autre attribut permettant de fournir une [alternative textuelle](#alternative-textuelle-image) ;", "La balise `` possède un attribut WAI-ARIA `aria-hidden=\"true\"` ou `role=\"presentation\"`." ], "2": [ "Chaque [zone non cliquable](#zone-non-cliquable) (balise `` sans attribut `href`) [de décoration](#image-de-decoration), vérifie-t-elle une de ces conditions ?", "La balise `` possède un attribut `alt` vide (`alt=\"\"`) et est dépourvue de tout autre attribut permettant de fournir une [alternative textuelle](#alternative-textuelle-image) ;", "La balise `` possède un attribut WAI-ARIA `aria-hidden=\"true\"` ou `role=\"presentation\"`." ], "3": [ "Chaque [image objet](#image-objet) (balise `` avec l’attribut `type=\"image/…\"`) [de décoration](#image-de-decoration), sans [légende](#legende-d-image), vérifie-t-elle ces conditions ?", "La balise `` possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;", "La balise `` est dépourvue d’alternative textuelle ;", "Il n’y a aucun texte faisant office d’alternative textuelle entre `` et ``." ], "4": [ "Chaque image vectorielle (balise ``) [de décoration](#image-de-decoration), sans [légende](#legende-d-image), vérifie-t-elle ces conditions ?", "La balise `` possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;", "La balise `` et ses enfants sont dépourvus d’[alternative textuelle](#alternative-textuelle-image) ;", "Les balises `` et `` sont absentes ou vides ;", "La balise `` et ses enfants sont dépourvus d’attribut `title`." ], "5": [ "Chaque image bitmap (balise ``) [de décoration](#image-de-decoration), sans [légende](#legende-d-image), vérifie-t-elle ces conditions ?", "La balise `` possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;", "La balise `` et ses enfants sont dépourvus d’[alternative textuelle](#alternative-textuelle-image) ;", "Il n’y a aucun texte faisant office d’[alternative textuelle](#alternative-textuelle-image) entre `` et ``." ], "6": [ "Chaque image embarquée (balise `` avec l’attribut `type=\"image/…\"`) [de décoration](#image-de-decoration), sans [légende](#legende-d-image), vérifie-t-elle ces conditions ?", "La balise `` possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;", "La balise `` et ses enfants sont dépourvus d’[alternative textuelle](#alternative-textuelle-image)." ] }, "methodology": { "1": "1. Retrouver dans le document les images décoratives dépourvues de légende structurées au moyen d’un élément `` ;\n2. Pour chaque image, vérifier que l’image ne possède pas d’attributs `aria-labelledby`, `aria-label` ou `title` et qu’elle possède :\n - Soit un attribut `alt` vide (`alt=\"\"`) ;\n - Soit un attribut WAI-ARIA `aria-hidden=\"true\"` ou `role=\"presentation\"`.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les images décoratives structurées au moyen d’un élément `` (sans attribut `href`) ;\n2. Pour chaque image, vérifier que l’élément `` ne possède pas d’attributs `aria-labelledby`, `aria-label` ou `title` et qu’il possède :\n - Soit un attribut `alt` vide (`alt=\"\"`) ;\n - Soit un attribut WAI-ARIA `aria-hidden=\"true\"` ou `role=\"presentation\"`.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "3": "1. Retrouver dans le document les images décoratives structurées dépourvues de légende au moyen d’un élément `` (avec un attribut `type=\"image/…\"`) ;\n2. Pour chaque image, vérifier que la balise ouvrante `` ne possède pas d’attributs `aria-labelledby`, `aria-label` ou `title` et qu’elle :\n - Possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;\n - Et est dépourvue d’alternative textuelle ;\n - Et est dépourvue d’un contenu alternatif présent entre les balises `` et ``.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "4": "1. Retrouver dans le document les images décoratives dépourvues de légende structurées au moyen d’un élément `` ;\n2. Pour chaque image, vérifier que l’élément `` ne possède pas d’attributs `aria-labelledby` ou `aria-label` et qu’il :\n - Possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;\n - Et est dépourvu d’alternative textuelle (ainsi que ses éléments enfants) ;\n - Et ne contient pas d’éléments `` et `` à moins que vides de contenu ;\n - Et est dépourvu d’attribut `title` (ainsi que ses éléments enfants).\n3. Si c’est le cas pour chaque image, **le test est validé**.", "5": "1. Retrouver dans le document les images décoratives dépourvues de légende structurées au moyen d’un élément `` ;\n2. Pour chaque image, vérifier que l’élément `` ne possède pas d’attributs `aria-labelledby`, `aria-label` ou `title` et qu’il :\n - Possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;\n - Et est dépourvu d’alternative textuelle ;\n - Et est dépourvu d’un contenu alternatif présent entre les balises `` et ``.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "6": "1. Retrouver dans le document les images décoratives dépourvues de légende structurées au moyen d’un élément `` (avec un attribut `type=\"image/…\"`) ;\n2. Pour chaque image, vérifier que l’élément `` ne possède pas d’attributs `aria-labelledby`, `aria-label` ou `title` et qu’il :\n - Possède un attribut WAI-ARIA `aria-hidden=\"true\"` ;\n - Et est dépourvu d’alternative textuelle ;\n3. Si c’est le cas pour chaque image, **le test est validé**." }, "techniques": ["H67", "G196", "C9", "F39", "F38", "ARIA4", "ARIA10"], "technicalNote": [ "Lorsqu'une image est associée à une [légende](#legende-d-image), la note technique WCAG recommande de prévoir systématiquement une [alternative textuelle](#alternative-textuelle-image) (cf. critère 1.9). Dans ce cas le critère 1.2 est non applicable.", "Dans le cas d'une image vectorielle (balise ``) de décoration qui serait affichée au travers d'un élément `` enfant de l'élément ``, le test 1.2.4 s'appliquera également à l'élément `` associée par le biais de l'élément ``.", "Un attribut WAI-ARIA `role=\"presentation\"` peut être utilisé sur les images de décoration et les zones non cliquables de décoration. Le rôle `\"none\"` introduit en ARIA 1.1 et synonyme du rôle `\"presentation\"` peut être aussi utilisé. Il reste préférable cependant d'utiliser le rôle `\"presentation\"` en attendant un support satisfaisant du rôle `\"none\"`." ], "wcag": ["1.1.1", "4.1.2"], "appliesTo": { "ruleIds": ["axe:image-redundant-alt", "decorative-alt-misuse", "decorative-marked-exposed"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment" }, "rules": [ { "id": "axe:image-redundant-alt", "tests": ["1", "2", "3", "4", "5", "6"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "decorative-alt-misuse", "tests": ["1", "2", "3", "4", "5", "6"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "decorative-marked-exposed", "tests": ["1", "2", "3", "4", "5", "6"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "1.3", "theme": 1, "title": { "fr": "Pour chaque image [porteuse d’information](#image-porteuse-d-information) ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente (hors cas particuliers) ?" }, "titlePlain": { "fr": "Pour chaque image porteuse d’information ayant une alternative textuelle, cette alternative est-elle pertinente (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque image (balise `` ou balise possédant l’attribut WAI-ARIA `role=\"img\"`) [porteuse d’information](#image-porteuse-d-information), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "2": [ "Pour chaque [zone](#zone-d-une-image-reactive) (balise ``) d’une [image réactive](#image-reactive) [porteuse d’information](#image-porteuse-d-information), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "3": [ "Pour chaque [bouton](#bouton-formulaire) de type `image` (balise `` avec l’attribut `type=\"image\"`), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "4": [ "Pour chaque [image objet](#image-objet) (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), ayant une [alternative textuelle](#alternative-textuelle-image) ou un [contenu alternatif](#contenu-alternatif), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent le [contenu alternatif](#contenu-alternatif) est pertinent." ], "5": [ "Pour chaque image embarquée (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), ayant une [alternative textuelle](#alternative-textuelle-image) ou un [contenu alternatif](#contenu-alternatif), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent le [contenu alternatif](#contenu-alternatif) est pertinent." ], "6": [ "Pour chaque image vectorielle (balise ``) [porteuse d’information](#image-porteuse-d-information), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l'élément `` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "7": [ "Pour chaque image bitmap (balise ``) [porteuse d’information](#image-porteuse-d-information), ayant une [alternative textuelle](#alternative-textuelle-image) ou un [contenu alternatif](#contenu-alternatif), cette alternative est-elle pertinente (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent le [contenu alternatif](#contenu-alternatif) est pertinent." ], "8": [ "Pour chaque image bitmap (balise ``) [porteuse d’information](#image-porteuse-d-information) et ayant un [contenu alternatif](#contenu-alternatif) entre `` et ``, ce [contenu alternatif](#contenu-alternatif) est-il [correctement restitué par les technologies d’assistance](#correctement-restitue-par-les-technologies-d-assistance) ?" ], "9": [ "Pour chaque image [porteuse d’information](#image-porteuse-d-information) et ayant une [alternative textuelle](#alternative-textuelle-image), l’[alternative textuelle](#alternative-textuelle-image) est-elle [courte et concise](#alternative-courte-et-concise) (hors cas particuliers) ?" ] }, "methodology": { "1": "1. Retrouver dans le document les images structurées au moyen d’un élément `` (ou d’un élément possédant l’attribut WAI-ARIA `role=\"img\"`) pourvues d’une alternative textuelle ;\n2. Pour chaque image, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les éléments `` pourvus d’une alternative textuelle ;\n2. Pour chaque élément ``, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "3": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image\"` et d’une alternative textuelle ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image\"`, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "4": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image/…\"` et d’une alternative textuelle ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "5": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image/…\"` et d’une alternative textuelle ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "6": "1. Retrouver dans le document les éléments `` pourvus d’une alternative textuelle ;\n2. Pour chaque élément ``, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "7": "1. Retrouver dans le document les éléments `` pourvus d’une alternative textuelle ;\n2. Pour chaque élément ``, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "8": "1. Retrouver dans le document les éléments `` pourvus d’un contenu alternatif entre les balises `` et `` ;\n2. Pour chaque élément ``, vérifier que le contenu alternatif est correctement restitué par les technologies d’assistance ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "9": "1. Retrouver dans le document les images pourvues d’une alternative textuelle ;\n2. Pour chaque image, vérifier l’alternative textuelle est courte et concise ;\n3. Si c’est le cas pour chaque image, **le test est validé**." }, "techniques": ["G94", "G95", "F30", "F71", "G196", "ARIA6", "ARIA9", "ARIA10"], "particularCases": [ "Il existe une gestion de cas particuliers lorsque l’image est utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test). Dans cette situation, où il n’est pas possible de donner une alternative pertinente sans détruire l’objet du CAPTCHA ou du test, le critère est non applicable.", "Note : le cas des CAPTCHA et des images-test est traité de manière spécifique par le critère 1.4." ], "wcag": ["1.1.1", "4.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment", "7": "judgment", "8": "judgment", "9": "judgment" }, "rules": [] } }, { "id": "1.4", "theme": 1, "title": { "fr": "Pour chaque image utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative permet-elle d’identifier la nature et la fonction de l’image ?" }, "titlePlain": { "fr": "Pour chaque image utilisée comme CAPTCHA ou comme image-test, ayant une alternative textuelle, cette alternative permet-elle d’identifier la nature et la fonction de l’image ?" }, "tests": { "1": [ "Pour chaque image (balise ``) utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "2": [ "Pour chaque zone (balise ``) d’une image réactive utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "3": [ "Pour chaque [bouton](#bouton-formulaire) de type image (balise `` avec l’attribut `type=\"image\"`) utilisé comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "4": [ "Pour chaque [image objet](#image-objet) (balise `` avec l’attribut `type=\"image/…\"`) utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image) ou un [contenu alternatif](#contenu-alternatif), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent le [contenu alternatif](#contenu-alternatif) est pertinent." ], "5": [ "Pour chaque image embarquée (balise `` avec l’attribut `type=\"image/…\"`) utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image) ou un [contenu alternatif](#contenu-alternatif), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent le [contenu alternatif](#contenu-alternatif) est pertinent." ], "6": [ "Pour chaque image vectorielle (balise ``) utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent." ], "7": [ "Pour chaque image bitmap (balise ``) utilisée comme [CAPTCHA](#captcha) ou comme [image-test](#image-test), ayant une [alternative textuelle](#alternative-textuelle-image) ou un [contenu alternatif](#contenu-alternatif), cette alternative est-elle pertinente ?", "S’il est présent, le contenu de l’attribut `alt` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent ;", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent le [contenu alternatif](#contenu-alternatif) est pertinent." ] }, "methodology": { "1": "1. Retrouver dans le document les images structurées au moyen d’un élément `` pourvues d’une alternative textuelle et utilisées comme CAPTCHA ou comme image-test ;\n2. Pour chaque image, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les éléments `` pourvus d’une alternative textuelle et utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque élément ``, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "3": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image\"` et d’une alternative textuelle, et utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image\"`, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "4": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image/…\"` et d’une alternative textuelle, et utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "5": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image/…\"` et d’une alternative textuelle, et utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "6": "1. Retrouver dans le document les éléments `` pourvus d’une alternative textuelle et utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque élément ``, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "7": "1. Retrouver dans le document les éléments `` pourvus d’une alternative textuelle et utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque élément ``, vérifier que l’alternative textuelle est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**." }, "techniques": ["G100", "G143"], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment", "7": "judgment" }, "rules": [] } }, { "id": "1.5", "theme": 1, "title": { "fr": "Pour chaque image utilisée comme [CAPTCHA](#captcha), une solution d’accès alternatif au contenu ou à la fonction du CAPTCHA est-elle présente ?" }, "titlePlain": { "fr": "Pour chaque image utilisée comme CAPTCHA, une solution d’accès alternatif au contenu ou à la fonction du CAPTCHA est-elle présente ?" }, "tests": { "1": [ "Chaque image (balises ``, ``, ``, ``, ``, `` ou possédant un attribut WAI-ARIA `role=\"img\"`) utilisée comme [CAPTCHA](#captcha) vérifie-t-elle une de ces conditions ?", "Il existe une autre forme de [CAPTCHA](#captcha) non graphique, au moins ;", "Il existe une autre solution d’accès à la fonctionnalité qui est sécurisée par le [CAPTCHA](#captcha)." ], "2": [ "Chaque bouton associé à une image (balise `input` avec l’attribut `type=\"image\"`) utilisée comme [CAPTCHA](#captcha) vérifie-t-il une de ces conditions ?", "Il existe une autre forme de [CAPTCHA](#captcha) non graphique, au moins ;", "Il existe une autre solution d’accès à la fonctionnalité sécurisée par le [CAPTCHA](#captcha)." ] }, "methodology": { "1": "1. Retrouver dans le document les images (éléments ``, ``, ``, ``, ``, `` ou possédant un attribut WAI-ARIA `role=\"img\"`) utilisés comme CAPTCHA ou comme image-test ;\n2. Pour chaque image, vérifier qu’il existe :\n - Soit une autre forme de CAPTCHA non graphique, au moins ;\n - Soit une autre solution d’accès à la fonctionnalité qui est sécurisée par le CAPTCHA.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les boutons associés à une image (éléments ``) [porteuse d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-elle une de ces conditions ?", "Il existe un attribut `longdesc` qui donne l’adresse (URL) d’une page ou d’un emplacement dans la page contenant la [description détaillée](#description-detaillee-image) ;", "Il existe une [alternative textuelle](#alternative-textuelle-image) contenant la référence à une [description détaillée](#description-detaillee-image) adjacente à l’image ;", "Il existe un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ], "2": [ "Chaque [image objet](#image-objet) (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-elle une de ces conditions ?", "Il existe un attribut `longdesc` qui donne l’adresse (URL) d’une page ou d’un emplacement dans la page contenant la [description détaillée](#description-detaillee-image) ;", "Il existe une [alternative textuelle](#alternative-textuelle-image) contenant la référence à une [description détaillée](#description-detaillee-image) adjacente à l’image ;", "Il existe un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ], "3": [ "Chaque image embarquée (balise ``) [porteuse d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-elle une de ces conditions ?", "Il existe un attribut `longdesc` qui donne l’adresse (URL) d’une page ou d’un emplacement dans la page contenant la [description détaillée](#description-detaillee-image) ;", "Il existe une [alternative textuelle](#alternative-textuelle-image) contenant la référence à une [description détaillée](#description-detaillee-image) adjacente à l’image ;", "Il existe un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ], "4": [ "Chaque [bouton](#bouton-formulaire) de type image (balise `` avec l’attribut `type=\"image\"`) [porteur d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-il une de ces conditions ?", "Il existe un attribut `longdesc` qui donne l’adresse (URL) d’une page ou d’un emplacement dans la page contenant la [description détaillée](#description-detaillee-image) ;", "Il existe une [alternative textuelle](#alternative-textuelle-image) contenant la référence à une [description détaillée](#description-detaillee-image) adjacente à l’image ;", "Il existe un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ], "5": [ "Chaque image vectorielle (balise ``) [porteuse d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-elle une de ces conditions ?", "Il existe un attribut WAI-ARIA `aria-label` contenant l’alternative textuelle et une référence à une [description détaillée](#description-detaillee-image) adjacente ;", "Il existe un attribut WAI-ARIA `aria-labelledby` associant un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) faisant office d’alternative textuelle et un autre faisant office de [description détaillée](#description-detaillee-image) ;", "Il existe un attribut WAI-ARIA `aria-describedby` associant un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) faisant office de [description détaillée](#description-detaillee-image) ;", "Il existe un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ], "6": [ "Pour chaque image vectorielle (balise ``) [porteuse d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), la référence éventuelle à la [description détaillée](#description-detaillee-image) dans l’attribut WAI-ARIA `aria-label` et la [description détaillée](#description-detaillee-image) associée par l’attribut WAI-ARIA `aria-labelledby` ou `aria-describedby` sont-elles correctement restituées par les technologies d’assistance ?" ], "7": [ "Chaque image bitmap (balise ``), [porteuse d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-elle une de ces conditions ?", "Il existe un attribut WAI-ARIA `aria-label` contenant l’alternative textuelle et une référence à une [description détaillée](#description-detaillee-image) adjacente ;", "Il existe un attribut WAI-ARIA `aria-labelledby` associant un passage de texte faisant office d’alternative textuelle et un autre faisant office de [description détaillée](#description-detaillee-image) ;", "Il existe un contenu textuel entre `` et `` faisant référence à une [description détaillée](#description-detaillee-image) adjacente à l’image bitmap ;", "Il existe un contenu textuel entre `` et `` faisant office de [description détaillée](#description-detaillee-image) ;", "Il existe un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ], "8": [ "Pour chaque image bitmap (balise ``) [porteuse d’information](#image-porteuse-d-information), qui implémente une référence à une [description détaillée](#description-detaillee-image) adjacente, cette référence est-elle correctement restituée par les technologies d’assistance ?" ], "9": [ "Pour chaque image (balise ``, `` avec l’attribut `type=\"image\"`, ``, ``, ``, ``, ``, ou possédant un attribut WAI-ARIA `role=\"img\"`) [porteuse d’information](#image-porteuse-d-information), qui est accompagnée d’une [description détaillée](#description-detaillee-image) et qui utilise un attribut WAI-ARIA `aria-describedby`, l’attribut WAI-ARIA `aria-describedby` associe-t-il la [description détaillée](#description-detaillee-image) ?" ], "10": [ "Chaque balise possédant un attribut WAI-ARIA `role=\"img\"` [porteuse d’information](#image-porteuse-d-information), qui nécessite une [description détaillée](#description-detaillee-image), vérifie-t-elle une de ces conditions ?", "Il existe un attribut WAI-ARIA `aria-label` contenant l’[alternative textuelle](#alternative-textuelle-image) et une référence à une [description détaillée](#description-detaillee-image) adjacente ;", "Il existe un attribut WAI-ARIA `aria-labelledby` associant un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) faisant office d’[alternative textuelle](#alternative-textuelle-image) et un autre faisant office de [description détaillée](#description-detaillee-image) ;", "Il existe un attribut WAI-ARIA `aria-describedby` associant un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) faisant office de [description détaillée](#description-detaillee-image) ;", "Il existe un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) permettant d’accéder à la [description détaillée](#description-detaillee-image)." ] }, "methodology": { "1": "1. Retrouver dans le document les images structurées au moyen d’un élément `` (ou d’un élément possédant l’attribut WAI-ARIA `role=\"img\"`) porteuses d’information qui nécessitent une description détaillée ;\n2. Pour chaque image, vérifier qu’il existe :\n - Soit un attribut longdesc qui donne l’adresse (url) d’une page ou d’un emplacement dans la page contenant la description détaillée ;\n - Soit une alternative textuelle contenant la référence à une description détaillée adjacente à l’image ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image/…\"`, porteurs d’information qui nécessitent une description détaillée ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, vérifier qu’il existe :\n - Soit une alternative textuelle contenant la référence à une description détaillée adjacente à l’image ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée.\n3. Si c’est le cas pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, **le test est validé**.", "3": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image/…\"`, porteurs d’information qui nécessitent une description détaillée ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, vérifier qu’il existe :\n - Soit une alternative textuelle contenant la référence à une description détaillée adjacente à l’image ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée.\n3. Si c’est le cas pour chaque élément `` pourvu de l’attribut `type=\"image/…\"`, **le test est validé**.", "4": "1. Retrouver dans le document les éléments `` pourvus de l’attribut `type=\"image\"`, porteurs d’information qui nécessitent une description détaillée ;\n2. Pour chaque élément `` pourvu de l’attribut `type=\"image\"`, vérifier qu’il existe :\n - Soit une alternative textuelle contenant la référence à une description détaillée adjacente à l’image ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée ;\n - Soit un attribut WAI-ARIA aria-describedby associant un passage de texte faisant office de description détaillée.\n3. Si c’est le cas pour chaque élément `` pourvu de l’attribut `type=\"image\"`, **le test est validé**.", "5": "1. Retrouver dans le document les éléments `` porteurs d’information qui nécessitent une description détaillée ;\n2. Pour chaque élément ``, vérifier qu’il existe :\n - Soit un attribut WAI-ARIA `aria-label` contenant l’alternative textuelle et une référence à une description détaillée adjacente ;\n - Soit un attribut WAI-ARIA `aria-labelledby` associant un passage de texte faisant office d’alternative textuelle et un autre faisant office de description détaillée ;\n - Soit un attribut WAI-ARIA `aria-describedby` associant un passage de texte faisant office de description détaillée ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée.\n3. Si c’est le cas pour chaque élément ``, **le test est validé**.", "6": "1. Retrouver dans le document les éléments `` porteurs d’information dont la description détaillée est fournie au moyen d’un attribut `aria-label`, `aria-labelledby` ou `aria-describedby` ;\n2. Pour chaque élément ``, vérifier que le contenu de la description détaillée est correctement restitué par les technologies d’assistance ;\n3. Si c’est le cas pour chaque élément ``, **le test est validé**.", "7": "1. Retrouver dans le document les éléments `` porteurs d’information qui nécessitent une description détaillée ;\n2. Pour chaque élément ``, vérifier qu’il existe :\n - Soit un attribut WAI-ARIA aria-label contenant l’alternative textuelle et une référence à une description détaillée adjacente ;\n - Soit un attribut WAI-ARIA aria-labelledby associant un passage de texte faisant office d’alternative textuelle et un autre faisant office de description détaillée ;\n - Soit un contenu textuel entre `` et `` faisant référence à une description détaillée adjacente à l’image bitmap ;\n - Soit un contenu textuel entre `` et `` faisant office de description détaillée ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée.\n3. Si c’est le cas pour chaque élément ``, **le test est validé**.", "8": "1. Retrouver dans le document les éléments `` porteurs d’information dont la description détaillée est fournie au moyen d’un attribut `aria-label`, `aria-labelledby` ou `aria-describedby` ;\n2. Pour chaque élément ``, vérifier que le contenu de la description détaillée est correctement restitué par les technologies d’assistance ;\n3. Si c’est le cas pour chaque élément ``, **le test est validé**.", "9": "1. Retrouver dans le document les images (éléments ``, `` avec l’attribut `type=\"image\"`, ``, ``, ``, ``, `` ou possédant un attribut WAI-ARIA `role=\"img\"`) porteuses d’information dont la description détaillée utilise un attribut WAI-ARIA `aria-describedby` ;\n2. Pour chaque image, vérifier que le contenu de la description détaillée est correctement restitué par les technologies d’assistance ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "10": "1. Retrouver dans le document les éléments pourvus d’un attribut WAI-ARIA `role=\"img\"` porteurs d’information qui nécessitent une description détaillée ;\n2. Pour chaque élément `role=\"img\"`, vérifier qu’il existe :\n - Soit un attribut WAI-ARIA `aria-label` contenant l’alternative textuelle et une référence à une description détaillée adjacente ;\n - Soit un attribut WAI-ARIA `aria-labelledby` associant un passage de texte faisant office d’alternative textuelle et un autre faisant office de description détaillée ;\n - Soit un attribut WAI-ARIA `aria-describedby` associant un passage de texte faisant office de description détaillée ;\n - Soit un lien ou un bouton adjacent permettant d’accéder à la description détaillée.\n3. Si c’est le cas pour chaque élément `role=\"img\"`, **le test est validé**." }, "techniques": ["G92", "G74", "G73", "H45", "ARIA6"], "technicalNote": [ "Dans le cas du SVG, le manque de support de l’élément `` et `` par les technologies d’assistance crée une difficulté dans le cas de l’implémentation de l’[alternative textuelle](#alternative-textuelle-image) de l’image et de sa [description détaillée](#description-detaillee-image). Dans ce cas, il est recommandé d’utiliser l’attribut WAI-ARIA `aria-label` pour implémenter à la fois l’[alternative textuelle](#alternative-textuelle-image) courte et la référence à la [description détaillée](#description-detaillee-image) adjacente ou l’attribut WAI-ARIA `aria-labelledby` pour associer les passages de texte faisant office d’alternative courte et de [description détaillée](#description-detaillee-image).", "L’utilisation de l’attribut WAI-ARIA aria-describedby n’est pas recommandée pour lier une image (``, ``, ``, ``) à sa [description détaillée](#description-detaillee-image), par manque de support des technologies d’assistance. Néanmoins, lorsqu’il est utilisé, l’attribut devra nécessairement faire référence à l’`id` de la zone contenant la [description détaillée](#description-detaillee-image).", "La [description détaillée](#description-detaillee-image) adjacente peut être implémentée via une balise `
`, dans ce cas le critère 1.9 doit être vérifié (utilisation de `
` et des attributs WAI-ARIA `role=\"figure\"` et `aria-label`, notamment).", "L'attribut `longdesc` qui constitue une des conditions du test 1.6.1 (et dont la pertinence est vérifiée avec le test 1.7.1) est désormais considéré comme obsolète par la spécification HTML en cours. La vérification de cet attribut ne sera donc requise que pour les versions de la spécification HTML antérieure à HTML 5." ], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment", "7": "judgment", "8": "judgment", "9": "judgment", "10": "judgment" }, "rules": [] } }, { "id": "1.7", "theme": 1, "title": { "fr": "Pour chaque image [porteuse d’information](#image-porteuse-d-information) ayant une [description détaillée](#description-detaillee-image), cette description est-elle pertinente ?" }, "titlePlain": { "fr": "Pour chaque image porteuse d’information ayant une description détaillée, cette description est-elle pertinente ?" }, "tests": { "1": [ "Chaque image (balise ``) [porteuse d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), vérifie-t-elle ces conditions ?", "La [description détaillée](#description-detaillee-image) via l’adresse référencée dans l’attribut `longdesc` est pertinente ;", "La [description détaillée](#description-detaillee-image) dans la page et signalée par l’[alternative textuelle](#alternative-textuelle-image) est pertinente ;", "La [description détaillée](#description-detaillee-image) via un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) est pertinente ;", "Le passage de texte associé via l’attribut WAI-ARIA `aria-describedby` est pertinent." ], "2": [ "Chaque [bouton](#bouton-formulaire) de type image (balise `` avec l’attribut `type=\"image\"`) [porteur d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), vérifie-t-il ces conditions ?", "La [description détaillée](#description-detaillee-image) dans la page et signalée par l’[alternative textuelle](#alternative-textuelle-image) est pertinente ;", "La [description détaillée](#description-detaillee-image) via un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) est pertinente ;", "Le passage de texte associé via l’attribut WAI-ARIA `aria-describedby` est pertinent." ], "3": [ "Chaque [image objet](#image-objet) (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), vérifie-t-elle ces conditions ?", "La [description détaillée](#description-detaillee-image) dans la page et signalée par l’[alternative textuelle](#alternative-textuelle-image) est pertinente ;", "La [description détaillée](#description-detaillee-image) adjacente à l’[image objet](#image-objet) est pertinente ;", "La [description détaillée](#description-detaillee-image) via un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) est pertinente ;", "Le passage de texte associé via l’attribut WAI-ARIA `aria-describedby` est pertinent." ], "4": [ "Chaque image embarquée (balise `` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), vérifie-t-elle ces conditions ?", "La [description détaillée](#description-detaillee-image) dans la page et signalée par l’[alternative textuelle](#alternative-textuelle-image) est pertinente ;", "La [description détaillée](#description-detaillee-image) adjacente à l’image embarquée est pertinente ;", "La [description détaillée](#description-detaillee-image) via un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) est pertinente ;", "Le passage de texte associé via l’attribut WAI-ARIA `aria-describedby` est pertinent." ], "5": [ "Chaque image vectorielle (balise ``) [porteuse d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), vérifie-t-elle ces conditions ?", "La [description détaillée](#description-detaillee-image) dans la page et signalée par l’[alternative textuelle](#alternative-textuelle-image) est pertinente ;", "La [description détaillée](#description-detaillee-image) dans la page et signalée par le texte contenu dans la balise `` ou `` est pertinente ;", "La [description détaillée](#description-detaillee-image) adjacente contenue dans la balise `<desc>` est pertinente ;", "La [description détaillée](#description-detaillee-image) via un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) est pertinente ;", "Le passage de texte associé via l’attribut WAI-ARIA `aria-describedby` est pertinent." ], "6": [ "Chaque image bitmap (balise `<canvas>`) [porteuse d’information](#image-porteuse-d-information), ayant une [description détaillée](#description-detaillee-image), vérifie-t-elle ces conditions ?", "La [description détaillée](#description-detaillee-image) dans la page et signalée par l’[alternative textuelle](#alternative-textuelle-image) est pertinente ;", "La [description détaillée](#description-detaillee-image) dans la page et signalée par le texte contenu entre `<canvas>` et `</canvas>` est pertinente ;", "La [description détaillée](#description-detaillee-image) contenue entre `<canvas>` et `</canvas>` est pertinente ;", "La [description détaillée](#description-detaillee-image) adjacente à l’image bitmap est pertinente ;", "La [description détaillée](#description-detaillee-image) via un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent) est pertinente ;", "Le passage de texte associé via l’attribut WAI-ARIA `aria-describedby` est pertinent." ] }, "methodology": { "1": "1. Retrouver dans le document les images structurées au moyen d’un élément `<img>` qui possèdent une description détaillée ;\n2. Pour chaque image, vérifier que la description détaillée est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les éléments `<input>` pourvus de l’attribut `type=\"image\"` qui possèdent une description détaillée ;\n2. Pour chaque élément `<input>` pourvu de l’attribut `type=\"image\"`, vérifier que la description détaillée est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "3": "1. Retrouver dans le document les éléments `<object>` pourvus de l’attribut `type=\"image/…\"` qui possèdent une description détaillée ;\n2. Pour chaque élément `<object>` pourvu de l’attribut `type=\"image/…\"`, vérifier que la description détaillée est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "4": "1. Retrouver dans le document les éléments `<embed>` pourvus de l’attribut `type=\"image/…\"` qui possèdent une description détaillée ;\n2. Pour chaque élément `<embed>` pourvu de l’attribut `type=\"image/…\"`, vérifier que la description détaillée est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "5": "1. Retrouver dans le document les éléments `<svg>` qui possèdent une description détaillée ;\n2. Pour chaque élément `<svg>`, vérifier que la description détaillée est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**.", "6": "1. Retrouver dans le document les éléments `<canvas>` qui possèdent une description détaillée ;\n2. Pour chaque élément `<canvas>`, vérifier que la description détaillée est pertinente ;\n3. Si c’est le cas pour chaque image, **le test est validé**." }, "techniques": ["G92", "F67"], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment" }, "rules": [] } }, { "id": "1.8", "theme": 1, "title": { "fr": "Chaque [image texte](#image-texte) [porteuse d’information](#image-porteuse-d-information), en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacée par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque image texte porteuse d’information, en l’absence d’un mécanisme de remplacement, doit si possible être remplacée par du texte stylé. Cette règle est-elle respectée (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [image texte](#image-texte) (balise `<img>` ou possédant un attribut WAI-ARIA `role=\"img\"`) [porteuse d’information](#image-porteuse-d-information), en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacée par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" ], "2": [ "Chaque bouton « [image texte](#image-texte) » (balise `<input>` avec l’attribut `type=\"image\"`) [porteur d’information](#image-porteuse-d-information), en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacé par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" ], "3": [ "Chaque [image texte](#image-texte) objet (balise `<object>` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacée par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" ], "4": [ "Chaque [image texte](#image-texte) embarquée (balise `<embed>` avec l’attribut `type=\"image/…\"`) [porteuse d’information](#image-porteuse-d-information), en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacée par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" ], "5": [ "Chaque [image texte](#image-texte) bitmap (balise `<canvas>`) [porteuse d’information](#image-porteuse-d-information), en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacée par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" ], "6": [ "Chaque [image texte](#image-texte) SVG (balise `<svg>`) [porteuse d’information](#image-porteuse-d-information) et dont le texte n’est pas complètement structuré au moyen d’éléments `<text>`, en l’absence d’un [mécanisme de remplacement](#mecanisme-de-remplacement), doit si possible être remplacée par du [texte stylé](#texte-style). Cette règle est-elle respectée (hors cas particuliers) ?" ] }, "methodology": { "1": "1. Retrouver dans le document les images texte structurées au moyen d’un élément `<img>` (ou d’un élément possédant l’attribut WAI-ARIA `role=\"img\"`) ;\n2. Pour chaque image, vérifier que :\n - Soit il existe un mécanisme de remplacement ;\n - Soit l’image contient un texte qui fait appel à un effet graphique qui ne peut pas être reproduit en CSS.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les boutons “images texte” (élément `<input>` avec l’attribut `type=\"image\"`) ;\n2. Pour chaque image, vérifier que :\n - Soit il existe un mécanisme de remplacement ;\n - Soit l’image contient un texte qui fait appel à un effet graphique qui ne peut pas être reproduit en CSS.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "3": "1. Retrouver dans le document les images texte objet (élément `<object>` avec l’attribut `type=\"image/…\"`) ;\n2. Pour chaque image, vérifier que :\n - Soit il existe un mécanisme de remplacement ;\n - Soit l’image contient un texte qui fait appel à un effet graphique qui ne peut pas être reproduit en CSS.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "4": "1. Retrouver dans le document les images texte embarquées (élément `<embed>` avec l’attribut `type=\"image/…\"`) ;\n2. Pour chaque image, vérifier que :\n - Soit il existe un mécanisme de remplacement ;\n - Soit l’image contient un texte qui fait appel à un effet graphique qui ne peut pas être reproduit en CSS.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "5": "1. Retrouver dans le document les images texte bitmap (élément `<canvas>`) ;\n2. Pour chaque image, vérifier que :\n - Soit il existe un mécanisme de remplacement ;\n - Soit l’image contient un texte qui fait appel à un effet graphique qui ne peut pas être reproduit en CSS.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "6": "1. Retrouver dans le document les images texte vectorielle (élément `<svg>`) porteuse d’information et dont le texte n’est pas complètement structuré au moyen d’éléments `<text>` ;\n2. Pour chaque image, vérifier que :\n - Soit il existe un mécanisme de remplacement ;\n - Soit l’image contient un texte qui fait appel à un effet graphique qui ne peut pas être reproduit en CSS.\n3. Si c’est le cas pour chaque image, **le test est validé**." }, "techniques": ["G136", "G140", "C22", "C30"], "technicalNote": ["Le texte dans les images vectorielles étant du texte réel, il n’est pas concerné par ce critère."], "particularCases": [ "Pour ce critère, il existe une gestion de cas particulier lorsque le texte fait partie du logo, d’une dénomination commerciale, d’un [CAPTCHA](#captcha), d’une [image-test](#image-test) ou d’une image dont l’exactitude graphique serait considérée comme essentielle à la bonne transmission de l’information véhiculée par l’image. Dans ces situations, le critère est non applicable pour ces éléments." ], "wcag": ["1.4.5"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment" }, "rules": [] } }, { "id": "1.9", "theme": 1, "title": { "fr": "Chaque [légende d’image](#legende-d-image) est-elle, si nécessaire, correctement reliée à l’image correspondante ?" }, "titlePlain": { "fr": "Chaque légende d’image est-elle, si nécessaire, correctement reliée à l’image correspondante ?" }, "tests": { "1": [ "Chaque image pourvue d’une [légende](#legende-d-image) (balise `<img>`, `<input>` avec l’attribut `type=\"image\"` ou possédant un attribut WAI-ARIA `role=\"img\"` associée à une [légende](#legende-d-image) adjacente), vérifie-t-elle, si nécessaire, ces conditions ?", "L’image (balise `<img>`, `<input>` avec l’attribut `type=\"image\"` ou possédant un attribut WAI-ARIA `role=\"img\"`) et sa [légende](#legende-d-image) adjacente sont contenues dans une balise `<figure>` ;", "La balise `<figure>` possède un attribut WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;", "La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la [légende](#legende-d-image) ;", "La [légende](#legende-d-image) est contenue dans une balise `<figcaption>`." ], "2": [ "Chaque [image objet](#image-objet) pourvue d’une [légende](#legende-d-image) (balise `<object>` avec l’attribut `type=\"image/…\"` associée à une [légende](#legende-d-image) adjacente), vérifie-t-elle, si nécessaire, ces conditions ?", "L’[image objet](#image-objet) et sa [légende](#legende-d-image) adjacente sont contenues dans une balise `<figure>` ;", "La balise `<figure>` possède un attribut WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;", "La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la [légende](#legende-d-image) ;", "La [légende](#legende-d-image) est contenue dans une balise `<figcaption>`." ], "3": [ "Chaque image embarquée pourvue d’une [légende](#legende-d-image) (balise `<embed>` associée à une [légende](#legende-d-image) adjacente), vérifie-t-elle, si nécessaire, ces conditions ?", "L’image embarquée (balise `<embed>`) et sa [légende](#legende-d-image) adjacente sont contenues dans une balise `<figure>` ;", "La balise `<figure>` possède un attribut WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;", "La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la [légende](#legende-d-image) ;", "La [légende](#legende-d-image) est contenue dans une balise `<figcaption>`." ], "4": [ "Chaque image vectorielle pourvue d’une [légende](#legende-d-image) (balise `<svg>` associée à une [légende](#legende-d-image) adjacente), vérifie-t-elle, si nécessaire, ces conditions ?", "L’image vectorielle (balise `<svg>`) et sa [légende](#legende-d-image) adjacente sont contenues dans une balise `<figure>` ;", "La balise `<figure>` possède un attribut WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;", "La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la [légende](#legende-d-image) ;", "La [légende](#legende-d-image) est contenue dans une balise `<figcaption>`." ], "5": [ "Chaque image bitmap pourvue d’une [légende](#legende-d-image) (balise `<canvas>` associée à une [légende](#legende-d-image) adjacente), vérifie-t-elle, si nécessaire, ces conditions ?", "L’image bitmap (balise `<canvas>`) et sa [légende](#legende-d-image) adjacente sont contenues dans une balise `<figure>` ;", "La balise `<figure>` possède un attribut WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;", "La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la [légende](#legende-d-image) ;", "La [légende](#legende-d-image) est contenue dans une balise `<figcaption>`." ] }, "methodology": { "1": "1. Retrouver dans le document les images pourvues d’une légende structurées au moyen d’élément `<img>`, d’un élément `<input>` avec l’attribut `type=\"image\"` ou d’un élément possédant l’attribut WAI-ARIA `role=\"img\"` ;\n2. Pour chaque image, vérifier que :\n - L’image et sa légende sont contenues dans une balise `<figure>` ;\n - La balise `<figure>` possède une propriété WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;\n - La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la légende ;\n - La légende est contenue dans une balise `<figcaption>`.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "2": "1. Retrouver dans le document les images objet pourvues d’une légende (élément `<object>` avec l’attribut `type=\"image/…\"`) ;\n2. Pour chaque image, vérifier que :\n - L’image et sa légende sont contenues dans une balise `<figure>` ;\n - La balise `<figure>` possède une propriété WAI-ARIA `role=\"figure`\" ou `role=\"group\"` ;\n - La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la légende ;\n - La légende est contenue dans une balise `<figcaption>`.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "3": "1. Retrouver dans le document les images embarquées pourvues d’une légende (élément `<embed>` avec l’attribut `type=\"image/…\"`) ;\n2. Pour chaque image, vérifier que :\n - L’image et sa légende sont contenues dans une balise `<figure>` ;\n - La balise `<figure>` possède une propriété WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;\n - La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la légende ;\n - La légende est contenue dans une balise `<figcaption>`.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "4": "1. Retrouver dans le document les images vectorielles pourvues d’une légende (élément `<svg>`) ;\n2. Pour chaque image, vérifier que :\n - L’image et sa légende sont contenues dans une balise `<figure>` ;\n - La balise `<figure>` possède une propriété WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;\n - La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la légende ;\n - La légende est contenue dans une balise `<figcaption>`.\n3. Si c’est le cas pour chaque image, **le test est validé**.", "5": "1. Retrouver dans le document les images bitmap (élément `<canvas>`) ;\n2. Pour chaque image, vérifier que :\n - L’image et sa légende sont contenues dans une balise `<figure>` ;\n - La balise `<figure>` possède une propriété WAI-ARIA `role=\"figure\"` ou `role=\"group\"` ;\n - La balise `<figure>` possède un attribut WAI-ARIA `aria-label` dont le contenu est identique au contenu de la légende ;\n - La légende est contenue dans une balise `<figcaption>`.\n3. Si c’est le cas pour chaque image, **le test est validé**." }, "techniques": ["G140", "ARIA4", "ARIA6"], "technicalNote": [ "L’implémentation d’un attribut WAI-ARIA `role=\"group\"` ou `role=\"figure\"` sur l’élément parent `<figure>` est destiné à pallier le manque de support actuel des éléments `<figure>` par les technologies d’assistance. L’utilisation d’un élément `<figcaption>` pour associer une [légende](#legende-d-image) à une image impose au minimum l’utilisation d’un attribut WAI-ARIA `aria-label` sur l’élément parent `<figure>` dont le contenu sera identique au contenu de l’élément `<figcaption>`. Pour s’assurer d’un support optimal, il peut également être fait une association explicite entre le contenu de l’[alternative textuelle](#alternative-textuelle-image) de l’image et le contenu de l’élément `<figcaption>`, par exemple :", "`<img src=\"image.png\" alt=\"Photo : soleil couchant\" /><figcaption>Photo : crédit xxx</figcaption>`", "Les attributs WAI-ARIA `aria-labelledby` et `aria-describedby` ne peuvent pas être utilisés actuellement par manque de support par les technologies d’assistance.", "Note : les images légendées doivent par ailleurs respecter le critère 1.1 et le critère 1.3 relatifs aux images porteuses d’information." ], "wcag": ["1.1.1", "4.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment" }, "rules": [] } }, { "id": "2.1", "theme": 2, "title": { "fr": "Chaque [cadre](#cadre) a-t-il un [titre de cadre](#titre-de-cadre) ?" }, "titlePlain": { "fr": "Chaque cadre a-t-il un titre de cadre ?" }, "tests": { "1": ["Chaque cadre (balise `<iframe>` ou `<frame>`) a-t-il un attribut `title` ?"] }, "methodology": { "1": "1. Retrouver dans le document les cadres (élément `<iframe>` ou `<frame>`) ;\n2. Pour chaque cadre, vérifier qu’il possède un attribut `title `;\n3. Si c’est le cas pour chaque cadre, **le test est validé**." }, "techniques": ["H64"], "wcag": ["4.1.2"], "appliesTo": { "ruleIds": ["axe:frame-title", "axe:frame-title-unique", "iframe-title-missing"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:frame-title", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:frame-title-unique", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "iframe-title-missing", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "2.2", "theme": 2, "title": { "fr": "Pour chaque [cadre](#cadre) ayant un [titre de cadre](#titre-de-cadre), ce titre de cadre est-il pertinent ?" }, "titlePlain": { "fr": "Pour chaque cadre ayant un titre de cadre, ce titre de cadre est-il pertinent ?" }, "tests": { "1": ["Pour chaque cadre (balise `<iframe>` ou `<frame>`) ayant un attribut `title`, le contenu de cet attribut est-il pertinent ?"] }, "methodology": { "1": "1. Retrouver dans le document les cadres (élément `<iframe>` ou `<frame>`) ;\n2. Pour chaque cadre pourvu d’un attribut `title`, vérifier que son contenu est pertinent ;\n3. Si c’est le cas pour chaque cadre, **le test est validé**." }, "techniques": ["H64"], "wcag": ["4.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "3.1", "theme": 3, "title": { "fr": "Dans chaque page web, l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" }, "titlePlain": { "fr": "Dans chaque page web, l’information ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" }, "tests": { "1": [ "Pour chaque mot ou ensemble de mots dont la mise en couleur est porteuse d’information, l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" ], "2": [ "Pour chaque indication de couleur donnée par un texte, l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" ], "3": [ "Pour chaque image [véhiculant une information](#image-vehiculant-une-information-donnee-par-la-couleur), l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" ], "4": [ "Pour chaque [propriété CSS déterminant une couleur](#propriete-css-determinant-une-couleur) et [véhiculant une information](#image-vehiculant-une-information-donnee-par-la-couleur), l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" ], "5": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) [véhiculant une information](#image-vehiculant-une-information-donnee-par-la-couleur), l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" ], "6": [ "Pour chaque [média non temporel](#media-non-temporel) [véhiculant une information](#image-vehiculant-une-information-donnee-par-la-couleur), l’[information](#information-donnee-par-la-couleur) ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?" ] }, "methodology": { "1": "1. Retrouver dans le document les informations données par la couleur dans un mot ou un ensemble de mots ;\n2. Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "2": "1. Retrouver dans le document les informations données par la couleur dans un texte ;\n2. Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "3": "1. Retrouver dans le document les informations données par la couleur dans une image ;\n2. Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "4": "1. Retrouver dans le document les informations données par la couleur dans une propriété CSS ;\n2. Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "5": "1. Retrouver dans le document les informations données par la couleur dans un média temporel ;\n2. Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "6": "1. Retrouver dans le document les informations données par la couleur dans un média non temporel ;\n2. Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;\n3. Si c’est le cas pour chaque information, **le test est validé**." }, "techniques": ["G14", "G182", "G111", "G117", "G138", "G205"], "wcag": ["1.3.1", "1.4.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment" }, "rules": [] } }, { "id": "3.2", "theme": 3, "title": { "fr": "Dans chaque page web, le [contraste](#contraste) entre la couleur du texte et la couleur de son arrière-plan est-il suffisamment élevé (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, le contraste entre la couleur du texte et la couleur de son arrière-plan est-il suffisamment élevé (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, le texte et le texte en image sans effet de graisse d’une taille restituée inférieure à 24px vérifient-ils une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) entre le texte et son arrière-plan est de 4.5:1, au moins ;", "Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de [contraste](#contraste) de 4.5:1, au moins." ], "2": [ "Dans chaque page web, le texte et le texte en image en gras d’une taille restituée inférieure à 18,5px vérifient-ils une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) entre le texte et son arrière-plan est de 4.5:1, au moins ;", "Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de [contraste](#contraste) de 4.5:1, au moins." ], "3": [ "Dans chaque page web, le texte et le texte en image sans effet de graisse d’une taille restituée supérieure ou égale à 24px vérifient-ils une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) entre le texte et son arrière-plan est de 3:1, au moins ;", "Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de [contraste](#contraste) de 3:1, au moins." ], "4": [ "Dans chaque page web, le texte et le texte en image en gras d’une taille restituée supérieure ou égale à 18,5px vérifient-ils une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) entre le texte et son arrière-plan est de 3:1, au moins ;", "Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de [contraste](#contraste) de 3:1, au moins." ], "5": [ "Dans le [mécanisme qui permet d’afficher un rapport de contraste](#mecanisme-qui-permet-d-afficher-un-rapport-de-contraste-conforme) conforme, le rapport de contraste entre le texte et la couleur d’arrière-plan est-il suffisamment élevé ?" ] }, "methodology": { "1": "1. Retrouver dans le document les textes et les textes en image sans effet de graisse d’une taille restituée inférieure à 24px qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces textes, vérifier que :\n - Soit le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.\n3. Si c’est le cas pour chaque texte, **le test est validé**.", "2": "1. Retrouver dans le document les textes et les textes en image en gras d’une taille restituée inférieure à 18,5px qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces textes, vérifier que :\n - Soit le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.\n3. Si c’est le cas pour chaque texte, **le test est validé**.", "3": "1. Retrouver dans le document les textes et les textes en image sans effet de graisse d’une taille restituée supérieure ou égale à 24px qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces textes, vérifier que :\n - Soit le rapport de contraste entre le texte et son arrière-plan est de 3:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1, au moins.\n3. Si c’est le cas pour chaque texte, **le test est validé**.", "4": "1. Retrouver dans le document les textes et les textes en image en gras d’une taille restituée supérieure ou égale à 18,5px qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces textes, vérifier que :\n - Soit le rapport de contraste entre le texte et son arrière-plan est de 3:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1, au moins.\n3. Si c’est le cas pour chaque texte, **le test est validé**.", "5": "1. Retrouver dans le document les mécanismes qui permettent d’afficher un rapport de contraste conforme ;\n2. Pour chacun de ces mécanismes, vérifier que le rapport de contraste entre le texte et la couleur d’arrière-plan est suffisamment élevé ;\n3. Si c’est le cas pour chaque mécanisme, **le test est validé**." }, "techniques": ["G18", "G136", "G148", "G174", "G145", "C29"], "particularCases": [ "Dans ces situations, les critères sont non applicables pour ces éléments :", "- Le texte fait partie d’un logo ou d’un nom de marque d’un organisme ou d’une société ;", "- Le texte ou l’image de texte est purement décoratif ;", "- Le texte fait partie d’une image véhiculant une information mais le texte lui-même n’apporte aucune information essentielle ;", "- Le texte ou l’image de texte fait partie d’un élément d’interface sur lequel aucune action n’est possible (par exemple un bouton avec l’attribut `disabled`)." ], "wcag": ["1.4.3"], "appliesTo": { "ruleIds": ["axe:color-contrast", "axe:color-contrast-enhanced", "contrast-literal", "rendered-contrast", "rendered-contrast-pixel"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment" }, "rules": [ { "id": "axe:color-contrast", "tests": ["1", "2", "3", "4", "5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:color-contrast-enhanced", "tests": ["1", "2", "3", "4", "5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "contrast-literal", "tests": ["1", "2", "3", "4", "5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "rendered-contrast", "tests": ["1", "2", "3", "4", "5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "rendered-contrast-pixel", "tests": ["1", "2", "3", "4", "5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "3.3", "theme": 3, "title": { "fr": "Dans chaque page web, les couleurs utilisées dans les [composants d’interface](#composant-d-interface) ou les éléments graphiques porteurs d’informations sont-elles suffisamment contrastées (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, les couleurs utilisées dans les composants d’interface ou les éléments graphiques porteurs d’informations sont-elles suffisamment contrastées (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, le rapport de [contraste](#contraste) entre les couleurs d’un [composant d’interface](#composant-d-interface) dans ses différents états et la [couleur d’arrière-plan contiguë](#couleur-d-arriere-plan-contigue-et-couleur-contigue) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) est de 3:1, au moins ;", "Un [mécanisme](#mecanisme-qui-permet-d-afficher-un-rapport-de-contraste-conforme) permet un rapport de [contraste](#contraste) de 3:1, au moins." ], "2": [ "Dans chaque page web, le rapport de [contraste](#contraste) des différentes couleurs composant un [élément graphique](#element-graphique), lorsqu’elles sont nécessaires à sa compréhension, et la [couleur d’arrière-plan contiguë](#couleur-d-arriere-plan-contigue-et-couleur-contigue), vérifie-t-il une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) est de 3:1, au moins ;", "Un [mécanisme](#mecanisme-qui-permet-d-afficher-un-rapport-de-contraste-conforme) permet un rapport de [contraste](#contraste) de 3:1, au moins." ], "3": [ "Dans chaque page web, le rapport de [contraste](#contraste) des différentes [couleurs contiguës](#couleur-d-arriere-plan-contigue-et-couleur-contigue) entre elles d’un [élément graphique](#element-graphique), lorsqu’elles sont nécessaires à sa compréhension, vérifie-t-il une de ces conditions (hors cas particuliers) ?", "Le rapport de [contraste](#contraste) est de 3:1, au moins ;", "Un [mécanisme](#mecanisme-qui-permet-d-afficher-un-rapport-de-contraste-conforme) permet un rapport de [contraste](#contraste) de 3:1, au moins." ], "4": [ "Dans le [mécanisme qui permet d’afficher un rapport de contraste](#mecanisme-qui-permet-d-afficher-un-rapport-de-contraste-conforme) conforme, les couleurs du composant ou des éléments graphiques porteurs d’informations qui le composent, sont-elles suffisamment contrastées ?" ] }, "methodology": { "1": "1. Retrouver dans le document les composants d’interface qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces composants, vérifier que :\n - Soit le rapport de contraste entre les couleurs du composant dans ses différents états et la couleur d’arrière-plan contiguë est de 3:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher le composant avec un rapport de contraste de 3:1, au moins.\n3. Si c’est le cas pour chaque composant, **le test est validé**.", "2": "1. Retrouver dans le document les éléments graphiques qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces éléments, vérifier que :\n - Soit le rapport de contraste entre les couleurs de l’élément graphique nécessaires à sa compréhension et la couleur d’arrière-plan contiguë est de 3:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher l’élément graphique avec un rapport de contraste de 3:1, au moins.\n3. Si c’est le cas pour chaque composant, **le test est validé**.", "3": "1. Retrouver dans le document les éléments graphiques qui pourraient poser des problèmes de contraste ;\n2. Pour chacun de ces éléments, vérifier que :\n - Soit le rapport de contraste des différentes couleurs contiguës de l’élément graphique entre elles, lorsqu’elles sont nécessaires à sa compréhension, est de 3:1, au moins ;\n - Soit un mécanisme permet à l’utilisateur d’afficher l’élément graphique avec un rapport de contraste de 3:1, au moins.\n3. Si c’est le cas pour chaque élément graphique, **le test est validé**.", "4": "1. Retrouver dans le document les mécanismes qui permettent d’afficher un rapport de contraste conforme ;\n2. Pour chacun de ces mécanismes, vérifier que le rapport de contraste entre les couleurs du composant ou des éléments graphiques porteurs d’informations qui le composent est suffisamment élevé ;\n3. Si c’est le cas pour chaque mécanisme, **le test est validé**.\n\nNote : le critère est non applicable dans ces situations :\n\n- Composant d'interface inactif (par exemple, un bouton avec un attribut `disabled`) sur lequel aucune action n'est possible ;\n- Composant d'interface pour lequel l'apparence est gérée par les styles natifs du navigateur sans aucune modification par l'auteur (par exemple, le style au focus natif dans Chrome ou Firefox) ;\n- Composant d'interface pour lequel la couleur n'est pas nécessaire pour identifier le composant ou son état (par exemple, un groupe de liens faisant office de navigation dont la position dans la page, la taille et la couleur du texte permettent de comprendre qu'il s'agit de liens même si la couleur du soulignement des liens avec le fond blanc n'a pas un ratio de 3:1 et que le texte lui a un ratio de 4.5:1) ;\n- Élément graphique ou parties d'élément graphique non porteur d'information ou ayant une alternative (description longue, informations identiques visibles dans la page) ;\n- Élément graphique ou parties d'élément graphique faisant partie d'un logo ou du nom de marque d'un organisme ou d'une société ;\n- Élément graphique ou parties d'élément graphique dont la présentation est essentielle à l'information véhiculée (exemple drapeaux, logotypes, photos de personnes ou de scènes, captures d'écran, diagrammes médicaux, carte de chaleurs) ;\n- Élément graphique ou parties d'élément graphique dynamiques dont le contraste au survol / focus est suffisant." }, "techniques": ["G18", "G195", "G207", "G174", "G145", "G183", "F78"], "particularCases": [ "Les cas suivants sont non applicables pour ce critère :", "- Composant d’interface inactif (par exemple, un bouton avec un attribut `disabled`) sur lequel aucune action n’est possible ;", "- Composant d’interface pour lequel l’apparence est gérée par les styles natifs du navigateur sans aucune modification par l’auteur (par exemple, le style au focus natif dans Chrome ou Firefox) ;", "- Composant d’interface pour lequel la couleur n’est pas nécessaire pour identifier le composant ou son état (par exemple, un groupe de liens faisant office de navigation dont la position dans la page, la taille et la couleur du texte permettent de comprendre qu’il s’agit de liens même si la couleur du soulignement des liens avec le fond blanc n’a pas un ratio de 3:1 et que le texte lui a un ratio de 4.5:1) ;", "- [Élément graphique](#element-graphique) ou parties d’élément graphique non porteur d’information ou ayant une alternative (description longue, informations identiques visibles dans la page) ;", "- [Élément graphique](#element-graphique) ou parties d’élément graphique faisant partie d’un logo ou du nom de marque d’un organisme ou d’une société ;", "- [Élément graphique](#element-graphique) ou parties d’élément graphique dont la présentation est essentielle à l’information véhiculée (par exemple, drapeaux, logotypes, photos de personnes ou de scènes, captures d’écran, diagrammes médicaux, carte de chaleurs) ;", "- [Élément graphique](#element-graphique) ou parties d’élément graphique dynamiques dont le contraste au survol / focus est suffisant." ], "wcag": ["1.4.11"], "appliesTo": { "ruleIds": ["rendered-nontext-contrast"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment" }, "rules": [ { "id": "rendered-nontext-contrast", "tests": ["1", "2", "3", "4"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "4.1", "theme": 4, "title": { "fr": "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré a-t-il, si nécessaire, une [transcription textuelle](#transcription-textuelle-media-temporel) ou une [audiodescription](#audiodescription-synchronisee-media-temporel) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque média temporel pré-enregistré a-t-il, si nécessaire, une transcription textuelle ou une audiodescription (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré seulement audio, vérifie-t-il, si nécessaire, l’une de ces conditions (hors cas particuliers) ?", "Il existe une [transcription textuelle](#transcription-textuelle-media-temporel) accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) ;", "Il existe une [transcription textuelle](#transcription-textuelle-media-temporel) adjacente clairement identifiable." ], "2": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré seulement vidéo vérifie-t-il, si nécessaire, l’une de ces conditions (hors cas particuliers) ?", "Il existe une [version alternative « audio seulement »](#version-alternative-audio-seulement) accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) ;", "Il existe une [version alternative « audio seulement »](#version-alternative-audio-seulement) adjacente clairement identifiable ;", "Il existe une [transcription textuelle](#transcription-textuelle-media-temporel) accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) ;", "Il existe une [transcription textuelle](#transcription-textuelle-media-temporel) adjacente clairement identifiable ;", "Il existe une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée ;", "Il existe une version alternative avec une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent)." ], "3": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré vérifie-t-il, si nécessaire, une de ces conditions (hors cas particuliers) ?", "Il existe une [transcription textuelle](#transcription-textuelle-media-temporel) accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) ;", "Il existe une [transcription textuelle](#transcription-textuelle-media-temporel) adjacente clairement identifiable ;", "Il existe une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée ;", "Il existe une version alternative avec une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent)." ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels (éléments `<audio>`, `<video>` ou `<object>`) seulement audio qui nécessitent une transcription textuelle ;\n2. Pour chaque média temporel seulement audio, vérifier la présence d’une transcription textuelle :\n - Soit accessible au moyen d’un bouton ou d’un lien adjacent (une URL ou une ancre) ;\n - Soit adjacente clairement identifiable.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels (éléments `<video>` ou `<object>`) seulement vidéo qui nécessitent une transcription textuelle ;\n2. Pour chaque média temporel seulement vidéo, vérifier la présence :\n - Soit d’une version alternative audio seulement accessible au moyen d’un lien ou bouton adjacent (une URL ou une ancre) ;\n - Soit d’une version alternative audio seulement adjacente ;\n - Soit d’une transcription textuelle accessible au moyen d’un bouton ou d’un lien adjacent (une URL ou une ancre) ;\n - Soit d’une transcription textuelle adjacente clairement identifiable ;\n - Soit d’une audiodescription synchronisée ;\n - Soit d’une version alternative avec une audiodescription synchronisée accessible au moyen d’un bouton ou d'un lien adjacent (une URL ou une ancre).\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "3": "1. Retrouver dans le document les médias temporels (éléments `<video>` ou `<object>`) synchronisés qui nécessitent une transcription textuelle ;\n2. Pour chaque média temporel synchronisé, vérifier la présence :\n - Soit d’une transcription textuelle accessible au moyen d’un lien ou bouton adjacent (une URL ou une ancre) ;\n - Soit d’une transcription textuelle adjacente clairement identifiable ;\n - Soit d’une audiodescription synchronisée ;\n - Soit d’une version alternative avec une audiodescription synchronisée accessible au moyen d’un bouton ou d’un lien adjacent (une URL ou une ancre).\n3. Si c’est le cas pour chaque média temporel, **le test est validé**." }, "techniques": ["G58", "G69", "G78", "G158", "G159", "G173", "G8", "G166", "H96", "SM6", "SM7"], "particularCases": [ "Il existe une gestion de cas particulier lorsque :", "- Le [média temporel](#media-temporel-type-son-video-et-synchronise) est utilisé à des fins décoratives (c’est-à-dire qu’il n’apporte aucune information) ;", "- Le [média temporel](#media-temporel-type-son-video-et-synchronise) est lui-même une alternative à un contenu de la page (une vidéo en langue des signes ou la vocalisation d’un texte, par exemple) ;", "- Le [média temporel](#media-temporel-type-son-video-et-synchronise) est utilisé pour accéder à une version agrandie ;", "- Le [média temporel](#media-temporel-type-son-video-et-synchronise) est utilisé comme un [CAPTCHA](#captcha) ;", "- Le [média temporel](#media-temporel-type-son-video-et-synchronise) fait partie d’un test qui deviendrait inutile si la [transcription textuelle](#transcription-textuelle-media-temporel), les [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia) ou l’[audiodescription](#audiodescription-synchronisee-media-temporel) étaient communiqués ;", "- Pour les services de l’État, les collectivités territoriales et leurs établissements : si le [média temporel](#media-temporel-type-son-video-et-synchronise) a été publié entre le 23 septembre 2019 et le 23 septembre 2020 sur un site internet, intranet ou extranet créé depuis le 23 septembre 2018, il est exempté de l’obligation d’accessibilité ;", "- Pour les personnes de droit privé mentionnées aux 2° à 4° du I de l’article 47 de la loi du 11 février 2005 : si le [média temporel](#media-temporel-type-son-video-et-synchronise) a été publié avant le 23 septembre 2020, il est exempté de l’obligation d’accessibilité.", "Dans ces situations, le critère est non applicable.", "Ce cas particulier s’applique également aux critères 4.2, 4.3, 4.5." ], "wcag": ["1.2.1", "1.2.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "4.2", "theme": 4, "title": { "fr": "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré ayant une [transcription textuelle](#transcription-textuelle-media-temporel) ou une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée, celles-ci sont-elles pertinentes (hors cas particuliers) ?" }, "titlePlain": { "fr": "Pour chaque média temporel pré-enregistré ayant une transcription textuelle ou une audiodescription synchronisée, celles-ci sont-elles pertinentes (hors cas particuliers) ?" }, "tests": { "1": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré seulement audio, ayant une [transcription textuelle](#transcription-textuelle-media-temporel), celle-ci est-elle pertinente (hors cas particuliers) ?" ], "2": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré seulement vidéo vérifie-t-il une de ces conditions (hors cas particuliers) ?", "La [transcription textuelle](#transcription-textuelle-media-temporel) est pertinente ;", "L’[audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée est pertinente ;", "L’[audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée de la version alternative est pertinente ;", "La version alternative audio seulement est pertinente." ], "3": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré vérifie-t-il une de ces conditions (hors cas particuliers) ?", "La [transcription textuelle](#transcription-textuelle-media-temporel) est pertinente ;", "L’[audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée est pertinente ;", "L’[audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée de la version alternative est pertinente." ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels pré-enregistrés seulement audio qui possèdent une transcription textuelle ;\n2. Pour chaque média temporel seulement audio, vérifier que transcription textuelle est pertinente ;\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels pré-enregistrés seulement vidéo qui possèdent une transcription textuelle ;\n2. Pour chaque média temporel seulement vidéo, vérifier la pertinence :\n - Soit de la transcription textuelle ;\n - Soit de l’audiodescription synchronisée ;\n - Soit de l’audiodescription synchronisée de la version alternative ;\n - Soit de la version alternative audio seulement.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "3": "1. Retrouver dans le document les médias temporels pré-enregistrés synchronisés ;\n2. Pour chaque média temporel synchronisé, vérifier la pertinence :\n - Soit de la transcription textuelle ;\n - Soit de l’audiodescription synchronisée ;\n - Soit de l’audiodescription synchronisée de la version alternative.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**." }, "techniques": ["F30", "F67", "SM6", "SM7"], "particularCases": ["Voir cas particuliers critère 4.1."], "wcag": ["1.2.1", "1.2.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "4.3", "theme": 4, "title": { "fr": "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré a-t-il, si nécessaire, des [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque média temporel synchronisé pré-enregistré a-t-il, si nécessaire, des sous-titres synchronisés (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré vérifie-t-il, si nécessaire, l’une de ces conditions (hors cas particuliers) ?", "Le [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé possède des [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia) ;", "Il existe une version alternative possédant des [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia) accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent)." ], "2": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré possédant des [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia) diffusés via une balise `<track>`, la balise `<track>` possède-t-elle un attribut `kind=\"captions\"` ?" ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels pré-enregistrés synchronisés ;\n2. Pour chaque média temporel synchronisé, vérifier la présence :\n - Soit de sous-titres synchronisés ;\n - Soit d’une version alternative possédant des sous-titres synchronisés accessible au moyen d’un lien ou d’un bouton adjacent.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels synchronisés possédant des sous-titres synchronisés au moyen d’un élément `<track>` ;\n2. Pour chaque média temporel synchronisé, vérifier que la balise `<track>` possède un attribut `kind=\"caption\"` ;\n3. Si c’est le cas pour chaque média temporel synchronisé, **le test est validé**." }, "techniques": ["G58", "G93", "G87", "H95", "SM11", "SM12", "F74", "F75"], "particularCases": ["Voir cas particuliers critère 4.1."], "wcag": ["1.2.2"], "appliesTo": { "ruleIds": ["axe:audio-caption", "axe:video-caption", "media-no-track"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "axe:audio-caption", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:video-caption", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "media-no-track", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "4.4", "theme": 4, "title": { "fr": "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré ayant des [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia), ces sous-titres sont-ils pertinents ?" }, "titlePlain": { "fr": "Pour chaque média temporel synchronisé pré-enregistré ayant des sous-titres synchronisés, ces sous-titres sont-ils pertinents ?" }, "tests": { "1": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré ayant des [sous-titres synchronisés](#sous-titres-synchronises-objet-multimedia), ces sous-titres sont-ils pertinents ?" ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels synchronisés possédant des sous-titres synchronisés ;\n2. Pour chaque média temporel synchronisé, vérifier que les sous-titres sont :\n - Pertinents (toutes les informations sonores importantes sont présentes, les dialogues notamment) ;\n - Et correctement synchronisés.\n3. Si c’est le cas pour chaque média temporel synchronisé, **le test est validé**." }, "techniques": ["G93", "G87", "SM11", "SM12", "F8", "F74", "F75"], "wcag": ["1.2.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "4.5", "theme": 4, "title": { "fr": "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré a-t-il, si nécessaire, une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque média temporel pré-enregistré a-t-il, si nécessaire, une audiodescription synchronisée (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré seulement vidéo vérifie-t-il, si nécessaire, une de ces conditions (hors cas particuliers) ?", "Il existe une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée ;", "Il existe une version alternative avec une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée." ], "2": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé pré-enregistré vérifie-t-il, si nécessaire, une de ces conditions (hors cas particuliers) ?", "Il existe une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée ;", "Il existe une version alternative avec une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée." ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels pré-enregistrés seulement vidéo qui nécessitent une audiodescription ;\n2. Pour chaque média temporel seulement vidéo, vérifier la présence :\n - Soit d’une audiodescription synchronisée ;\n - Soit d’une version alternative avec une audiodescription synchronisée accessible au moyen d’un bouton ou d’un lien adjacent (une URL ou une ancre).\n3. Si c’est le cas pour chaque média temporel seulement vidéo, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels pré-enregistrés synchronisés qui nécessitent une audiodescription ;\n2. Pour chaque média temporel synchronisé, vérifier la présence :\n - Soit d’une audiodescription synchronisée ;\n - Soit d’une version alternative avec une audiodescription synchronisée accessible au moyen d’un bouton ou d’un lien adjacent (une URL ou une ancre).\n3. Si c’est le cas pour chaque média temporel synchronisé, **le test est validé**." }, "techniques": ["G8", "G58", "G78", "G173", "H96", "SM1", "SM2", "SM6", "SM7"], "particularCases": ["Voir cas particuliers critère 4.1."], "wcag": ["1.2.5"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "4.6", "theme": 4, "title": { "fr": "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré ayant une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée, celle-ci est-elle pertinente ?" }, "titlePlain": { "fr": "Pour chaque média temporel pré-enregistré ayant une audiodescription synchronisée, celle-ci est-elle pertinente ?" }, "tests": { "1": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) pré-enregistré seulement vidéo ayant une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée, celle-ci est-elle pertinente ?" ], "2": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) synchronisé ayant une [audiodescription](#audiodescription-synchronisee-media-temporel) synchronisée, celle-ci est-elle pertinente ?" ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels seulement vidéo qui possèdent une audiodescription ;\n2. Pour chaque média temporel, vérifier que l’audiodescription synchronisée est pertinente (toutes les informations visuelles qu’il est possible de vocaliser dans les blancs de la bande son principale sont présentes, les textes incrustés notamment) ;\n3. Si c’est le cas pour chaque média temporel seulement vidéo, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels synchronisés qui possèdent une audiodescription ;\n2. Pour chaque média temporel, vérifier que l’audiodescription synchronisée est pertinente (toutes les informations visuelles qu’il est possible de vocaliser dans les blancs de la bande son principale sont présentes, les textes incrustés notamment) ;\n3. Si c’est le cas pour chaque média temporel synchronisé, **le test est validé**." }, "techniques": ["SM1", "SM2", "SM6", "SM7"], "wcag": ["1.2.5"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "4.7", "theme": 4, "title": { "fr": "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) est-il clairement identifiable (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque média temporel est-il clairement identifiable (hors cas particuliers) ?" }, "tests": { "1": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise) seulement son, seulement vidéo ou synchronisé, le contenu textuel adjacent permet-il d’identifier clairement le [média temporel](#media-temporel-type-son-video-et-synchronise) (hors cas particuliers) ?" ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels pré-enregistrés seulement vidéo, audio ou synchronisés ;\n2. Pour chaque média temporel, vérifier que :\n - Un passage de texte (un titre ou un paragraphe, par exemple) qui précède ou suit immédiatement le média temporel, permet de l’identifier ;\n - Et le passage de texte est situé à l’extérieur du lecteur de contenu multimédia si ce dernier fait appel à la technologie Flash.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**." }, "techniques": ["G68", "G100"], "particularCases": [ "Il existe une gestion de cas particulier lorsque le [média temporel](#media-temporel-type-son-video-et-synchronise) est utilisé à des fins décoratives (c’est-à-dire qu’il n’apporte aucune information). Dans cette situation, le critère est non applicable." ], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "4.8", "theme": 4, "title": { "fr": "Chaque [média non temporel](#media-non-temporel) a-t-il, si nécessaire, une alternative (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque média non temporel a-t-il, si nécessaire, une alternative (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [média non temporel](#media-non-temporel) vérifie-t-il, si nécessaire, une de ces conditions (hors cas particuliers) ?", "Un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent), clairement identifiable, permet d’accéder à une page contenant une alternative ;", "Un [lien ou un bouton adjacent](#lien-ou-bouton-adjacent), clairement identifiable, permet d’accéder à une alternative dans la page." ], "2": [ "Chaque [média non temporel](#media-non-temporel) associé à une alternative vérifie-t-il une de ces conditions (hors cas particuliers) ?", "La page référencée par le [lien ou bouton adjacent](#lien-ou-bouton-adjacent) est accessible ;", "L’alternative dans la page, référencée par le [lien ou bouton adjacent](#lien-ou-bouton-adjacent), est accessible." ] }, "methodology": { "1": "1. Retrouver dans le document les médias non temporels ;\n2. Pour chaque média non temporel, vérifier qu’un lien ou un bouton adjacent, clairement identifiable :\n - Soit contient l’adresse (url) d’une page contenant une alternative ;\n - Soit permet d’accéder à une alternative dans la page.\n3. Si c’est le cas pour chaque média non temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias non temporels associés à une alternative ;\n2. Pour chaque média non temporel, vérifier que :\n - La page référencée par le lien ou le bouton adjacent est accessible ;\n - L’alternative dans la page, référencée par le lien ou le bouton adjacent, est accessible.\n3. Si c’est le cas pour chaque média non temporel, **le test est validé**.\n\nNote : le critère est non applicable dans les situations où :\n\n- Le média non temporel est utilisé à des fins décoratives (c'est-à-dire qu'il n'apporte aucune information) ;\n- Le média non temporel est diffusé dans un environnement maîtrisé ;\n- Le média non temporel est inséré via JavaScript en vérifiant la présence et la version du plug-in, en remplacement d'un contenu alternatif déjà présent." }, "techniques": ["H35", "H46"], "particularCases": [ "Il existe une gestion de cas particulier lorsque :", "- Le [média non temporel](#media-non-temporel) est utilisé à des fins décoratives (c’est-à-dire qu’il n’apporte aucune information) ;", "- Le [média non temporel](#media-non-temporel) est diffusé dans un [environnement maîtrisé](#environnement-maitrise) ;", "- Le [média non temporel](#media-non-temporel) est inséré via JavaScript en vérifiant la présence et la version du plug-in, en remplacement d’un [contenu alternatif](#contenu-alternatif) déjà présent.", "Dans ces situations, le critère est non applicable." ], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "4.9", "theme": 4, "title": { "fr": "Pour chaque [média non temporel](#media-non-temporel) ayant une alternative, cette alternative est-elle pertinente ?" }, "titlePlain": { "fr": "Pour chaque média non temporel ayant une alternative, cette alternative est-elle pertinente ?" }, "tests": { "1": [ "Pour chaque [média non temporel](#media-non-temporel) ayant une alternative, cette alternative permet-elle d’accéder au même contenu et à des fonctionnalités similaires ?" ] }, "methodology": { "1": "1. Retrouver dans le document les médias non temporels associés à une alternative ;\n2. Pour chaque média non temporel, vérifier que l’alternative est pertinente (elle permet d’accéder au même contenu et à des fonctionnalités similaires) ;\n3. Si c’est le cas pour chaque média non temporel, **le test est validé**." }, "techniques": ["H46", "F30"], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "4.10", "theme": 4, "title": { "fr": "Chaque son déclenché automatiquement est-il [contrôlable](#controle-son-declenche-automatiquement) par l’utilisateur ?" }, "titlePlain": { "fr": "Chaque son déclenché automatiquement est-il contrôlable par l’utilisateur ?" }, "tests": { "1": [ "Chaque séquence sonore déclenchée automatiquement via une balise `<object>`, `<video>`, `<audio>`, `<embed>`, `<bgsound>` ou un code JavaScript vérifie-t-elle une de ces conditions ?", "La séquence sonore a une durée inférieure ou égale à 3 secondes ;", "La séquence sonore peut être stoppée sur action de l’utilisateur ;", "Le volume de la séquence sonore peut être contrôlé par l’utilisateur indépendamment du contrôle de volume du système." ] }, "methodology": { "1": "1. Au chargement du document, si un son se déclenche automatiquement, vérifier que :\n - Soit la séquence sonore a une durée inférieure ou égale à 3 secondes ;\n - Soit un dispositif (un bouton par exemple), sur l’élément ayant déclenché le son (voir note), ou dans la page, permet de le stopper ;\n - Soit le volume de la séquence peut être contrôlé par l’utilisateur, indépendamment du contrôle de volume du système.\n2. Si c’est le cas, **le test est validé**.\n\nNote : les éléments suivants sont susceptibles de déclencher des sons au chargement de la page : éléments `<audio>`, `<video>`, `<object>`, `<embed>`, `<bgsound>` ou un code JavaScript (utilisation de la Web Audio API, par exemple)." }, "techniques": ["G60", "G170", "G171", "F23", "F93"], "wcag": ["1.4.2"], "appliesTo": { "ruleIds": ["autoplay-media", "axe:no-autoplay-audio"] }, "judgment": true, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "autoplay-media", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:no-autoplay-audio", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "4.11", "theme": 4, "title": { "fr": "La consultation de chaque [média temporel](#media-temporel-type-son-video-et-synchronise) est-elle, si nécessaire, [contrôlable par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ?" }, "titlePlain": { "fr": "La consultation de chaque média temporel est-elle, si nécessaire, contrôlable par le clavier et tout dispositif de pointage ?" }, "tests": { "1": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) a-t-il, si nécessaire, les fonctionnalités de [contrôle de sa consultation](#controle-de-la-consultation-d-un-media-temporel) ?" ], "2": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise), chaque fonctionnalité vérifie-t-elle une de ces conditions ?", "La fonctionnalité est [accessible par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ;", "Une fonctionnalité [accessible par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) permettant de réaliser la même action est présente dans la page." ], "3": [ "Pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise), chaque fonctionnalité vérifie-t-elle une de ces conditions ?", "La fonctionnalité est [activable par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ;", "Une fonctionnalité [activable par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) permettant de réaliser la même action est présente dans la page." ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels ;\n2. Pour chaque média temporel, vérifier la présence des fonctionnalités obligatoires de contrôle de la consultation :\n - Au minimum : lecture, pause ou stop ;\n - Si le média a du son, il doit avoir une fonctionnalité d’activation / désactivation du son ;\n - Si le média a des sous-titres, il doit avoir une fonctionnalité de contrôle de l’apparition/disparition des sous-titres ;\n - Si le média a une audiodescription, il doit avoir une fonctionnalité de contrôle de l’apparition/disparition de l’audiodescription.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels pourvus de fonctionnalités de contrôle ;\n2. Pour chaque média temporel, vérifier que :\n - Soit la fonctionnalité est accessible par le clavier et tout dispositif de pointage ;\n - Soit une fonctionnalité accessible par le clavier et tout dispositif de pointage permettant de réaliser la même action est présente dans la page.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**.", "3": "1. Retrouver dans le document les médias temporels pourvus de fonctionnalités de contrôle ;\n2. Pour chaque média temporel, vérifier que :\n - Soit la fonctionnalité est activable par le clavier et tout dispositif de pointage ;\n - Soit une fonctionnalité activable par le clavier et tout dispositif de pointage permettant de réaliser la même action est présente dans la page.\n3. Si c’est le cas pour chaque média temporel, **le test est validé**." }, "techniques": ["G4", "G90", "G202"], "wcag": ["2.1.1", "2.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "4.12", "theme": 4, "title": { "fr": "La consultation de chaque [média non temporel](#media-non-temporel) est-elle [contrôlable par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ?" }, "titlePlain": { "fr": "La consultation de chaque média non temporel est-elle contrôlable par le clavier et tout dispositif de pointage ?" }, "tests": { "1": [ "Pour chaque [média non temporel](#media-non-temporel), chaque fonctionnalité vérifie-t-elle une de ces conditions ?", "La fonctionnalité est [accessible par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ;", "Une fonctionnalité [accessible par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) permettant de réaliser la même action est présente dans la page." ], "2": [ "Pour chaque [média non temporel](#media-non-temporel), chaque fonctionnalité vérifie-t-elle une de ces conditions ?", "La fonctionnalité est [activable par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ;", "Une fonctionnalité [activable par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) permettant de réaliser la même action est présente dans la page." ] }, "methodology": { "1": "1. Retrouver dans le document les médias non temporels pourvus de fonctionnalités de contrôle ;\n2. Pour chaque média non temporel, vérifier que :\n - Soit la fonctionnalité est accessible par le clavier et tout dispositif de pointage ;\n - Soit une fonctionnalité accessible par le clavier et tout dispositif de pointage permettant de réaliser la même action est présente dans la page.\n3. Si c’est le cas pour chaque média non temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias non temporels pourvus de fonctionnalités de contrôle ;\n2. Pour chaque média non temporel, vérifier que :\n - Soit la fonctionnalité est activable par le clavier et tout dispositif de pointage ;\n - Soit une fonctionnalité activable par le clavier et tout dispositif de pointage permettant de réaliser la même action est présente dans la page.\n3. Si c’est le cas pour chaque média non temporel, **le test est validé**." }, "techniques": ["G4", "G90"], "wcag": ["2.1.1", "2.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "4.13", "theme": 4, "title": { "fr": "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) et [non temporel](#media-non-temporel) est-il [compatible avec les technologies d’assistance](#compatible-avec-les-technologies-d-assistance) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque média temporel et non temporel est-il compatible avec les technologies d’assistance (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) et [non temporel](#media-non-temporel) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "Le nom, le rôle, la valeur, le paramétrage et les changements d’états des composants d’interfaces sont accessibles aux technologies d’assistance via une API d’accessibilité ;", "Une alternative [compatible avec une API d’accessibilité](#compatible-avec-les-technologies-d-assistance) permet d’accéder aux mêmes fonctionnalités." ], "2": [ "Chaque [média temporel](#media-temporel-type-son-video-et-synchronise) et [non temporel](#media-non-temporel) qui possède une alternative [compatible avec les technologies d’assistance](#compatible-avec-les-technologies-d-assistance), vérifie-t-il une de ces conditions ?", "L’alternative est adjacente au [média temporel](#media-temporel-type-son-video-et-synchronise) ou [non temporel](#media-non-temporel) ;", "L’alternative est accessible via un [lien ou bouton adjacent](#lien-ou-bouton-adjacent) ;", "Un mécanisme permet de remplacer le [média temporel](#media-temporel-type-son-video-et-synchronise) ou [non temporel](#media-non-temporel) par son alternative." ] }, "methodology": { "1": "1. Retrouver dans le document les médias temporels et non temporels ;\n2. Pour chaque média, vérifier que :\n - Soit le nom, le rôle, la valeur, le paramétrage et les changements d’états des composants d’interfaces sont accessibles aux technologies d’assistance via une API d’accessibilité (par exemple, les zones mises à jour dynamiquement dans un lecteur vidéo sont correctement restituées) ;\n - Soit une alternative compatible avec une API d’accessibilité permet d’accéder aux mêmes fonctionnalités.\n3. Si c’est le cas pour chaque média temporel ou non temporel, **le test est validé**.", "2": "1. Retrouver dans le document les médias temporels et non temporels qui possèdent une alternative compatible avec les technologies d’assistance ;\n2. Pour chaque média, vérifier que :\n - Soit l’alternative est adjacente au média temporel ou non temporel ;\n - Soit l’alternative est accessible au moyen d’un lien ou d’un bouton adjacent ;\n - Soit un mécanisme permet de remplacer le média temporel ou non temporel par son alternative.\n3. Si c’est le cas pour chaque média temporel ou non temporel, **le test est validé**." }, "techniques": ["G10", "G135", "F15", "F54"], "particularCases": [ "Il existe une gestion de cas particulier lorsque le [média temporel](#media-temporel-type-son-video-et-synchronise) ou [non temporel](#media-non-temporel) est utilisé à des fins décoratives (c’est-à-dire qu’il n’apporte aucune information).", "Dans ces situations, le critère est non applicable." ], "wcag": ["4.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "5.1", "theme": 5, "title": { "fr": "Chaque [tableau de données complexe](#tableau-de-donnees-complexe) a-t-il un [résumé](#resume-de-tableau) ?" }, "titlePlain": { "fr": "Chaque tableau de données complexe a-t-il un résumé ?" }, "tests": { "1": ["Pour chaque [tableau de données complexe](#tableau-de-donnees-complexe), un [résumé](#resume-de-tableau) est-il disponible ?"] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de données complexes (tableau de données - élément `<table>` ou élément pourvu d’un attribut WAI-ARIA `role=\"table\"` - contenant des en-têtes qui ne sont pas répartis uniquement sur la première ligne et/ou la première colonne de la grille ou dont la portée n’est pas valable pour l’ensemble de la colonne ou de la ligne) ;\n2. Pour chaque tableau de données complexe, vérifier qu’un passage de texte permettant de comprendre la nature et la structure du tableau, est présent :\n - Soit dans l’élément `<caption>` ;\n - Soit dans l’attribut `summary` de l’élément `<table>` (dans les versions de HTML et de XHTML antérieures à HTML 5) ;\n - Soit dans un passage de texte lié au tableau avec l’attribut `aria-describedby`.\n3. Si c’est le cas pour chaque tableau de données complexe, **le test est validé**." }, "techniques": ["H73"], "technicalNote": [ "La spécification HTML propose plusieurs [méthodes pour lier un résumé à un tableau](#table-descriptions-techniques) (tableau lié à un passage de texte avec l’attribut `aria-describedby`, tableau groupé dans un élément `figure` avec un résumé présent dans un élément `figcaption` ou un élément `p`, résumé présent dans un élément `details` contenu dans l’élément `caption`). Ces méthodes n’ont pas un support suffisant pour être utilisées actuellement." ], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "5.2", "theme": 5, "title": { "fr": "Pour chaque [tableau de données complexe](#tableau-de-donnees-complexe) ayant un [résumé](#resume-de-tableau), celui-ci est-il pertinent ?" }, "titlePlain": { "fr": "Pour chaque tableau de données complexe ayant un résumé, celui-ci est-il pertinent ?" }, "tests": { "1": ["Pour chaque [tableau de données complexe](#tableau-de-donnees-complexe) ayant un [résumé](#resume-de-tableau), celui-ci est-il pertinent ?"] }, "methodology": { "1": "1. Retrouver dans le document les résumés de tableaux de données complexes (tels que déterminés par le test 5.1.1) ;\n2. Pour chaque résumé, vérifier que son contenu est pertinent ;\n3. Si c’est le cas pour chaque résumé de tableaux de données complexes, **le test est validé**." }, "techniques": ["H73"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "5.3", "theme": 5, "title": { "fr": "Pour chaque [tableau de mise en forme](#tableau-de-mise-en-forme), le contenu linéarisé reste-t-il compréhensible ?" }, "titlePlain": { "fr": "Pour chaque tableau de mise en forme, le contenu linéarisé reste-t-il compréhensible ?" }, "tests": { "1": [ "Chaque [tableau de mise en forme](#tableau-de-mise-en-forme) vérifie-t-il ces conditions ?", "Le contenu linéarisé reste compréhensible ;", "La balise `<table>` possède un attribut `role=\"presentation\"`." ] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de mise en forme ;\n2. Pour chaque tableau de mise en forme, vérifier que :\n - L’ordre d’accès aux cellules est cohérent avec le contenu ;\n - L’élément `<table>` est pourvu d’un attribut WAI-ARIA `role=\"presentation\"`.\n3. Si c’est le cas pour chaque tableau de mise en forme, **le test est validé**." }, "techniques": ["F49", "ARIA4"], "wcag": ["1.3.2", "4.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "5.4", "theme": 5, "title": { "fr": "Pour chaque [tableau de données ayant un titre](#tableau-de-donnees-ayant-un-titre), le titre est-il correctement associé au tableau de données ?" }, "titlePlain": { "fr": "Pour chaque tableau de données ayant un titre, le titre est-il correctement associé au tableau de données ?" }, "tests": { "1": [ "Pour chaque [tableau de données ayant un titre](#tableau-de-donnees-ayant-un-titre), le titre est-il correctement associé au tableau de données ?" ] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de données pourvus d’un titre ;\n2. Pour chaque titre, vérifier qu’il est fourni au moyen :\n - Soit d’un élément `<caption>` ;\n - Soit d’un attribut `title` ;\n - Soit d’un attribut WAI-ARIA `aria-label` ;\n - Soit d’un attribut WAI-ARIA `aria-labelledby` référençant un passage de texte.\n3. Si c’est le cas pour chaque titre de tableau de données, **le test est validé**." }, "techniques": ["H39"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["table-caption-missing"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "table-caption-missing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "5.5", "theme": 5, "title": { "fr": "Pour chaque [tableau de données ayant un titre](#tableau-de-donnees-ayant-un-titre), celui-ci est-il pertinent ?" }, "titlePlain": { "fr": "Pour chaque tableau de données ayant un titre, celui-ci est-il pertinent ?" }, "tests": { "1": [ "Pour chaque [tableau de données ayant un titre](#tableau-de-donnees-ayant-un-titre), ce titre permet-il d’identifier le contenu du [tableau de données](#tableau-de-donnees) de manière claire et concise ?" ] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de données pourvus d’un titre ;\n2. Pour chaque titre, vérifier qu’il est pertinent ;\n3. Si c’est le cas pour chaque titre de tableau de données, **le test est validé**." }, "techniques": ["H39"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "5.6", "theme": 5, "title": { "fr": "Pour chaque [tableau de données](#tableau-de-donnees), chaque [en-tête de colonne](#en-tete-de-colonne-ou-de-ligne) et chaque [en-tête de ligne](#en-tete-de-colonne-ou-de-ligne) sont-ils correctement déclarés ?" }, "titlePlain": { "fr": "Pour chaque tableau de données, chaque en-tête de colonne et chaque en-tête de ligne sont-ils correctement déclarés ?" }, "tests": { "1": [ "Pour chaque [tableau de données](#tableau-de-donnees), chaque [en-tête de colonne](#en-tete-de-colonne-ou-de-ligne) s’appliquant à la totalité de la colonne vérifie-t-il une de ces conditions ?", "L’[en-tête de colonnes](#en-tete-de-colonne-ou-de-ligne) est structuré au moyen d’une balise `<th>` ;", "L’[en-tête de colonnes](#en-tete-de-colonne-ou-de-ligne) est structuré au moyen d’une balise pourvue d’un attribut WAI-ARIA `role=\"columnheader\"`." ], "2": [ "Pour chaque [tableau de données](#tableau-de-donnees), chaque [en-tête de ligne](#en-tete-de-colonne-ou-de-ligne) s’appliquant à la totalité de la ligne vérifie-t-il une de ces conditions ?", "L’[en-tête de lignes](#en-tete-de-colonne-ou-de-ligne) est structuré au moyen d’une balise `<th>` ;", "L’[en-tête de lignes](#en-tete-de-colonne-ou-de-ligne) est structuré au moyen d’une balise pourvue d’un attribut WAI-ARIA `role=\"rowheader\"`." ], "3": [ "Pour chaque [tableau de données](#tableau-de-donnees), chaque en-tête ne s’appliquant pas à la totalité de la ligne ou de la colonne est-il structuré au moyen d’une balise `<th>` ?" ], "4": [ "Pour chaque [tableau de données](#tableau-de-donnees), chaque cellule associée à plusieurs en-têtes est-elle structurée au moyen d’une balise `<td>` ou `<th>` ?" ] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête de colonnes s’appliquant à la totalité de la colonne, vérifier que l’en-tête de colonne est structuré au moyen :\n - Soit d’un élément `<th>` ;\n - Soit d’un élément pourvu d’un attribut WAI-ARIA `role=\"columnheader\"`.\n3. Si c’est le cas pour chaque en-tête de colonne s’appliquant à la totalité de la colonne, **le test est validé**.", "2": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête de ligne s’appliquant à la totalité de la ligne, vérifier que l’en-tête de ligne est structuré au moyen :\n - Soit d’un élément `<th>` ;\n - Soit d’un élément pourvu d’un attribut WAI-ARIA `role=\"rowheader\"`.\n3. Si c’est le cas pour chaque en-tête de ligne s’appliquant à la totalité de la ligne, **le test est validé**.", "3": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête ne s’appliquant pas à la totalité de la ligne ou de la colonne, vérifier que l’en-tête de ligne est structuré au moyen d’un élément `<th>` ;\n3. Si c’est le cas pour chaque en-tête ne s’appliquant pas à la totalité de la ligne ou de la colonne, **le test est validé**.", "4": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque cellule associée à plusieurs en-têtes est-elle structurée au moyen d’une balise `<th>` ou `<td>` ;\n3. Si c’est le cas pour chaque en-tête ne s’appliquant pas à la totalité de la ligne ou de la colonne, **le test est validé**." }, "techniques": ["H51", "F91"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["axe:td-has-header", "axe:th-has-data-cells", "data-table-no-headers", "th-no-data-cells"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment" }, "rules": [ { "id": "axe:td-has-header", "tests": ["1", "2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:th-has-data-cells", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "data-table-no-headers", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "th-no-data-cells", "tests": ["1", "2", "3", "4"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "5.7", "theme": 5, "title": { "fr": "Pour chaque [tableau de données](#tableau-de-donnees), la technique appropriée permettant d’associer chaque cellule avec ses [en-têtes](#en-tete-de-colonne-ou-de-ligne) est-elle utilisée (hors cas particuliers) ?" }, "titlePlain": { "fr": "Pour chaque tableau de données, la technique appropriée permettant d’associer chaque cellule avec ses en-têtes est-elle utilisée (hors cas particuliers) ?" }, "tests": { "1": [ "Pour chaque contenu de balise `<th>` s’appliquant à la totalité de la ligne ou de la colonne, la balise `<th>` respecte-t-elle une de ces conditions (hors cas particuliers) ?", "La balise `<th>` possède un attribut `id` unique ;", "La balise `<th>` possède un attribut `scope` ;", "La balise `<th>` possède un attribut WAI-ARIA `role=\"rowheader\"` ou `role=\"columnheader\"`." ], "2": [ "Pour chaque contenu de balise `<th>` s’appliquant à la totalité de la ligne ou de la colonne et possédant un attribut `scope`, la balise `<th>` vérifie-t-elle une de ces conditions ?", "La balise `<th>` possède un attribut `scope` avec la valeur `\"row\"` pour les [en-têtes de ligne](#en-tete-de-colonne-ou-de-ligne) ;", "La balise `<th>` possède un attribut `scope` avec la valeur `\"col\"` pour les [en-têtes de colonne](#en-tete-de-colonne-ou-de-ligne)." ], "3": [ "Pour chaque contenu de balise `<th>` ne s’appliquant pas à la totalité de la ligne ou de la colonne, la balise `<th>` vérifie-t-elle ces conditions ?", "La balise `<th>` ne possède pas d’attribut `scope` ;", "La balise `<th>` ne possède pas d’attribut WAI-ARIA `role=\"rowheader\"` ou `role=\"columnheader\"` ;", "La balise `<th>` possède un attribut `id` unique." ], "4": [ "Pour chaque contenu de balise `<td>` ou `<th>` associée à un ou plusieurs en-têtes possédant un attribut `id`, la balise vérifie-t-elle ces conditions ?", "La balise possède un attribut `headers` ;", "L’attribut `headers` possède la liste des valeurs d’attribut `id` des [en-têtes](#en-tete-de-colonne-ou-de-ligne) associés." ], "5": [ "Pour chaque balise pourvue d’un attribut WAI-ARIA `role=\"rowheader\"` ou `role=\"columnheader\"` dont le contenu s’applique à la totalité de la ligne ou de la colonne, la balise vérifie-t-elle une de ces conditions ?", "La balise possède un attribut WAI-ARIA `role=\"rowheader\"` pour les [en-têtes de ligne](#en-tete-de-colonne-ou-de-ligne) ;", "La balise possède un attribut WAI-ARIA `role=\"columnheader\"` pour les [en-têtes de colonne](#en-tete-de-colonne-ou-de-ligne)." ] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête (élément `<th>`) s’appliquant à la totalité de la ligne ou de la colonne, vérifier que l’élément `<th>` possède :\n - Soit un attribut `id` unique ;\n - Soit un attribut scope ;\n - Soit un attribut WAI-ARIA `role=\"rowheader\"` ou `\"columnheader\"`.\n3. Si c’est le cas pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne, **le test est validé**.", "2": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête (élément `<th>`) s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut `scope`, vérifier que l’attribut `scope` possède :\n - Soit une valeur `\"row\"` pour les en-têtes de ligne ;\n - Soit une valeur `\"col\"` pour les en-têtes de colonne.\n3. Si c’est le cas pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut `scope`, **le test est validé**.", "3": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête (élément `<th>`) ne s’appliquant pas à la totalité de la ligne ou de la colonne, vérifier que l’élément `<th>` :\n - Possède un attribut `id` unique ;\n - Et ne possède pas d’attribut `scope `;\n - Et ne possède pas d’attribut WAI-ARIA `role=\"rowheader\"` ou `\"columnheader\"`.\n3. Si c’est le cas pour chaque en-tête ne s’appliquant pas à la totalité de la ligne ou de la colonne, **le test est validé**.", "4": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque élément `<td>` ou `<th>` associé à un ou plusieurs en-têtes possédant un attribut `id`, vérifier que :\n - L’élément `<td>` ou `<th>` possède un attribut `headers` ;\n - Et l’attribut `headers` possède la liste des valeurs d’attribut `id` des en-têtes associés.\n3. Si c’est le cas pour chaque élément `<td>` ou `<th>` associé à un ou plusieurs en-têtes possédant un attribut `id`, **le test est validé**.", "5": "1. Retrouver dans le document les tableaux de données ;\n2. Pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut WAI-ARIA `role=\"rowheader\"` ou `\"columnheader\"`, vérifier que l’élément possède :\n - Soit un attribut WAI-ARIA `role=\"rowheader\"` pour les en-têtes de ligne ;\n - Soit un attribut WAI-ARIA `role=\"columnheader\"` pour les en-têtes de colonne.\n3. Si c’est le cas pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut WAI-ARIA `role=\"rowheader\"` ou `\"columnheader\"`, **le test est validé**." }, "techniques": ["H43", "H63", "F90"], "technicalNote": [ "Si l’attribut `headers` est implémenté sur une cellule déjà reliée à un en-tête (de ligne ou de colonne) avec l’attribut `scope` (avec la valeur `col` ou `row`), c’est l’en-tête ou les en-têtes référencés par l’attribut `headers` qui seront restitués aux technologies d’assistance. Les en-têtes reliés avec l’attribut `scope` seront ignorés." ], "particularCases": [ "Dans le cas de tableaux de données ayant des en-têtes sur une seule ligne ou une seule colonne, les en-têtes peuvent être structurés à l’aide de balise `<th>` sans attribut `scope`." ], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["axe:scope-attr-valid", "axe:td-headers-attr", "data-table-no-headers", "headers-attr-dangling", "table-scope-invalid"] }, "automation": { "tests": { "1": "judgment", "2": "static", "3": "static", "4": "static", "5": "judgment" }, "rules": [ { "id": "axe:scope-attr-valid", "tests": ["2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:td-headers-attr", "tests": ["4"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "data-table-no-headers", "tests": ["1", "2", "3", "4", "5"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "headers-attr-dangling", "tests": ["4"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "table-scope-invalid", "tests": ["2", "3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "5.8", "theme": 5, "title": { "fr": "Chaque [tableau de mise en forme](#tableau-de-mise-en-forme) ne doit pas utiliser d’éléments propres aux [tableaux de données](#tableau-de-donnees). Cette règle est-elle respectée ?" }, "titlePlain": { "fr": "Chaque tableau de mise en forme ne doit pas utiliser d’éléments propres aux tableaux de données. Cette règle est-elle respectée ?" }, "tests": { "1": [ "Chaque [tableau de mise en forme](#tableau-de-mise-en-forme) (balise `<table>`) vérifie-t-il ces conditions ?", "Le tableau de mise en forme (balise `<table>`) n’a pas d’attribut `summary` (sinon vide) et ne contient pas de balises `<caption>`, `<th>`, `<thead>`, `<tfoot>` ou de balises ayant un attribut WAI-ARIA `role=\"rowheader\"`, `role=\"columnheader\"` ;", "Les cellules du tableau de mise en forme (balises `<td>`) ne possèdent pas d’attributs `scope`, `headers` et `axis`." ] }, "methodology": { "1": "1. Retrouver dans le document les tableaux de mise en forme ;\n2. Pour chaque tableau de mise en forme, vérifier que :\n - L’élément `<table>` ne possède pas d'attribut `summary`, d’éléments enfant `<caption>`, `<thead>`, `<th>`, `<tfoot>` ou d’éléments pourvus d’un attribut WAI-ARIA `role=\"rowheader\"` ou `role=\"columnheader\"` ;\n - Les éléments `<td>` ne possèdent pas d’attributs `scope`, `headers` et `axis`.\n3. Si c’est le cas pour chaque tableau de mise en forme, **le test est validé**." }, "techniques": ["F46"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["axe:table-fake-caption", "layout-table-data-markup"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:table-fake-caption", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "layout-table-data-markup", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "6.1", "theme": 6, "title": { "fr": "Chaque [lien](#lien) est-il explicite (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque lien est-il explicite (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [lien texte](#lien-texte) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) seul permet d’en comprendre la fonction et la destination ;", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) additionné au [contexte du lien](#contexte-du-lien) permet d’en comprendre la fonction et la destination." ], "2": [ "Chaque [lien image](#lien-image) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) seul permet d’en comprendre la fonction et la destination ;", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) additionné au [contexte du lien](#contexte-du-lien) permet d’en comprendre la fonction et la destination." ], "3": [ "Chaque [lien composite](#lien-composite) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) seul permet d’en comprendre la fonction et la destination ;", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) additionné au [contexte du lien](#contexte-du-lien) permet d’en comprendre la fonction et la destination." ], "4": [ "Chaque [lien SVG](#lien-svg) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) seul permet d’en comprendre la fonction et la destination ;", "L’[intitulé de lien](#intitule-ou-nom-accessible-de-lien) additionné au [contexte du lien](#contexte-du-lien) permet d’en comprendre la fonction et la destination." ], "5": [ "Pour chaque [lien](#lien) ayant un [intitulé visible](#intitule-visible), le [nom accessible du lien](#intitule-ou-nom-accessible-de-lien) contient-il au moins l’[intitulé visible](#intitule-visible) (hors cas particuliers) ?" ] }, "methodology": { "1": "1. Retrouver dans le document les liens texte ;\n2. Pour chaque lien texte, vérifier que ce qui permet d’en comprendre la fonction et la destination est :\n - Soit l’intitulé du lien seul ;\n - Soit le contexte du lien.\n3. Si c’est le cas pour chaque lien texte, **le test est validé**.", "2": "1. Retrouver dans le document les liens image (lien avec pour contenu un élément `<img>` ou un élément ayant l’attribut WAI-ARIA `role=\"img\"`, un élément `<area>` possédant un attribut `href`, un élément `<object>`, un élément `<canvas>` ou un élément `<svg>`) ;\n2. Pour chaque lien image, vérifier que ce qui permet d’en comprendre la fonction et la destination est :\n - Soit l’intitulé du lien seul, fourni par l’alternative textuelle de l’image ;\n - Soit le contexte du lien.\n3. Si c’est le cas pour chaque lien image, **le test est validé**.", "3": "1. Retrouver dans le document les liens composites (lien composé à la fois de contenu texte et d’éléments de type image) ;\n2. Pour chaque lien composite, vérifier que ce qui permet d’en comprendre la fonction et la destination est :\n - Soit l’intitulé du lien seul, fourni par la combinaison du contenu texte et de l’alternative textuelle de l’image ;\n - Soit le contexte du lien.\n3. Si c’est le cas pour chaque lien composite, **le test est validé**.", "4": "1. Retrouver dans le document les liens SVG (élément `<svg>` qui possède un élément `<a>` pourvu d’un attribut `xlink-href` (SVG 1.1) ou `href` (SVG 2)) ;\n2. Pour chaque lien SVG, vérifier que ce qui permet d’en comprendre la fonction et la destination est :\n - Soit l’intitulé du lien seul, fourni par le nom accessible de l’élément `<svg>` (résolu généralement à partir du contenu d’un élément `<text>`) ;\n - Soit le contexte du lien.\n3. Si c’est le cas pour chaque lien SVG, **le test est validé**.", "5": "1. Retrouver dans le document les liens autres que SVG dont le contenu est fourni à la fois par un intitulé visible et par le contenu soit d’un attribut title ou d’un attribut `aria-label` ou d’un attribut `aria-labelledby` ;\n2. Pour chaque lien, vérifier que le contenu de l’attribut `title` ou de l’attribut `aria-label` ou de l’attribut `aria-labelledby` contient l’intitulé visible ;\n3. Si c’est le cas pour chaque lien, **le test est validé** pour les liens autres que SVG.\n4. Retrouver dans le document les liens SVG dont le contenu est fourni à la fois par un intitulé visible et par le contenu soit d’un attribut `aria-labelledby`, ou d’un attribut `aria-label` ou d’un élément title (enfant direct de l’élément `<svg>`) ou d’un attribut x-link:title (SVG 1.1) ou d’un ou plusieurs éléments `<text>`;\n5. Pour chaque lien SVG, vérifier que le contenu de l’attribut `aria-labelledby` ou de l’attribut `aria-label` ou de l’élément `<title>` ou de l’attribut `x-link:title` ou d’un ou plusieurs éléments `<text>` contient l’intitulé visible ;\n6. Si c’est le cas pour chaque lien SVG, **le test est validé** pour les liens SVG.\n7. Si le test est validé à la fois pour les liens non SVG et pour les liens SVG, le test est globalement validé.\n\nNote : considérant la détermination du nom accessible, il existe deux cas particuliers et une particularité liée aux expressions mathématiques :\n\n- La ponctuation et les lettres majuscules présentes dans le texte de l’intitulé visible peuvent être ignorées dans le nom accessible sans porter à conséquence.\n- Si le texte de l’intitulé visible sert de symbole, il ne doit pas être interprété littéralement au niveau du nom accessible. Le nom doit exprimer la fonction véhiculée par le symbole (par exemple, \"B\" au niveau d'un éditeur de texte aura pour nom accessible \"Mettre en gras\", le signe \">\" en fonction du contexte signifiera \"Suivant\" ou \"Lancer la vidéo\"). Le cas des symboles mathématiques fait cependant exception (voir le point ci-dessous).\n- Si l'étiquette visible représente une expression mathématique, les symboles mathématiques peuvent être repris littéralement pour servir d'étiquette au nom accessible (par exemple, \"A>B\"). Il est laissé à l'utilisateur le soin d'opérer la correspondance entre l'expression et ce qu'il doit épeler compte tenu de la connaissance qu'il a du fonctionnement de son logiciel de saisie vocale (\"A plus grand que B\" ou \"A supérieur à B\")." }, "techniques": ["H30", "H78", "H79", "H80", "H81", "G53", "G91", "F63", "F89", "ARIA7", "ARIA8"], "technicalNote": [ "Lorsque l’intitulé visible est complété par une autre expression dans le nom accessible :", "- WCAG insiste sur le placement de l’intitulé visible au début du nom accessible sans toutefois réserver l’exclusivité de cet emplacement ;", "- WCAG considère comme un cas d’échec une correspondance non exacte de la chaîne de caractères de l’intitulé visible au sein du nom accessible.", "Par exemple, si l’on considère l’intitulé visible « Commander maintenant » complété dans le nom accessible par l’expression « produit X », on peut avoir les différents cas suivants :", "- « Commander maintenant produit X » est valide (bonne pratique) ;", "- « Produit X : commander maintenant » est valide ;", "- « Commander produit X maintenant » est non valide." ], "particularCases": [ "Il existe une gestion de cas particuliers pour les tests 6.1.1, 6.1.2, 6.1.3 et 6.1.4 lorsque le lien est [ambigu pour tout le monde](#ambigu-pour-tout-le-monde). Dans cette situation, où il n’est pas possible de rendre le lien explicite dans son contexte, le critère est non applicable.", "Il existe une gestion de cas particuliers pour le test 6.1.5 lorsque :", "- La ponctuation et les lettres majuscules sont présentes dans le texte de l’[intitulé visible](#intitule-visible) : elles peuvent être ignorées dans le nom accessible sans porter à conséquence ;", "- Le texte de l’[intitulé visible](#intitule-visible) sert de symbole : le texte ne doit pas être interprété littéralement au niveau du nom accessible. Le nom doit exprimer la fonction véhiculée par le symbole (par exemple, “B” au niveau d’un éditeur de texte aura pour nom accessible “Mettre en gras”, le signe “>” en fonction du contexte signifiera “Suivant” ou “Lancer la vidéo”). Le cas des symboles mathématiques fait cependant exception (voir la note ci-dessous).", "Note : si l’étiquette visible représente une expression mathématique, les symboles mathématiques peuvent être repris littéralement pour servir d’étiquette au nom accessible (ex. : “A>B”). Il est laissé à l’utilisateur le soin d’opérer la correspondance entre l’expression et ce qu’il doit épeler compte tenu de la connaissance qu’il a du fonctionnement de son logiciel de saisie vocale (“A plus grand que B” ou “A supérieur à B”)." ], "wcag": ["1.1.1", "2.4.4", "2.5.3"], "appliesTo": { "ruleIds": ["pack:rgaa:download-link-format"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment" }, "rules": [ { "id": "pack:rgaa:download-link-format", "tests": ["1", "2", "3", "4", "5"], "effect": "advisory", "rationale": "Non-normative recommendation; it cannot affect the criterion verdict." } ] } }, { "id": "6.2", "theme": 6, "title": { "fr": "Dans chaque page web, chaque [lien](#lien) a-t-il un [intitulé](#intitule-ou-nom-accessible-de-lien) ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque lien a-t-il un intitulé ?" }, "tests": { "1": ["Dans chaque page web, chaque [lien](#lien) a-t-il un [intitulé](#intitule-ou-nom-accessible-de-lien) entre `<a>` et `</a>` ?"] }, "methodology": { "1": "1. Retrouver dans le document les liens quels qu’ils soient ;\n2. Pour chaque lien, vérifier que le contenu de l’élément `<a>` (ou d’un élément pourvu d’un attribut WAI-ARIA `role=link`) contient un intitulé (texte ou alternative) ;\n3. Si c’est le cas pour chaque lien, **le test est validé**." }, "techniques": ["H30", "G91", "F89"], "technicalNote": [ "Une ancre n’est pas un lien même si pendant longtemps l’élément `<a>` a servi de support à cette technique. Elle n’est donc pas concernée par le présent critère." ], "wcag": ["1.1.1", "2.4.4"], "appliesTo": { "ruleIds": ["axe:link-name", "icon-only-control-unnamed", "link-empty-name"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:link-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "icon-only-control-unnamed", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "link-empty-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "7.1", "theme": 7, "title": { "fr": "Chaque [script](#script) est-il, si nécessaire, [compatible avec les technologies d’assistance](#compatible-avec-les-technologies-d-assistance) ?" }, "titlePlain": { "fr": "Chaque script est-il, si nécessaire, compatible avec les technologies d’assistance ?" }, "tests": { "1": [ "Chaque [script](#script) qui génère ou contrôle un [composant d’interface](#composant-d-interface) vérifie-t-il, si nécessaire, une de ces conditions ?", "Le [nom, le rôle, la valeur, le paramétrage et les changements d’états](#le-nom-le-role-la-valeur-le-parametrage-et-les-changements-d-etats) sont accessibles aux technologies d’assistance via une API d’accessibilité ;", "Un [composant d’interface](#composant-d-interface) accessible permettant d’accéder aux mêmes fonctionnalités est présent dans la page ;", "Une [alternative](#alternative-a-script) accessible permet d’accéder aux mêmes fonctionnalités." ], "2": [ "Chaque [script](#script) qui génère ou contrôle un [composant d’interface](#composant-d-interface) respecte-t-il une de ces conditions ?", "Le [composant d’interface](#composant-d-interface) est [correctement restitué](#correctement-restitue-par-les-technologies-d-assistance) par les technologies d’assistance ;", "Une [alternative](#alternative-a-script) accessible permet d’accéder aux mêmes fonctionnalités." ], "3": [ "Chaque [script](#script) qui génère ou contrôle un [composant d’interface](#composant-d-interface) vérifie-t-il ces conditions (hors cas particuliers) ?", "Le composant possède un nom pertinent ;", "Le nom accessible du composant contient au moins l’[intitulé visible](#intitule-visible) ;", "Le composant possède un rôle pertinent." ] }, "methodology": { "1": "1. Retrouver dans le document tous les composants d’interface générés ou contrôlés au moyen de JavaScript ;\n2. Vérifier que :\n - Le composant possède un rôle cohérent avec son usage (généralement un bouton ou un lien) ;\n - Le composant possède un nom explicite ;\n - Le nom du composant est cohérent avec l’état de la fonctionnalité ou des contenus contrôlés (par exemple pour une fonctionnalité permettant d’afficher ou de masquer une zone de contenu).\n3. Sinon, vérifier la présence d’un composant d’interface accessible permettant d’accéder aux mêmes fonctionnalités ;\n4. Sinon, vérifier la présence d’une alternative accessible permettant d’accéder aux mêmes fonctionnalités.\n5. Si c’est le cas, **le test est validé**.", "2": "1. Pour chacun des composants d’interface ayant validé le test 7.1.1, vérifier que le composant d’interface est correctement restitué par les technologies d’assistance ;\n2. Sinon, vérifier qu’une alternative accessible au composant d’interface permet d’accéder aux mêmes fonctionnalités ;\n3. Si c’est le cas, **le test est validé**.", "3": "1. Pour chacun des composants d’interface ayant validé le test 7.1.1, vérifier que le composant d’interface possède :\n - Un nom pertinent (intitulé visible) ;\n - Un rôle pertinent.\n2. Si le composant d’interface possède un nom accessible, vérifier que ce nom est pertinent et contient au moins l’intitulé visible.\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G10", "G135", "G136", "F15", "F19", "F20", "F42", "F59", "F79", "ARIA4", "ARIA5", "ARIA18", "ARIA19", "SCR21"], "technicalNote": [ "Le critère 7.1 implémente la notion de « compatible avec les technologies d’assistance » telle que définie par les WCAG, ainsi que le recours à WAI-ARIA pour rendre un composant ou une fonctionnalité accessible. Le bon usage de WAI-ARIA est vérifié via les tests 7.1.1, 7.1.2, 7.1.3.", "Note importante : dans un environnement HTML5, beaucoup de composants peuvent nécessiter JavaScript pour fonctionner ; en conséquence la fourniture d’une alternative à un composant JavaScript qui ne pourrait pas être rendu accessible devra bénéficier d’une méthode spécifique au composant en cause, permettant de le remplacer par une alternative accessible (et de le réactiver). Cela signifie que la désactivation de JavaScript pour l’ensemble de la page ne sera pas acceptée comme une méthode valable, à moins qu’elle ne remette pas en cause l’utilisation des autres composants." ], "particularCases": [ "Il existe une gestion de cas particuliers pour le test 7.1.3 lorsque :", "- La ponctuation et les lettres majuscules sont présentes dans le texte de l’intitulé visible : elles peuvent être ignorées dans le nom accessible sans porter à conséquence ;", "- Le texte de l’intitulé visible sert de symbole : le texte ne doit pas être interprété littéralement au niveau du nom accessible. Le nom doit exprimer la fonction véhiculée par le symbole (par exemple, “B” au niveau d’un éditeur de texte aura pour nom accessible “Mettre en gras”, le signe “>” en fonction du contexte signifiera “Suivant” ou “Lancer la vidéo”). Le cas des symboles mathématiques fait cependant exception (voir la note ci-dessous).", "Note : si l’étiquette visible représente une expression mathématique, les symboles mathématiques peuvent être repris littéralement pour servir d’étiquette au nom accessible (ex. : “A>B”). Il est laissé à l’utilisateur le soin d’opérer la correspondance entre l’expression et ce qu’il doit épeler compte tenu de la connaissance qu’il a du fonctionnement de son logiciel de saisie vocale (“A plus grand que B” ou “A supérieur à B”)." ], "wcag": ["2.5.3", "4.1.2"], "appliesTo": { "ruleIds": [ "aria-hidden-focusable", "aria-ref-missing-id", "aria-required-children", "axe:aria-allowed-attr", "axe:aria-allowed-role", "axe:aria-hidden-focus", "axe:aria-required-attr", "axe:aria-required-children", "axe:aria-required-parent", "axe:aria-roles", "axe:aria-valid-attr", "axe:aria-valid-attr-value", "axe:button-name", "axe:input-button-name", "axe:nested-interactive", "axe:presentation-role-conflict", "button-empty-name", "cross-prop-drilled-name-lost", "disabled-context-content", "invalid-aria-role", "label-in-name-mismatch", "menuitem-empty-name", "nested-interactive", "presentational-children-focusable", "redundant-aria" ] }, "automation": { "tests": { "1": "static", "2": "judgment", "3": "static" }, "rules": [ { "id": "aria-hidden-focusable", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "aria-ref-missing-id", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "aria-required-children", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-allowed-attr", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-allowed-role", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-hidden-focus", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-required-attr", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-required-children", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-required-parent", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-roles", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-valid-attr", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:aria-valid-attr-value", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:button-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:input-button-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:nested-interactive", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:presentation-role-conflict", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "button-empty-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "cross-prop-drilled-name-lost", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "disabled-context-content", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "invalid-aria-role", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "label-in-name-mismatch", "tests": ["3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "menuitem-empty-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "nested-interactive", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "presentational-children-focusable", "tests": ["1", "2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "redundant-aria", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "7.2", "theme": 7, "title": { "fr": "Pour chaque [script](#script) ayant une [alternative](#alternative-a-script), cette alternative est-elle pertinente ?" }, "titlePlain": { "fr": "Pour chaque script ayant une alternative, cette alternative est-elle pertinente ?" }, "tests": { "1": [ "Chaque [script](#script) débutant par la balise `<script>` et ayant une [alternative](#alternative-a-script) vérifie-t-il une de ces conditions ?", "L’[alternative](#alternative-a-script) entre `<noscript>` et `</noscript>` permet d’accéder à des contenus et des fonctionnalités similaires ;", "La page affichée, lorsque JavaScript est désactivé, permet d’accéder à des contenus et des fonctionnalités similaires ;", "La page alternative permet d’accéder à des contenus et des fonctionnalités similaires ;", "Le langage de script côté serveur permet d’accéder à des contenus et des fonctionnalités similaires ;", "L’alternative présente dans la page permet d’accéder à des contenus et des fonctionnalités similaires." ], "2": [ "Chaque élément non textuel mis à jour par un [script](#script) (dans la page, ou dans un [cadre](#cadre)) et ayant une [alternative](#alternative-a-script) vérifie-t-il ces conditions ?", "L’alternative de l’élément non textuel est mise à jour ;", "L’alternative mise à jour est pertinente." ] }, "methodology": { "1": "1. Retrouver les alternatives aux fonctionnalités JavaScript :\n2. Chercher dans la page, les alternatives à un composant ou une fonctionnalité JavaScript mises à disposition.\n3. Désactiver JavaScript dans le document et retrouver les alternatives proposées.\n4. Pour chacune des alternatives proposées, vérifier qu’elle permet d’accéder aux mêmes contenus et à des fonctionnalités similaires.\n5. Si c’est le cas, **le test est validé**.", "2": "1. Retrouver dans le document tous les éléments non textuels mis à jour par une fonctionnalité JavaScript.\n2. Si l'élément non textuel a une alternative, vérifier que :\n - L'alternative est mise à jour lorsque le contenu non textuel est mis à jour ;\n - L'alternative mise à jour est pertinente.\n3. Si c'est le cas, **le test est validé**." }, "techniques": ["G136", "F19", "F20"], "wcag": ["1.1.1", "4.1.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "7.3", "theme": 7, "title": { "fr": "Chaque [script](#script) est-il [contrôlable par le clavier et par tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque script est-il contrôlable par le clavier et par tout dispositif de pointage (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque élément possédant un gestionnaire d’événement contrôlé par un script vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’élément est [accessible par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) ;", "Un élément [accessible par le clavier et tout dispositif de pointage](#accessible-et-activable-par-le-clavier-et-tout-dispositif-de-pointage) permettant de réaliser la même action est présent dans la page." ], "2": ["Un [script](#script) ne doit pas supprimer le focus d’un élément qui le reçoit. Cette règle est-elle respectée (hors cas particuliers) ?"] }, "methodology": { "1": "1. Retrouver dans le document, tous les éléments sur lesquels est implémenté un gestionnaire d’événements JavaScript (par exemple click, focus, mouseover, blur, keydown, touch…).\n2. Vérifier que l’élément est accessible au moyen du clavier :\n - Il est atteignable avec la touche de tabulation (tab) ;\n - Si l’élément gère une action simple, il est activable au clavier avec la touche entrée (Entrée) ;\n - Si l’élément gère une action complexe, il est utilisable avec le clavier (généralement avec les touches de direction).\n3. Sinon, vérifier qu’un élément accessible par le clavier permettant de réaliser la même action est présent dans la page.\n4. Vérifier que l’élément est accessible par tout dispositif de pointage (souris, toucher, stylet…).\n5. Sinon, vérifier qu’un élément accessible au moyen d’un dispositif de pointage et permettant de réaliser la même action est présent dans la page.\n6. Si c’est le cas, **le test est validé**.", "2": "1. Activer, l’un après l’autre, tous les éléments capables de recevoir le focus.\n2. Vérifier que le focus n’est pas supprimé via une fonctionnalité JavaScript.\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G90", "G202", "F42", "F54", "F55", "SCR2", "SCR20", "SCR29", "SCR35"], "particularCases": [ "Il existe une gestion de cas particuliers lorsque la fonctionnalité dépend de l’utilisation d’un gestionnaire d’événement sans équivalent universel ; par exemple, une application de dessin à main levée ne pourra pas être rendue contrôlable au clavier. Dans ces situations, le critère est non applicable." ], "wcag": ["1.3.1", "2.1.1", "2.4.7"], "appliesTo": { "ruleIds": ["clickable-noninteractive"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "clickable-noninteractive", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "7.4", "theme": 7, "title": { "fr": "Pour chaque [script](#script) qui initie un [changement de contexte](#changement-de-contexte), l’utilisateur est-il averti ou en a-t-il le contrôle ?" }, "titlePlain": { "fr": "Pour chaque script qui initie un changement de contexte, l’utilisateur est-il averti ou en a-t-il le contrôle ?" }, "tests": { "1": [ "Chaque [script](#script) qui initie un [changement de contexte](#changement-de-contexte) vérifie-t-il une de ces conditions ?", "L’utilisateur est averti par un texte de l’action du script et du type de changement avant son déclenchement ;", "Le changement de contexte est initié par un bouton (input de type `submit`, `button` ou `image` ou balise `<button>`) explicite ;", "Le changement de contexte est initié par un lien explicite." ] }, "methodology": { "1": "1. Retrouver dans le document tous les événements JavaScript qui initient un changement de contexte, par exemple :\n - Une mise à jour dynamique de champs de formulaire ;\n - L’ouverture d’une nouvelle page à l’activation d’une option d’une liste de sélection (élément `<select>`) ;\n - La mise à jour, via un procédé AJAX d’une partie essentielle de la page ;\n - Le lancement automatique d’un lecteur vidéo suite à la sélection d’une playlist ;\n - La manipulation du focus ayant pour résultat de modifier la position courante de l’utilisateur dans la page.\n2. Vérifier que :\n - L’utilisateur est averti par un message de l’action du script et du type de changement avant son déclenchement ;\n - Ou bien le changement de contexte est initié par un bouton (input de type submit, button ou image ou la balise button) explicite ;\n - Ou bien le changement de contexte est initié par un lien explicite.\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G13", "G76", "G80", "G107", "H32", "H84", "F9", "F22", "F36", "F37", "F41", "SCR19"], "wcag": ["3.2.1", "3.2.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "7.5", "theme": 7, "title": { "fr": "Dans chaque page web, les [messages de statut](#message-de-statut) sont-ils correctement restitués par les technologies d’assistance ?" }, "titlePlain": { "fr": "Dans chaque page web, les messages de statut sont-ils correctement restitués par les technologies d’assistance ?" }, "tests": { "1": [ "Chaque [message de statut](#message-de-statut) qui informe de la réussite, du résultat d’une action ou bien de l’état d’une application utilise-t-il l’attribut WAI-ARIA `role=\"status\"` ?" ], "2": [ "Chaque [message de statut](#message-de-statut) qui présente une suggestion, ou avertit de l’existence d’une erreur utilise-t-il l’attribut WAI-ARIA `role=\"alert\"` ?" ], "3": [ "Chaque [message de statut](#message-de-statut) qui indique la progression d’un processus utilise-t-il l’un des attributs WAI-ARIA `role=\"log\"`, `role=\"progressbar\"` ou `role=\"status\"` ?" ] }, "methodology": { "1": "1. Retrouver dans le document les messages qui valent pour message de statut.\n2. Pour chacun de ces messages, déterminer la nature de l’information dont est porteur le message :\n3. Si le message informe de la réussite, du résultat d’une action ou bien de l’état d’une application, vérifier que l’élément qui contient le message :\n - Soit utilise l’attribut WAI-ARIA `role=”status”` ;\n - Soit utilise les attributs WAI-ARIA `aria-live=”polite”` et `aria-atomic=”true”`.\n4. Si le message présente une suggestion, ou avertit de l’existence d’une erreur, vérifier que l’élément qui contient le message :\n - Soit utilise l’attribut WAI-ARIA `role=”alert”` ;\n - Soit utilise les attributs `aria-live=”assertive”` et `aria-atomic=”true”`.\n5. Si le message indique la progression d’un processus, vérifier que l’élément qui contient le message :\n - Soit utilise l’un des attributs WAI-ARIA `role=”log”`, `role=”progressbar”` ou `role=”status”` ;\n - Soit utilise l’attribut WAI-ARIA `aria-live=”polite”` si l’intention est de signaler l’équivalent d’un `rôle “log”` ;\n - Soit utilise les attributs WAI-ARIA `aria-live=”polite”` et aria-atomic=”true si l’intention est de signaler l’équivalent d’un rôle “status”.\n6. Si c’est le cas, **le test est validé**.", "2": "Tests identiques à 7.5.1", "3": "Tests identiques à 7.5.1" }, "techniques": ["ARIA19", "ARIA22", "ARIA23"], "technicalNote": [ "Les rôles WAI-ARIA `log`, `status` et `alert` ont implicitement une valeur d’attribut WAI-ARIA `aria-live` et `aria-atomic`. On pourra donc considérer (conformément à la spécification WAI-ARIA 1.1) que :", "- Un attribut WAI-ARIA `aria-live=\"polite\"` associé à un message de statut peut valoir pour un rôle WAI-ARIA `log` ;", "- Un attribut WAI-ARIA `aria-live=\"polite\"` et un attribut WAI-ARIA `aria-atomic=\"true\"` associés à un message de statut peuvent valoir pour un rôle WAI-ARIA `status` ;", "- Un attribut WAI-ARIA `aria-live=\"assertive\"` et un attribut WAI-ARIA `aria-atomic=\"true\"` associés à un message de statut peuvent valoir pour un rôle WAI-ARIA `alert`.", "C’est sous réserve que la nature du message de statut satisfasse bien à la correspondance implicitement établie. Dans le cas d’un message de statut indiquant la progression d’un processus et matérialisé graphiquement par une barre de progression, un rôle WAI-ARIA `progressbar` explicite est nécessaire." ], "wcag": ["4.1.3"], "appliesTo": { "ruleIds": ["dyn-live-region", "live-region-conflict", "status-message-not-assertive"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [ { "id": "dyn-live-region", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "live-region-conflict", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "status-message-not-assertive", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "8.1", "theme": 8, "title": { "fr": "Chaque page web est-elle définie par un [type de document](#type-de-document) ?" }, "titlePlain": { "fr": "Chaque page web est-elle définie par un type de document ?" }, "tests": { "1": ["Pour chaque page web, le [type de document](#type-de-document) (balise `doctype`) est-il présent ?"], "2": ["Pour chaque page web, le [type de document](#type-de-document) (balise `doctype`) est-il valide ?"], "3": [ "Pour chaque page web possédant une déclaration de [type de document](#type-de-document), celle-ci est-elle située avant la balise `<html>` dans le code source ?" ] }, "methodology": { "1": "1. Retrouver dans le document la balise DOCTYPE (par exemple `<!DOCTYPE html>`) ;\n2. Vérifier que :\n - La balise DOCTYPE est placée avant la balise `<html>` ;\n - Le type de document est valide.\n3. Si c’est le cas, **le test est validé**.", "2": "Tests identiques à 8.1.1", "3": "Tests identiques à 8.1.1" }, "techniques": ["G134", "G192"], "wcag": ["4.1.1"], "appliesTo": { "ruleIds": ["pack:rgaa:doctype-missing"] }, "automation": { "tests": { "1": "rendered", "2": "judgment", "3": "judgment" }, "rules": [ { "id": "pack:rgaa:doctype-missing", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "8.2", "theme": 8, "title": { "fr": "Pour chaque page web, le code source généré est-il valide selon le [type de document](#type-de-document) spécifié ?" }, "titlePlain": { "fr": "Pour chaque page web, le code source généré est-il valide selon le type de document spécifié ?" }, "tests": { "1": [ "Pour chaque déclaration de [type de document](#type-de-document), le code source généré de la page vérifie-t-il ces conditions ?", "Les balises, attributs et valeurs d’attributs respectent les [règles d’écriture](#regles-d-ecriture) ;", "L’imbrication des balises est conforme ;", "L’ouverture et la fermeture des balises sont conformes ;", "Les valeurs d’attribut id sont uniques dans la page ;", "Les attributs ne sont pas doublés sur un même élément." ] }, "methodology": { "1": "1. Dans le menu « Check », activer l’option « W3C Nu markup checker (all frames) ».\n2. Dans la page de résultats, vérifier que :\n - Les balises, attributs et valeurs d’attributs respectent les règles d’écriture ;\n - L’imbrication des balises est conforme ;\n - L’ouverture et la fermeture des balises sont conformes ;\n - Les valeurs d’attribut id sont uniques dans la page ;\n - Les attributs ne sont pas doublés sur un même élément.\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["H74", "H93", "H94", "F70", "F77"], "wcag": ["4.1.1", "4.1.2"], "appliesTo": { "ruleIds": ["axe:duplicate-id", "axe:duplicate-id-active", "axe:duplicate-id-aria", "duplicate-attribute", "duplicate-id"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:duplicate-id", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:duplicate-id-active", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:duplicate-id-aria", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "duplicate-attribute", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "duplicate-id", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "8.3", "theme": 8, "title": { "fr": "Dans chaque page web, la [langue par défaut](#langue-par-defaut) est-elle présente ?" }, "titlePlain": { "fr": "Dans chaque page web, la langue par défaut est-elle présente ?" }, "tests": { "1": [ "Pour chaque page web, l’indication de langue par défaut vérifie-t-elle une de ces conditions ?", "L’indication de la langue de la page (attribut `lang` et/ou `xml:lang`) est donnée pour l’élément `html` ;", "L’indication de la langue de la page (attribut `lang` et/ou `xml:lang`) est donnée sur chaque élément de texte ou sur l’un des éléments parents." ] }, "methodology": { "1": "1. Retrouver dans le document l’indication de langue par défaut ;\n2. Vérifier la présence d’une indication de langue :\n - Soit au moyen de l’attribut lang sur la balise html si le code est du HTML5 ou du HTML4 ;\n - Soit au moyen des attributs lang et xml:lang sur la balise html si le code est du XHTML 1.0 ;\n - Soit au moyen de l’attribut xml:lang sur la balise html si le code est du XHTML 1.1 ;\n - Sinon, vérifier la présence d’une indication de langue sur chaque élément de texte ou l’un de ses parents.\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["H57"], "wcag": ["3.1.1"], "appliesTo": { "ruleIds": ["axe:html-has-lang", "document-language-missing", "html-lang-missing"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:html-has-lang", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "document-language-missing", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "html-lang-missing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ], "completeBySilence": true } }, { "id": "8.4", "theme": 8, "title": { "fr": "Pour chaque page web ayant une [langue par défaut](#langue-par-defaut), le [code de langue](#code-de-langue) est-il pertinent ?" }, "titlePlain": { "fr": "Pour chaque page web ayant une langue par défaut, le code de langue est-il pertinent ?" }, "tests": { "1": [ "Pour chaque page web ayant une langue par défaut, le code de langue vérifie-t-il ces conditions ?", "Le code de langue est valide ;", "Le code de langue est pertinent." ] }, "methodology": { "1": "1. Retrouver dans le document l’indication de langue par défaut ;\n2. Vérifier la présence d’un code de langue :\n - Valide (conforme à la norme ISO 639-1 ou ISO 639-2 et suivantes) ;\n - Et pertinent (qui indique la langue principale du document).\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["H57"], "wcag": ["3.1.1"], "appliesTo": { "ruleIds": ["axe:html-lang-valid", "axe:html-xml-lang-mismatch", "html-lang-xml-lang-mismatch", "lang-invalid"] }, "judgment": true, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:html-lang-valid", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:html-xml-lang-mismatch", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "html-lang-xml-lang-mismatch", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "lang-invalid", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "8.5", "theme": 8, "title": { "fr": "Chaque page web a-t-elle un [titre de page](#titre-de-page) ?" }, "titlePlain": { "fr": "Chaque page web a-t-elle un titre de page ?" }, "tests": { "1": ["Chaque page web a-t-elle un [titre de page](#titre-de-page) (balise `<title>`) ?"] }, "methodology": { "1": "Test 8.5.1\n\n1. Retrouver dans le document le titre structuré au moyen d’un élément `<title>` ;\n2. Si c’est le cas, **le test est validé**." }, "techniques": ["G88", "G127", "H25"], "wcag": ["2.4.2"], "appliesTo": { "ruleIds": ["axe:document-title", "title-missing-empty"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:document-title", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "title-missing-empty", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ], "completeBySilence": true } }, { "id": "8.6", "theme": 8, "title": { "fr": "Pour chaque page web ayant un [titre de page](#titre-de-page), ce titre est-il pertinent ?" }, "titlePlain": { "fr": "Pour chaque page web ayant un titre de page, ce titre est-il pertinent ?" }, "tests": { "1": ["Pour chaque page web ayant un [titre de page](#titre-de-page) (balise `<title>`), le contenu de cette balise est-il pertinent ?"] }, "methodology": { "1": "1. Retrouver dans le document le titre structuré au moyen d’un élément `<title>` ;\n2. Vérifier si le contenu de l’élément `<title>` est suffisamment pertinent (il permet de retrouver la page dans l’historique de navigation ou la liste des onglets).\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G88", "G127", "H25"], "wcag": ["2.4.2"], "appliesTo": { "ruleIds": [] }, "judgment": true, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "8.7", "theme": 8, "title": { "fr": "Dans chaque page web, chaque [changement de langue](#changement-de-langue) est-il indiqué dans le code source (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque changement de langue est-il indiqué dans le code source (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, chaque texte écrit dans une langue différente de la [langue par défaut](#langue-par-defaut) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’indication de langue est donnée sur l’élément contenant le texte (attribut `lang` et/ou `xml:lang`) ;", "L’indication de langue est donnée sur un des éléments parents (attribut `lang` et/ou `xml:lang`)" ] }, "methodology": { "1": "1. Retrouver les passages de texte en langue étrangère, à l’exception :\n - Des noms propres ;\n - Des mots d’origine étrangère, présents dans le dictionnaire de la langue du document ;\n - Des mots d’origine étrangère et d’usage courant dont la prononciation ne provoque pas d’incompréhension.\n - Vérifier que chaque passage de texte retenu possède une indication de langue (attribut `lang` et/ou `xml:lang` sur l’élément lui-même ou l’un de ses parents).\n2. Si c’est le cas, **le test est validé**." }, "techniques": ["H58"], "particularCases": [ "Il y a une gestion de cas particuliers sur le changement de langue pour les cas suivants :", "- Nom propre, le critère est non applicable ;", "- Nom commun de langue étrangère présent dans le dictionnaire officiel de la langue (voir note 1 ci-dessous) par défaut de la page web, le critère est non applicable ;", "- Le terme de langue étrangère soumis, via un [champ de formulaire](#champ-de-saisie-de-formulaire) et rappelé dans la page (par exemple comme indication du terme recherché dans le cas d’un moteur de recherche), le critère est non applicable ;", "- Passage de texte dont la langue ne peut pas être déterminée : le critère est non applicable ;", "- Terme ou passage de texte issus d’une langue morte ou imaginaire pour laquelle il n’existe pas d’interprétation vocale : le critère est non applicable.", "Note 1 : le dictionnaire officiel est celui recommandé par l’académie en charge de la langue en question. Pour la France, par exemple, le lien vers le dictionnaire officiel se trouve sur le site de l’Académie française à l’adresse suivante : http://www.academie-francaise.fr/le-dictionnaire/la-9e-edition. Pour toute demande auprès du service du dictionnaire de l’Académie française, utiliser le formulaire de contact du service du dictionnaire.", "Note 2 : pour les noms communs de langue étrangère, absents dans le dictionnaire officiel de la langue par défaut de la page web, et qui sont passés dans le langage commun (exemple : newsletter) : le critère est applicable, uniquement lorsque l’absence d’indication de langue peut provoquer une incompréhension pour la restitution." ], "wcag": ["3.1.2"], "appliesTo": { "ruleIds": ["inline-lang-change-missing"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "inline-lang-change-missing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "8.8", "theme": 8, "title": { "fr": "Dans chaque page web, le code de langue de chaque [changement de langue](#changement-de-langue) est-il valide et pertinent ?" }, "titlePlain": { "fr": "Dans chaque page web, le code de langue de chaque changement de langue est-il valide et pertinent ?" }, "tests": { "1": [ "Pour chaque page web, le code de langue de chaque [changement de langue](#changement-de-langue) vérifie-t-il ces conditions ?", "Le code de langue est valide ;", "Le code de langue est pertinent." ] }, "methodology": { "1": "1. Pour chaque passage de texte validé au test 8.7.1, vérifier que :\n - L’indication de langue est valide ;\n - L’indication de langue est pertinente.\n2. Si c’est le cas, **le test est validé**." }, "techniques": ["H58"], "wcag": ["3.1.2"], "appliesTo": { "ruleIds": ["axe:valid-lang", "lang-invalid"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "axe:valid-lang", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "lang-invalid", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "8.9", "theme": 8, "title": { "fr": "Dans chaque page web, les balises ne doivent pas être utilisées [uniquement à des fins de présentation](#uniquement-a-des-fins-de-presentation). Cette règle est-elle respectée ?" }, "titlePlain": { "fr": "Dans chaque page web, les balises ne doivent pas être utilisées uniquement à des fins de présentation. Cette règle est-elle respectée ?" }, "tests": { "1": [ "Dans chaque page web les balises (à l’exception de `<div>`, `<span>` et `<table>`) ne doivent pas être utilisées [uniquement à des fins de présentation](#uniquement-a-des-fins-de-presentation). Cette règle est-elle respectée ?" ] }, "methodology": { "1": "1. Retrouver dans le document l’ensemble des éléments sémantiques utilisés à des fins de présentation ;\n2. Pour chacun de ces éléments, vérifier que :\n - L’élément est pourvu d’un attribut `role=\"presentation\"` ;\n - L’utilisation de cet élément à des fins de présentation reste justifée.\n3. Si c’est le cas, **le test est validé**.\n\nNote : Quelques exemples, non exhaustifs de détournement de balisage : un élément `<div>` utilisé comme paragraphe, un titre utilisé comme légende, un élément `<blockquote>` ou des paragraphes vides ou encore des espaces utilisés pour créer des effets de marges.\nL'utilisation d'un `role=\"presentation\"` est formellement déconseillée, mais peut toutefois se justifier dans de rares cas. Cela peut être acceptable sur un élément `<blockquote>` ou un paragraphe vide, mais sera considéré comme non-conforme sur un titre.\n\nLe cas des tableaux : à noter que ce test aborde les tableaux de présentation qui ne devraient finalement pas apparaître au sein de la thématique Tableaux." }, "techniques": ["G115", "H88", "F43", "F92"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "8.10", "theme": 8, "title": { "fr": "Dans chaque page web, les changements du [sens de lecture](#sens-de-lecture) sont-ils signalés ?" }, "titlePlain": { "fr": "Dans chaque page web, les changements du sens de lecture sont-ils signalés ?" }, "tests": { "1": [ "Dans chaque page web, chaque texte dont le sens de lecture est différent du [sens de lecture](#sens-de-lecture) par défaut est contenu dans une balise possédant un attribut `dir` ?" ], "2": [ "Dans chaque page web, chaque changement du [sens de lecture](#sens-de-lecture) (attribut `dir`) vérifie-t-il ces conditions ?", "La valeur de l’attribut `dir` est conforme (`rtl` ou `ltr`) ;", "La valeur de l’attribut `dir` est pertinente." ] }, "methodology": { "1": "1. Retrouver dans le document les passages de textes qui utilisent une langue qui se lit dans le sens inverse de la langue du document (comme l’arabe ou l’hébreu pour le français par exemple).\n2. Pour chaque passage de texte, vérifier que le passage de texte est contenu dans une balise qui possède un attribut `dir`.\n3. Si c’est le cas pour chaque passage de texte, **le test est validé**.", "2": "1. Pour chaque passage de texte validé au test 8.10.1, vérifier que :\n - L’indication de sens de lecture est conforme (ltr, pour le sens « de gauche à droite » et rtl pour le sens « de droite à gauche ») ;\n - L’indication de sens de lecture est pertinente.\n2. Si c’est le cas pour chaque passage de texte, **le test est validé**." }, "techniques": ["H56"], "wcag": ["1.3.2"], "appliesTo": { "ruleIds": ["pack:rgaa:dir-value-invalid"] }, "automation": { "tests": { "1": "judgment", "2": "static" }, "rules": [ { "id": "pack:rgaa:dir-value-invalid", "tests": ["2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "9.1", "theme": 9, "title": { "fr": "Dans chaque page web, l’information est-elle structurée par l’utilisation appropriée de [titres](#titre) ?" }, "titlePlain": { "fr": "Dans chaque page web, l’information est-elle structurée par l’utilisation appropriée de titres ?" }, "tests": { "1": [ "Dans chaque page web, la hiérarchie entre les [titres](#titre) (balise `<hx>` ou balise possédant un attribut WAI-ARIA `role=\"heading\"` associé à un attribut WAI-ARIA `aria-level`) est-elle pertinente ?" ], "2": [ "Dans chaque page web, le contenu de chaque [titre](#titre) (balise `<hx>` ou balise possédant un attribut WAI-ARIA `role=\"heading\"` associé à un attribut WAI-ARIA `aria-level`) est-il pertinent ?" ], "3": [ "Dans chaque page web, chaque passage de texte constituant un [titre](#titre) est-il structuré à l’aide d’une balise `<hx>` ou d’une balise possédant un attribut WAI-ARIA `role=\"heading\"` associé à un attribut WAI-ARIA `aria-level` ?" ] }, "methodology": { "1": "1. Retrouver dans le document les titres (balise `<hx>` ou balise possédant un attribut WAI-ARIA `role=\"heading\"` associé à un attribut WAI-ARIA `aria-level`) ;\n2. Vérifier que la hiérarchie entre les titres est pertinente ;\n3. Si c’est le cas, **le test est validé**.", "2": "1. Pour chaque titre identifié au test 9.1.1, vérifier que son contenu est pertinent ;\n2. Si c’est le cas pour chaque titre, **le test est validé**.", "3": "1. Pour chaque titre identifié au test 9.1.1, vérifier que :\n - Soit il est structuré au moyen d’une balise `<hx>` (“x” désignant une valeur numérique comprise entre 1 et 6);\n - Soit il est structuré au moyen d’une balise possédant un attribut WAI-ARIA `role=\"heading\"` et un attribut WAI-ARIA `aria-level=x` (“x” désignant une valeur numérique).\n2. Si c’est le cas pour chaque titre, **le test est validé**." }, "techniques": ["G115", "G130", "H42", "G141", "ARIA4", "ARIA12"], "technicalNote": [ "WAI-ARIA permet de définir des titres via le rôle `heading` et l’attribut `aria-level` (indication du niveau de titre). Bien qu’il soit préférable d’utiliser l’élément de titre natif en HTML `<hx>`, l’utilisation du rôle WAI-ARIA `heading` est compatible avec l’accessibilité." ], "wcag": ["1.3.1", "2.4.1", "2.4.6", "4.1.2"], "appliesTo": { "ruleIds": ["axe:empty-heading", "axe:heading-order", "axe:page-has-heading-one", "empty-heading", "h1-missing", "h1-multiple", "heading-order-skip"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [ { "id": "axe:empty-heading", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:heading-order", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:page-has-heading-one", "tests": ["1", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "empty-heading", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "h1-missing", "tests": ["1", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "h1-multiple", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "heading-order-skip", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "9.2", "theme": 9, "title": { "fr": "Dans chaque page web, la [structure du document](#structure-du-document) est-elle cohérente (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, la structure du document est-elle cohérente (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, la [structure du document](#structure-du-document) vérifie-t-elle ces conditions (hors cas particuliers) ?", "La [zone d’en-tête de la page](#zone-d-en-tete) est structurée via une balise `<header>` ;", "Les [zones de navigation principales et secondaires](#menu-et-barre-de-navigation) sont structurées via une balise `<nav>` ;", "La balise `<nav>` est réservée à la structuration des [zones de navigation principales et secondaires](#menu-et-barre-de-navigation) ;", "La [zone de contenu principal](#zone-de-contenu-principal) est structurée via une balise `<main>` ;", "La [structure du document](#structure-du-document) utilise une balise `<main>` visible unique ;", "La [zone de pied de page](#zone-de-pied-de-page) est structurée via une balise `<footer>`." ] }, "methodology": { "1": "1. Vérifier que la zone d’en-tête est structurée au moyen d’un élément `<header>` ;\n2. Vérifier que les zones de navigation principales et secondaires sont structurées au moyen d’un élément `<nav>` ;\n3. Vérifier que l’élément `<nav>` n’est pas utilisé en dehors de la structuration des zones de navigation principales et secondaires ;\n4. Vérifier que la zone de contenu principal est structurée au moyen d’un élément `<main>` ;\n5. Si le document possède plusieurs éléments `<main>`, vérifier qu’un seul de ces éléments est visible (les autres occurrences de l’élément sont pourvues d’un attribut `hidden`) ;\n6. Vérifier que la zone de pied de page est structurée au moyen d’un élément `<footer>`.\n7. Si c’est le cas pour chaque zone de contenu, **le test est validé**." }, "techniques": ["G115", "ARIA11"], "technicalNote": [ "La balise `<main>` peut être utilisée plusieurs fois dans le même document HTML. Néanmoins, il ne peut y avoir en permanence qu’une seule balise visible et lisible par les technologies d’assistances, les autres devant disposer d’un attribut `hidden` ou d’un style permettant de les masquer aux technologies d’assistances. À noter cependant que l’utilisation d’un style seul restera insuffisante pour assurer l’unicité d’une balise `<main>` visible en cas de désactivation des feuilles de styles." ], "particularCases": ["Lorsque le doctype déclaré dans la page n’est pas le doctype HTML5, ce critère est non applicable."], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["missing-main-landmark", "multiple-main-landmark", "nav-landmark-missing"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "missing-main-landmark", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "multiple-main-landmark", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "nav-landmark-missing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "9.3", "theme": 9, "title": { "fr": "Dans chaque page web, chaque [liste](#listes) est-elle correctement structurée ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque liste est-elle correctement structurée ?" }, "tests": { "1": [ "Dans chaque page web, les informations regroupées visuellement sous forme de [liste](#listes) non ordonnée vérifient-elles une de ces conditions ?", "La liste utilise les balises HTML `<ul>` et `<li>` ;", "La liste utilise les attributs WAI-ARIA `role=\"list\"` et `role=\"listitem\"`." ], "2": [ "Dans chaque page web, les informations regroupées visuellement sous forme de [liste](#listes) ordonnée vérifient-elles une de ces conditions ?", "La liste utilise les balises HTML `<ol>` et `<li>` ;", "La liste utilise les attributs WAI-ARIA `role=\"list\"` et `role=\"listitem\"`." ], "3": [ "Dans chaque page web, les informations regroupées sous forme de [liste](#listes) de description utilisent-elles les balises `<dl>` et `<dt>/<dd>` ?" ] }, "methodology": { "1": "1. Retrouver dans le document les éléments regroupés visuellement sous la forme d’une liste non ordonnée ;\n2. Pour chaque liste, vérifier que la liste est structurée :\n - Soit au moyen des éléments `<ul>` et `<li>` ;\n - Soit au moyen d’éléments pourvus d’attributs WAI-ARIA `role=\"list\"` et `role=\"listitem\"`.\n3. Si c’est le cas pour chaque liste non ordonnée, **le test est validé**.", "2": "1. Retrouver dans le document les éléments regroupés visuellement sous la forme d’une liste ordonnée ;\n2. Pour chaque liste, vérifier que la liste est structurée :\n - Soit au moyen des éléments `<ol>` et `<li>` ;\n - Soit au moyen d’éléments pourvus d’attributs WAI-ARIA `role=\"list\"` et `role=\"listitem\"`.\n3. Si c’est le cas pour chaque liste ordonnée, **le test est validé**.", "3": "1. Retrouver dans le document les éléments regroupés visuellement sous la forme d’une liste de description ;\n2. Pour chaque liste, vérifier que la liste est structurée au moyen des éléments `<dl>`, `<dt>` et `<dd>` ;\n3. Si c’est le cas pour chaque liste de description, **le test est validé**." }, "techniques": ["G115", "G153", "H40", "H48", "F2"], "technicalNote": [ "Les attributs WAI-ARIA `role=\"list\"` et `role=\"listitem\"` peuvent nécessiter l’utilisation des attributs WAI-ARIA `aria-setsize` et `aria-posinset` dans le cas où l’ensemble de la liste n’est pas disponible via le DOM généré au moment de la consultation.", "Les attributs WAI-ARIA `role=\"tree\"`, `role=\"tablist\"`, `role=\"menu\"`, `role=\"combobox\"` et `role=\"listbox\"` ne sont pas équivalents à une liste HTML `<ul>` ou `<ol>`." ], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["axe:definition-list", "axe:dlitem", "axe:list", "axe:listitem", "list-structure"] }, "automation": { "tests": { "1": "static", "2": "static", "3": "static" }, "rules": [ { "id": "axe:definition-list", "tests": ["3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:dlitem", "tests": ["3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:list", "tests": ["1", "2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:listitem", "tests": ["1", "2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "list-structure", "tests": ["1", "2", "3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "9.4", "theme": 9, "title": { "fr": "Dans chaque page web, chaque citation est-elle correctement indiquée ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque citation est-elle correctement indiquée ?" }, "tests": { "1": ["Dans chaque page web, chaque citation courte utilise-t-elle une balise `<q>` ?"], "2": ["Dans chaque page web, chaque bloc de citation utilise-t-il une balise `<blockquote>` ?"] }, "methodology": { "1": "1. Retrouver dans le document les citations courtes (ou en ligne) ;\n2. Pour chaque citation, vérifier que la citation est structurée au moyen d’un élément `<q>` ;\n3. Si c’est le cas pour chaque citation courte, **le test est validé**.", "2": "1. Retrouver dans le document les blocs de citation ;\n2. Pour chaque bloc de citation, vérifier que le bloc de citation est structuré au moyen d’un élément `<blockquote>` ;\n3. Si c’est le cas pour chaque bloc de citation, **le test est validé**." }, "techniques": ["G115", "H49", "F2"], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "10.1", "theme": 10, "title": { "fr": "Dans le site web, des [feuilles de styles](#feuille-de-style) sont-elles utilisées pour contrôler la [présentation de l’information](#presentation-de-l-information) ?" }, "titlePlain": { "fr": "Dans le site web, des feuilles de styles sont-elles utilisées pour contrôler la présentation de l’information ?" }, "tests": { "1": [ "Dans chaque page web, les balises servant à la [présentation de l’information](#presentation-de-l-information) ne doivent pas être présentes dans le code source généré des pages. Cette règle est-elle respectée ?" ], "2": [ "Dans chaque page web, les attributs servant à la [présentation de l’information](#presentation-de-l-information) ne doivent pas être présents dans le code source généré des pages. Cette règle est-elle respectée ?" ], "3": [ "Dans chaque page web, l’utilisation des espaces vérifie-t-elle ces conditions ?", "Les espaces ne sont pas utilisées pour séparer les lettres d’un mot ;", "Les espaces ne sont pas utilisées pour simuler des tableaux ;", "Les espaces ne sont pas utilisées pour simuler des colonnes de texte." ] }, "methodology": { "1": "1. Vérifier l’absence des éléments de présentation `<basefont>`, `<big>`, `<blink>`, `<center>`, `<font>`, `<marquee>`, `<s>`, `<strike>`, `<tt>` ;\n2. Vérifier l’absence de l’élément `<u>` uniquement si le DOCTYPE du document ne correspond pas à HTML 5 ;\n3. Si c’est le cas, **le test est validé**.", "2": "1. Vérifier l’absence des attributs de présentation : `align`, `alink`, `background`, `bgcolor`, `border`, `cellpadding`, `cellspacing`, `char`, `charoff`, `clear`, `color`, `compact`, `frameborder`, `hspace`, `link`, `marginheight`, `marginwidth`, `text`, `valign`, `vlink`, `vspace`, `size`(exception faite de l'élément `<select>`), `width` (exception faite des éléments `<img>`, `<object>`, `<embed>`, `<canvas>` et `<svg>`), `height` (exception faite des éléments `<img>`, `<object>`, `<embed>`, `<canvas>` et `<svg>`) ;\n2. Si c’est le cas, **le test est validé**.", "3": "1. Désactiver les styles (CSS) du document ;\n2. Vérifier l’absence d’espaces utilisées :\n - Entre les lettres d’un mot ;\n - Pour créer des effets de marges ou d’alignement ;\n - Pour simuler des tableaux ou des colonnes.\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G140", "F32", "F33", "F34", "F48", "C6", "C8", "C18", "C22"], "wcag": ["1.3.1", "1.3.2"], "appliesTo": { "ruleIds": ["presentational-attribute", "presentational-element", "presentational-spacing"] }, "automation": { "tests": { "1": "static", "2": "static", "3": "static" }, "rules": [ { "id": "presentational-attribute", "tests": ["2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "presentational-element", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "presentational-spacing", "tests": ["3"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "10.2", "theme": 10, "title": { "fr": "Dans chaque page web, le [contenu visible](#contenu-visible) porteur d’information reste-t-il présent lorsque les [feuilles de styles](#feuille-de-style) sont désactivées ?" }, "titlePlain": { "fr": "Dans chaque page web, le contenu visible porteur d’information reste-t-il présent lorsque les feuilles de styles sont désactivées ?" }, "tests": { "1": ["Dans chaque page web, l’information reste-t-elle présente lorsque les [feuilles de styles](#feuille-de-style) sont désactivées ?"] }, "methodology": { "1": "1. Désactiver les styles (CSS) du document ;\n2. Comparer le document dépourvu de styles avec le document mis en forme ;\n3. Vérifier si dans le document dépourvu de styles, les contenus visibles porteurs d'information restent présents ;\n4. Si c’est le cas, **le test est validé**." }, "techniques": ["G140", "F3", "F87"], "wcag": ["1.1.1", "1.3.1"], "appliesTo": { "ruleIds": ["css-generated-content-informative"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "css-generated-content-informative", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.3", "theme": 10, "title": { "fr": "Dans chaque page web, l’information reste-t-elle [compréhensible](#comprehensible-ordre-de-lecture) lorsque les [feuilles de styles](#feuille-de-style) sont désactivées ?" }, "titlePlain": { "fr": "Dans chaque page web, l’information reste-t-elle compréhensible lorsque les feuilles de styles sont désactivées ?" }, "tests": { "1": [ "Dans chaque page web, l’information reste-t-elle [compréhensible](#comprehensible-ordre-de-lecture) lorsque les [feuilles de styles](#feuille-de-style) sont désactivées ?" ] }, "methodology": { "1": "1. Désactiver les styles (CSS) du document ;\n2. Vérifier que l’ordre dans lequel les contenus sont implémentés ne pose pas de problème de compréhension ;\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G59", "G140", "F1"], "wcag": ["1.3.2", "2.4.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "10.4", "theme": 10, "title": { "fr": "Dans chaque page web, le texte reste-t-il lisible lorsque la [taille des caractères](#taille-des-caracteres) est augmentée jusqu’à 200 %, au moins (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, le texte reste-t-il lisible lorsque la taille des caractères est augmentée jusqu’à 200 %, au moins (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, l’augmentation de la [taille des caractères](#taille-des-caracteres) jusqu’à 200 %, au moins, ne doit pas provoquer de perte d’information. Cette règle est-elle respectée selon une de ces conditions (hors cas particuliers) ?", "Lors de l’utilisation de la fonction d’agrandissement du texte du navigateur ;", "Lors de l’utilisation des fonctions de zoom graphique du navigateur ;", "Lors de l’utilisation d’un [composant d’interface](#composant-d-interface) propre au site permettant d’agrandir le texte ou de zoomer." ], "2": [ "Dans chaque page web, l’augmentation de la taille des caractères jusqu’à 200 %, au moins, doit être possible pour l’ensemble du texte dans la page. Cette règle est-elle respectée selon une de ces conditions (hors cas particuliers) ?", "Lors de l’utilisation de la fonction d’agrandissement du texte du navigateur ;", "Lors de l’utilisation des fonctions de zoom graphique du navigateur ;", "Lors de l’utilisation d’un [composant d’interface](#composant-d-interface) propre au site permettant d’agrandir le texte ou de zoomer." ] }, "methodology": { "1": "1. Vérifier dans le document si les textes restent présents et lisibles lorsque :\n - Le zoom texte du navigateur est réglé à 200 % ;\n - Le zoom graphique du navigateur est réglé à 200 % ;\n - Les fonctionnalités de zoom personnalisées proposé par le document sont utilisés.\n2. Si c’est le cas, **le test est validé**.", "2": "1. Vérifier dans le document si les textes sont effectivement agrandis lorsque :\n - Le zoom texte du navigateur est réglé à 200 % ;\n - Le zoom graphique du navigateur est réglé à 200 % ;\n - Les fonctionnalités de zoom personnalisées proposé par le document sont utilisés.\n2. Si c’est le cas, **le test est validé**." }, "techniques": ["G146", "G179", "F69", "F80", "SCR34", "C12", "C13", "C14", "C17", "C28"], "particularCases": [ "Font exception à ce critère, les contenus pour lesquels l’utilisateur n’a pas de possibilité de personnalisation :", "- Les sous-titres incrustés dans une vidéo ;", "- Les textes en image ;", "- Le texte au sein d’une balise `<canvas>`." ], "wcag": ["1.4.4"], "appliesTo": { "ruleIds": ["axe:meta-viewport", "axe:meta-viewport-large", "dyn-input-overflow-zoom", "dyn-reflow-zoom", "meta-viewport-zoom-block"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "axe:meta-viewport", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:meta-viewport-large", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "dyn-input-overflow-zoom", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "dyn-reflow-zoom", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "meta-viewport-zoom-block", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.5", "theme": 10, "title": { "fr": "Dans chaque page web, les déclarations CSS de couleurs de fond d’élément et de police sont-elles correctement utilisées ?" }, "titlePlain": { "fr": "Dans chaque page web, les déclarations CSS de couleurs de fond d’élément et de police sont-elles correctement utilisées ?" }, "tests": { "1": [ "Dans chaque page web, chaque déclaration CSS de couleurs de police (`color`), d’un élément susceptible de contenir du texte, est-elle accompagnée d’une déclaration de couleur de fond (`background`, `background-color`), au moins, héritée d’un parent ?" ], "2": [ "Dans chaque page web, chaque déclaration de couleur de fond (`background`, `background-color`), d’un élément susceptible de contenir du texte, est-elle accompagnée d’une déclaration de couleur de police (`color`) au moins, héritée d’un parent ?" ], "3": [ "Dans chaque page web, chaque utilisation d’une image pour créer une couleur de fond d’un élément susceptible de contenir du texte, via CSS (`background`, `background-image`), est-elle accompagnée d’une déclaration de couleur de fond (`background`, `background-color`), au moins, héritée d’un parent ?" ] }, "methodology": { "1": "1. Retrouver dans le document les textes mis en couleur, à l’exception des couleurs par défaut (par exemple les liens, etc.) ;\n2. Déterminer l’élément qui contient le texte et vérifier la présence d’une valeur calculée pour la propriété `background-color` de l’élément ;\n3. Si c’est le cas, **le test est validé**.", "2": "1. Retrouver dans le document les textes mis en couleur, à l’exception des couleurs par défaut (par exemple les liens, etc.) ;\n2. Déterminer l’élément qui contient le texte et vérifier la présence d’une valeur calculée pour la propriété `color` de l’élément ;\n3. Si c’est le cas, **le test est validé**.", "3": "1. Retrouver dans le document les textes dont l’arrière-plan est constitué d’une image (propriété background-image) ;\n2. Déterminer l’élément qui contient le texte et vérifier que si l’image d’arrière-plan est absente, le texte reste lisible ;\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["F24"], "wcag": ["1.4.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "10.6", "theme": 10, "title": { "fr": "Dans chaque page web, chaque [lien dont la nature n’est pas évidente](#lien-dont-la-nature-n-est-pas-evidente) est-il visible par rapport au texte environnant ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque lien dont la nature n’est pas évidente est-il visible par rapport au texte environnant ?" }, "tests": { "1": [ "Dans chaque page web, chaque [lien texte](#lien-texte) signalé uniquement par la couleur, et dont la nature n’est pas évidente, vérifie-t-il ces conditions ?", "La couleur du lien a un rapport de [contraste](#contraste) supérieur ou égal à 3:1 par rapport au texte environnant ;", "Le lien dispose d’une indication visuelle au survol autre qu’un changement de couleur ;", "Le lien dispose d’une indication visuelle au focus autre qu’un changement de couleur." ] }, "methodology": { "1": "1. Retrouver dans le document les éléments de type lien (élément `<a>` ou élément pourvu d’un attribut WAI-ARIA `role=\"link\"`) ;\n2. Pour chaque élément de type lien, s’il peut être confondu avec un texte normal lorsqu’il est signalé uniquement par la couleur, vérifier que le contraste entre la couleur de police du lien et la couleur de police du texte environnant est de 3:1, au moins ;\n3. Cette vérification doit être faite pour les différents états du lien s’ils sont présentés au moyen d’une couleur différente : l’état non visité, l’état visité, l’état activé, l’état au survol et l’état à la prise de focus ;\n4. Si c’est le cas pour chaque élément de type lien, **le test est validé**." }, "techniques": ["G183", "F73"], "wcag": ["1.4.1"], "appliesTo": { "ruleIds": ["rendered-link-colour-only"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "rendered-link-colour-only", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.7", "theme": 10, "title": { "fr": "Dans chaque page web, pour chaque élément recevant le focus, la [prise de focus](#prise-de-focus) est-elle visible ?" }, "titlePlain": { "fr": "Dans chaque page web, pour chaque élément recevant le focus, la prise de focus est-elle visible ?" }, "tests": { "1": [ "Pour chaque élément recevant le focus, la [prise de focus](#prise-de-focus) vérifie-t-elle une de ces conditions ?", "Le style du focus natif du navigateur n’est pas supprimé ou dégradé ;", "Un style du focus défini par l’auteur est visible." ] }, "methodology": { "1": "1. Retrouver dans le document les éléments susceptibles de recevoir le focus (les éléments d’interface tels que les liens ou les contrôles de formulaire, ainsi que tout élément pourvu d’un attribut `tabindex` d’une valeur égale ou supérieure à 1) ;\n2. Pour chaque élément susceptible de recevoir le focus, vérifier que l’indication visuelle de la prise de focus est présente (en agissant sur le contour ou le fond ou les deux) et est suffisamment contrastée (ratio de contraste égal ou supérieur à 3:1) ;\n3. Si c’est le cas pour chaque élément susceptible de recevoir le focus, **le test est validé**." }, "techniques": ["G149", "G165", "G183", "G195", "F73", "F78", "SCR31", "C15"], "wcag": ["1.4.1", "2.4.7"], "appliesTo": { "ruleIds": ["dyn-focus-visible", "rendered-focus-not-visible"] }, "automation": { "tests": { "1": "rendered" }, "rules": [ { "id": "dyn-focus-visible", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "rendered-focus-not-visible", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.8", "theme": 10, "title": { "fr": "Pour chaque page web, les [contenus cachés](#contenu-cache) ont-ils vocation à être ignorés par les technologies d’assistance ?" }, "titlePlain": { "fr": "Pour chaque page web, les contenus cachés ont-ils vocation à être ignorés par les technologies d’assistance ?" }, "tests": { "1": [ "Dans chaque page web, chaque contenu caché vérifie-t-il une de ces conditions ?", "Le [contenu caché](#contenu-cache) a vocation à être ignoré par les technologies d’assistance ;", "Le [contenu caché](#contenu-cache) n’a pas vocation à être ignoré par les technologies d’assistance et est rendu restituable par les technologies d’assistance suite à une action de l’utilisateur réalisable au clavier ou par tout dispositif de pointage sur un élément précédent le contenu caché ou suite à un repositionnement du focus dessus." ] }, "methodology": { "1": "1. Retrouver les contenus cachés (éléments pourvus de l’attribut hidden ou de l’attribut WAI-ARIA aria-hidden, ou bien d’une classe ou d’un ensemble de styles CSS susceptibles de masquer le contenu).\n2. Pour chaque contenu caché, vérifier que :\n - Soit le contenu caché a vocation à être ignoré par les technologies d’assistance (un élément statistique de visites par exemple) ;\n - Soit le contenu caché n’a pas vocation à être ignoré par les technologies d’assistance, et dans ce cas il est rendu restituable par les technologies d’assistance au moyen :\n - Soit d’une action de l’utilisateur réalisable au clavier ou par tout dispositif de pointage sur un élément précédent le contenu caché ;\n - Soit d’une fonction de programmation qui repositionne le focus sur le contenu.\n3. Si c’est le cas pour chaque contenu caché, **le test est validé**." }, "techniques": ["G57"], "technicalNote": [ "WAI-ARIA propose un attribut `aria-hidden` (`true` ou `false`) qui permet d’inhiber la restitution d’un contenu en direction des technologies d’assistance, sans action sur sa visibilité en direction des agents utilisateurs : un contenu avec `aria-hidden=\"true\"` ne sera donc plus vocalisable, mais restera visible.", "Sauf si le contenu contrôlé par `aria-hidden` n’a pas vocation à être restitué par les technologies d’assistance, la valeur de l’attribut `aria-hidden` doit être cohérente avec l’état affiché ou masqué du contenu à l’écran.", "La spécification HTML5 propose un attribut `hidden` qui permet de rendre indisponible (quand l’attribut `hidden` est présent) un contenu dans le DOM généré (de manière similaire au `type=\"hidden\"` sur un contrôle de formulaire).", "Il est possible d’avoir des situations où un contenu contrôlé par `hidden` ou `aria-hidden` se trouve momentanément dans un état incohérent avec le statut affiché ou masqué du contenu, par exemple si l’on désire rendre disponible un élément, mais que son affichage à l’écran reste dépendant d’une action ultérieure. Dans ce cas, c’est l’état final du contenu qui doit être considéré." ], "wcag": ["1.3.2", "4.1.2"], "appliesTo": { "ruleIds": ["disabled-context-content"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "disabled-context-content", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.9", "theme": 10, "title": { "fr": "Dans chaque page web, l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle respectée ?" }, "titlePlain": { "fr": "Dans chaque page web, l’information ne doit pas être donnée uniquement par la forme, taille ou position. Cette règle est-elle respectée ?" }, "tests": { "1": [ "Dans chaque page web, pour chaque texte ou ensemble de textes, l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle respectée ?" ], "2": [ "Dans chaque page web, pour chaque image ou ensemble d’images, l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle respectée ?" ], "3": [ "Dans chaque page web, pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise), l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle respectée ?" ], "4": [ "Dans chaque page web, pour chaque [média non temporel](#media-non-temporel), l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle respectée ?" ] }, "methodology": { "1": "1. Retrouver dans le document les informations d’un texte données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier qu’il existe un autre moyen de récupérer cette information ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "2": "1. Retrouver dans le document les informations d’une image données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier qu’il existe un autre moyen de récupérer cette information ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "3": "1. Retrouver dans le document les informations d’un média temporel données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier qu’il existe un autre moyen de récupérer cette information ;\n3. Si c’est le cas pour chaque information, **le test est validé**.", "4": "1. Retrouver dans le document les informations d’un média non temporel données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier qu’il existe un autre moyen de récupérer cette information ;\n3. Si c’est le cas pour chaque information, **le test est validé**." }, "techniques": ["G96", "G140", "F14", "F26"], "wcag": ["1.3.3", "1.4.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment" }, "rules": [] } }, { "id": "10.10", "theme": 10, "title": { "fr": "Dans chaque page web, l’information ne doit pas être donnée [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position) uniquement. Cette règle est-elle implémentée de façon pertinente ?" }, "titlePlain": { "fr": "Dans chaque page web, l’information ne doit pas être donnée par la forme, taille ou position uniquement. Cette règle est-elle implémentée de façon pertinente ?" }, "tests": { "1": [ "Dans chaque page web, pour chaque texte ou ensemble de textes, l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle implémentée de façon pertinente ?" ], "2": [ "Dans chaque page web, pour chaque image ou ensemble d’images, l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle implémentée de façon pertinente ?" ], "3": [ "Dans chaque page web, pour chaque [média temporel](#media-temporel-type-son-video-et-synchronise), l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle implémentée de façon pertinente ?" ], "4": [ "Dans chaque page web, pour chaque [média non temporel](#media-non-temporel), l’information ne doit pas être donnée uniquement [par la forme, taille ou position](#indication-donnee-par-la-forme-la-taille-ou-la-position). Cette règle est-elle implémentée de façon pertinente ?" ] }, "methodology": { "1": "1. Retrouver dans le document les informations d’un texte données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier que le moyen alternatif de récupérer cette information est pertinent, c’est-à-dire qu’il permet de transmettre l’information dans tous les contextes de consultation et pour tous les utilisateurs.\n3. Si c’est le cas pour chaque information, **le test est validé**.", "2": "1. Retrouver dans le document les informations d’une image données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier que le moyen alternatif de récupérer cette information est pertinent, c’est-à-dire qu’il permet de transmettre l’information dans tous les contextes de consultation et pour tous les utilisateurs.\n3. Si c’est le cas pour chaque information, **le test est validé**.", "3": "1. Retrouver dans le document les informations d’un média temporel données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier que le moyen alternatif de récupérer cette information est pertinent, c’est-à-dire qu’il permet de transmettre l’information dans tous les contextes de consultation et pour tous les utilisateurs.\n3. Si c’est le cas pour chaque information, **le test est validé**.", "4": "1. Retrouver dans le document les informations d’un média non temporel données par la forme, la taille ou la position ;\n2. Pour chaque information donnée par la forme, la taille ou la position, vérifier que le moyen alternatif de récupérer cette information est pertinent, c’est-à-dire qu’il permet de transmettre l’information dans tous les contextes de consultation et pour tous les utilisateurs.\n3. Si c’est le cas pour chaque information, **le test est validé**." }, "techniques": ["G96", "G140", "F14", "F26"], "wcag": ["1.3.3", "1.4.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment" }, "rules": [] } }, { "id": "10.11", "theme": 10, "title": { "fr": "Pour chaque page web, les contenus peuvent-ils être présentés sans perte d’information ou de fonctionnalité et sans avoir recours soit à un défilement vertical pour une fenêtre ayant une hauteur de 256 px, soit à un défilement horizontal pour une fenêtre ayant une largeur de 320 px (hors cas particuliers) ?" }, "titlePlain": { "fr": "Pour chaque page web, les contenus peuvent-ils être présentés sans perte d’information ou de fonctionnalité et sans avoir recours soit à un défilement vertical pour une fenêtre ayant une hauteur de 256 px, soit à un défilement horizontal pour une fenêtre ayant une largeur de 320 px (hors cas particuliers) ?" }, "tests": { "1": [ "Pour chaque page web, lorsque le contenu dont le sens de lecture est horizontal est affiché dans une fenêtre réduite à une largeur de 320 px, l’ensemble des informations et des fonctionnalités sont-elles disponibles sans aucun défilement horizontal (hors cas particuliers) ?" ], "2": [ "Pour chaque page web, lorsque le contenu dont le sens de lecture est vertical est affiché dans une fenêtre réduite à une hauteur de 256 px, l’ensemble des informations et des fonctionnalités sont-elles disponibles sans aucun défilement vertical (hors cas particuliers) ?" ] }, "methodology": { "1": "1. Retrouver dans le document si son contenu est conçu pour défiler verticalement (le sens de lecture du texte est horizontal), les informations et fonctionnalités ;\n2. Réduire la fenêtre d’affichage à une largeur de 320 px et vérifier que les informations et les fonctionnalités restent disponibles sans aucun défilement horizontal ;\n3. Si c’est le cas, **le test est validé**.", "2": "1. Retrouver dans le document si son contenu est conçu pour défiler horizontalement (le sens de lecture du texte est vertical), les informations et fonctionnalités ;\n2. Réduire la fenêtre d’affichage à une hauteur de 256 px et vérifier que les informations et les fonctionnalités restent disponibles sans aucun défilement vertical ;\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["C34", "C37"], "technicalNote": ["Lorsqu'il est ici question de pixel, il s'agit du pixel CSS tel que défini par le W3C https://www.w3.org/TR/css3-values/"], "particularCases": [ "L'objectif de ce critère est de garantir un défilement dans une unique direction pour une lecture facilitée selon le sens de l'écriture.", "Font exception à ce critère, les contenus dont l'agencement requiert deux dimensions pour être compris ou utilisés comme :", "- Les images, les graphiques ou les vidéos ;", "- Les jeux (jeux de plateforme, par exemple) ;", "- Les présentations (type diaporama, par exemple) ;", "- Les tableaux de données ;", "- Les interfaces où il est nécessaire d'avoir un ascenseur horizontal lors de la manipulation de l'interface.", "Note : la majorité des navigateurs sur les systèmes d'exploitation sur mobile (Android, iOS) ne gère pas correctement la redistribution en cas de zoom. Dans ce contexte, le critère sera considéré comme non applicable sur ces environnements." ], "wcag": ["1.4.10"], "appliesTo": { "ruleIds": ["dyn-input-overflow-reflow", "dyn-reflow"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "dyn-input-overflow-reflow", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "dyn-reflow", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.12", "theme": 10, "title": { "fr": "Dans chaque page web, les propriétés d’espacement du texte peuvent-elles être redéfinies par l’utilisateur sans perte de contenu ou de fonctionnalité (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, les propriétés d’espacement du texte peuvent-elles être redéfinies par l’utilisateur sans perte de contenu ou de fonctionnalité (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, le texte reste-t-il lisible lorsque l’affichage est modifié selon ces conditions (hors cas particuliers) ?", "L’espacement entre les lignes (`line-height`) est augmenté jusqu’à 1,5 fois la taille de la police ;", "L’espacement suivant les paragraphes (balise `<p>`) est augmenté jusqu’à 2 fois la taille de la police ;", "L’espacement des lettres (`letter-spacing`) est augmenté jusqu’à 0,12 fois la taille de la police ;", "L’espacement des mots (`word-spacing`) est augmenté jusqu’à 0,16 fois la taille de la police." ] }, "methodology": { "1": "1. Modifier les styles du document en donnant :\n - Une valeur de 1.5 à la propriété `line-height` de tous les éléments du document ;\n - Une valeur de 2em à la propriété `margin-bottom` des éléments `<p>` ;\n - Une valeur de 0.12em à la propriété `letter-spacing` de tous les éléments du document ;\n - Une valeur de 0.16em à la propriété `word-spacing` de tous les éléments du document ;\n2. Pour chaque passage de texte, vérifier qu’il reste lisible, à l’exception :\n - Des sous-titres directement intégrés à une vidéo ;\n - Des images texte ;\n - Des textes au sein d’une balise `<canvas>`.\n3. Si c’est le cas pour chaque passage de texte, **le test est validé**.\n\nNote : une implémentation de ces règles de modification est disponible dans les ressources du critère de succès WCAG 1.4.12 (https://github.com/alastc/adaptation-scripts/blob/master/scripts/text-adaptation.js)." }, "techniques": ["C8", "C21", "C35", "C36"], "particularCases": [ "Font exception à ce critère, les contenus pour lesquels l’utilisateur n’a pas de possibilité de personnalisation :", "- Les sous-titres directement intégrés à une vidéo ;", "- Les images texte ;", "- Le texte au sein d’une balise `<canvas>`." ], "wcag": ["1.4.12"], "appliesTo": { "ruleIds": ["dyn-input-overflow-spacing", "dyn-text-spacing", "letter-spacing-important", "line-height-important", "word-spacing-important"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "dyn-input-overflow-spacing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "dyn-text-spacing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "letter-spacing-important", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "line-height-important", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "word-spacing-important", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "10.13", "theme": 10, "title": { "fr": "Dans chaque page web, les contenus additionnels apparaissant à la prise de focus ou au survol d’un [composant d’interface](#composant-d-interface) sont-ils contrôlables par l’utilisateur (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, les contenus additionnels apparaissant à la prise de focus ou au survol d’un composant d’interface sont-ils contrôlables par l’utilisateur (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque contenu additionnel devenant visible à la prise de focus ou au survol d’un [composant d’interface](#composant-d-interface) peut-il être masqué par une action de l’utilisateur sans déplacer le focus ou le pointeur de la souris (hors cas particuliers) ?" ], "2": [ "Chaque contenu additionnel qui apparait au survol d’un [composant d’interface](#composant-d-interface) peut-il être survolé par le pointeur de la souris sans disparaître (hors cas particuliers) ?" ], "3": [ "Chaque contenu additionnel qui apparaît à la prise de focus ou au survol d’un [composant d’interface](#composant-d-interface) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "Le contenu additionnel reste visible jusqu’à ce que l’utilisateur retire le pointeur souris ou le focus du contenu additionnel et du [composant d’interface](#composant-d-interface) ayant déclenché son apparition ;", "Le contenu additionnel reste visible jusqu’à ce que l’utilisateur déclenche une action masquant ce contenu sans déplacer le focus ou le pointeur de la souris du [composant d’interface](#composant-d-interface) ayant déclenché son apparition ;", "Le contenu additionnel reste visible jusqu’à ce qu’il ne soit plus valide." ] }, "methodology": { "1": "1. Retrouver dans le document les contenus additionnels devenant visible à la prise de focus ou au survol d’un composant d’interface, à l’exception :\n - Des contenus additionnels contrôlés par l’agent utilisateur (par exemple, les infobulles associées à l’attribut `title` ou à la validation native d’un formulaire ;\n - Des contenus additionnels devenant visibles par une activation de l’utilisateur (par exemple, une fenêtre de dialogue).\n2. Pour chaque contenu additionnel, vérifier que :\n - Soit le contenu additionnel est positionné de façon à ce qu’il ne gêne pas la consultation des autres contenus informatifs sur lesquels il viendrait se superposer (y compris le composant d’interface qui a déclenché son apparition), quelles que soient les conditions de consultation (y compris lors de l’utilisation d’un mécanisme de zoom) ;\n - Soit un mécanisme (au clavier) permet de faire disparaître le contenu additionnel (par exemple, la touche Echap).\n3. Si c’est le cas pour chaque contenu additionnel, **le test est validé**.", "2": "1. Retrouver dans le document les contenus additionnels devenant visible au survol d’un composant d’interface, à l’exception :\n - Des contenus additionnels contrôlés par l’agent utilisateur (par exemple, les infobulles associées à l’attribut title ou à la validation native d’un formulaire) ;\n - Des contenus additionnels devenant visibles par une activation de l’utilisateur (par exemple, une fenêtre de dialogue).\n2. Pour chaque contenu additionnel, vérifier qu’il peut être survolé par le pointeur de la souris sans disparaître ;\n3. Si c’est le cas pour chaque contenu additionnel, **le test est validé**.", "3": "1. Retrouver dans le document les contenus additionnels devenant visible à la prise de focus ou au survol d’un composant d’interface, à l’exception :\n - Des contenus additionnels contrôlés par l’agent utilisateur (par exemple, les infobulles associées à l’attribut `title` ou à la validation native d’un formulaire) ;\n - Des contenus additionnels devenant visibles par une activation de l’utilisateur (par exemple, une fenêtre de dialogue).\n2. Pour chaque contenu additionnel, vérifier qu’il reste visible :\n - Jusqu’à ce que l’utilisateur retire le pointeur souris ou le focus du contenu additionnel ou du composant d’interface ayant déclenché son apparition ;\n - Jusqu’à ce l’utilisateur déclenche le mécanisme prévu pour faire disparaître le contenu additionnel ;\n - Jusqu’à ce que l’information proposée par le contenu additionnel ne soit plus valide (par exemple un contenu additionnel signalant l’état “occupé” du composant d’interface que l’utilisateur souhaite activer ou encore un message d’erreur signalé sous la forme d’un contenu additionnel tant que l’utilisateur n’a pas rectifié sa saisie).\n3. Si c’est le cas pour chaque contenu additionnel, **le test est validé**." }, "techniques": ["F95"], "particularCases": [ "Lorsque le contenu additionnel est contrôlé par l’agent utilisateur (par exemple, attribut `title` ou validation native de formulaire) ou correspond à une fenêtre modale conforme au [motif de conception](#motif-de-conception) WAI-ARIA `dialog`, le critère 10.13 est non applicable.", "Lorsque le contenu additionnel ne masque ou ne remplace aucun contenu porteur d’information, le test 10.13.1 est non applicable." ], "wcag": ["1.4.13"], "appliesTo": { "ruleIds": ["dyn-hover"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [ { "id": "dyn-hover", "tests": ["1", "2", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "10.14", "theme": 10, "title": { "fr": "Dans chaque page web, les contenus additionnels apparaissant via les styles CSS uniquement peuvent-ils être rendus visibles au clavier et par tout dispositif de pointage ?" }, "titlePlain": { "fr": "Dans chaque page web, les contenus additionnels apparaissant via les styles CSS uniquement peuvent-ils être rendus visibles au clavier et par tout dispositif de pointage ?" }, "tests": { "1": [ "Dans chaque page web, les contenus additionnels apparaissant au survol d’un [composant d’interface](#composant-d-interface) via les styles CSS respectent-ils si nécessaire une de ces conditions ?", "Les contenus additionnels apparaissent également à l’activation du composant via le clavier et tout dispositif de pointage ;", "Les contenus additionnels apparaissent également à la prise de focus du composant ;", "Les contenus additionnels apparaissent également par le biais de l’activation ou de la prise de focus d’un autre composant." ], "2": [ "Dans chaque page web, les contenus additionnels apparaissant au focus d’un [composant d’interface](#composant-d-interface) via les styles CSS respectent-ils si nécessaire une de ces conditions ?", "Les contenus additionnels apparaissent également à l’activation du composant via le clavier et tout dispositif de pointage ;", "Les contenus additionnels apparaissent également au survol du composant ;", "Les contenus additionnels apparaissent également par le biais de l’activation ou du survol d’un autre composant." ] }, "methodology": { "1": "1. Retrouver dans le document les contenus additionnels devenant visible au survol d’un composant d’interface au moyen d’un mécanisme CSS (`pseudo-classe :hover`) ;\n2. Pour chaque contenu additionnel, vérifier que les contenus additionnels apparaissent également :\n - À l’activation du composant au moyen du clavier ou de tout autre dispositif de pointage ;\n - À la prise de focus du composant ;\n - À l’activation ou à la prise de focus d’un autre composant.\n3. Si c’est le cas pour chaque contenu additionnel, **le test est validé**.", "2": "1. Retrouver dans le document les contenus additionnels devenant visible à la prise de focus d’un composant d’interface au moyen d’un mécanisme CSS (`pseudo-classe :focus`) ;\n2. Pour chaque contenu additionnel, vérifier que les contenus additionnels apparaissent également :\n\n- À l’activation du composant au moyen du clavier ou de tout autre dispositif de pointage ;\n- Au survol du composant ;\n- À l’activation ou du survol d’un autre composant.\n\n3. Si c’est le cas pour chaque contenu additionnel, **le test est validé**." }, "techniques": ["G202"], "wcag": ["2.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "11.1", "theme": 11, "title": { "fr": "Chaque [champ de formulaire](#champ-de-saisie-de-formulaire) a-t-il une [étiquette](#etiquette-de-champ-de-formulaire) ?" }, "titlePlain": { "fr": "Chaque champ de formulaire a-t-il une étiquette ?" }, "tests": { "1": [ "Chaque [champ de formulaire](#champ-de-saisie-de-formulaire) vérifie-t-il une de ces conditions ?", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) possède un attribut WAI-ARIA `aria-labelledby` référençant un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) identifié ;", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) possède un attribut WAI-ARIA `aria-label` ;", "Une balise `<label>` ayant un attribut `for` est associée au [champ de formulaire](#champ-de-saisie-de-formulaire) ;", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) possède un attribut `title` ;", "Un bouton adjacent au [champ de formulaire](#champ-de-saisie-de-formulaire) lui fournit une étiquette visible et un élément `<label>` visuellement caché ou un attribut WAI-ARIA `aria-label`, `aria-labelledby` ou `title` lui fournit un nom accessible." ], "2": [ "Chaque [champ de formulaire](#champ-de-saisie-de-formulaire) associé à une balise `<label>` ayant un attribut `for`, vérifie-t-il ces conditions ?", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) possède un attribut `id` ;", "La valeur de l’attribut `for` est égale à la valeur de l’attribut `id` du [champ de formulaire](#champ-de-saisie-de-formulaire) associé." ], "3": [ "Chaque [champ de formulaire](#champ-de-saisie-de-formulaire) ayant une [étiquette](#etiquette-de-champ-de-formulaire) dont le contenu n’est pas visible ou à proximité (masqué, `aria-label`) ou qui n’est pas [accolé](#accoles-etiquette-et-champ-accoles) au champ (`aria-labelledby`), vérifie-t-il une de ses conditions ?", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) possède un attribut `title` dont le contenu permet de comprendre la nature de la saisie attendue ;", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) est accompagné d’un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) accolé au champ qui devient visible à la prise de focus permettant de comprendre la nature de la saisie attendue ;", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) est accompagné d’un [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) visible accolé au champ permettant de comprendre la nature de la saisie attendue." ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire ;\n2. Pour chaque champ de formulaire, vérifier que le champ de formulaire :\n - Possède un attribut WAI-ARIA `aria-labelledby` référençant un passage de texte identifié ;\n - Possède un attribut WAI-ARIA `aria-label` ;\n - Est associé à un élément `<label>` ayant un attribut `for` ;\n - Possède un attribut `title` ;\n - Un bouton adjacent au champ de formulaire lui fournit une étiquette visible et un élément `<label>` visuellement caché ou un attribut WAI-ARIA `aria-label`, `aria-labelledby` ou `title` lui fournit un nom accessible.\n3. Si c’est le cas pour champ de formulaire, **le test est validé**.", "2": "1. Retrouver dans le document les champs de formulaire associé à un élément `<label>` ;\n2. Pour chaque champ de formulaire, vérifier que :\n - Le champ de formulaire possède un attribut `id` ;\n - La valeur de l’attribut `for` de l’élément `<label>` est égale à la valeur de l’attribut `id`.\n3. Si c’est le cas pour champ de formulaire, **le test est validé**.", "3": "1. Retrouver dans le document les champs de formulaire dont l’étiquette n’est pas visible ou à proximité (masquée, utilisation de l’attribut aria-label) ou n’est pas accolée au champ (utilisation de l’attribut `aria-labelledby`) ;\n2. Pour chaque champ de formulaire, vérifier que le champ de formulaire :\n - soit possède un attribut `title` dont le contenu permet de comprendre la nature de la saisie attendue ;\n - est accompagné d’un passage de texte accolé au champ qui devient visible à la prise de focus permettant de comprendre la nature de la saisie attendue ;\n - est accompagné d’un passage de texte visible accolé au champ permettant de comprendre la nature de la saisie attendue." }, "techniques": ["G82", "G131", "H44", "H65", "F68", "F82", "F86", "ARIA6", "ARIA9", "ARIA14", "ARIA16"], "wcag": ["1.3.1", "2.4.6", "3.3.2", "4.1.2"], "appliesTo": { "ruleIds": [ "axe:form-field-multiple-labels", "axe:label", "axe:label-title-only", "axe:select-name", "control-label-missing", "control-name-title-only", "field-purpose-incomplete", "form-field-multiple-labels", "label-for-dangling", "placeholder-as-label", "select-has-option" ] }, "automation": { "tests": { "1": "static", "2": "judgment", "3": "judgment" }, "rules": [ { "id": "axe:form-field-multiple-labels", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:label", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "axe:label-title-only", "tests": ["1", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:select-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "control-label-missing", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "control-name-title-only", "tests": ["1", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "field-purpose-incomplete", "tests": ["1", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "form-field-multiple-labels", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "label-for-dangling", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "placeholder-as-label", "tests": ["1", "3"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "select-has-option", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "11.2", "theme": 11, "title": { "fr": "Chaque [étiquette](#etiquette-de-champ-de-formulaire) associée à un [champ de formulaire](#champ-de-saisie-de-formulaire) est-elle pertinente (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque étiquette associée à un champ de formulaire est-elle pertinente (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque balise `<label>` permet-elle de connaître la fonction exacte du [champ de formulaire](#champ-de-saisie-de-formulaire) auquel elle est associée ?" ], "2": [ "Chaque attribut `title` permet-il de connaître la fonction exacte du [champ de formulaire](#champ-de-saisie-de-formulaire) auquel il est associé ?" ], "3": [ "Chaque étiquette implémentée via l’attribut WAI-ARIA `aria-label` permet-elle de connaître la fonction exacte du [champ de formulaire](#champ-de-saisie-de-formulaire) auquel elle est associée ?" ], "4": [ "Chaque [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé via l’attribut WAI-ARIA `aria-labelledby` permet-il de connaître la fonction exacte du [champ de formulaire](#champ-de-saisie-de-formulaire) auquel il est associé ?" ], "5": [ "Chaque [champ de formulaire](#champ-de-saisie-de-formulaire) ayant un [intitulé visible](#intitule-visible) vérifie-t-il ces conditions (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` du [champ de formulaire](#champ-de-saisie-de-formulaire) contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) lié au [champ de formulaire](#champ-de-saisie-de-formulaire) via un attribut WAI-ARIA `aria-labelledby` contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le contenu de l’attribut `title` du [champ de formulaire](#champ-de-saisie-de-formulaire) contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent le contenu de la balise `<label>` associé au [champ de formulaire](#champ-de-saisie-de-formulaire) contient au moins l’[intitulé visible](#intitule-visible)." ], "6": [ "Chaque bouton adjacent au [champ de formulaire](#champ-de-saisie-de-formulaire) qui fournit une étiquette visible permet-il de connaître la fonction exacte du [champ de formulaire](#champ-de-saisie-de-formulaire) auquel il est associé ?" ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire dont l’étiquette est fournie par un élément `<label>` ;\n2. Pour chaque champ de formulaire, vérifier que le contenu de l’élément est pertinent ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "2": "1. Retrouver dans le document les champs de formulaire dont l’étiquette est fournie par un attribut `title` ;\n2. Pour chaque champ de formulaire, vérifier que le contenu de l’attribut est pertinent ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "3": "1. Retrouver dans le document les champs de formulaire dont l’étiquette est fournie par un attribut WAI-ARIA `aria-label` ;\n2. Pour chaque champ de formulaire, vérifier que le contenu de l’attribut est pertinent ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "4": "1. Retrouver dans le document les champs de formulaire dont l’étiquette est fournie par un attribut WAI-ARIA `aria-labelledby` ;\n2. Pour chaque champ de formulaire, vérifier que le contenu du passage de texte référencé est pertinent ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "5": "1. Retrouver dans le document les champs de formulaire dont l’étiquette est fournie à la fois par un intitulé visible et par le contenu soit d’un élément `<label>`, soit d’un attribut `title` ou d’un attribut `aria-label` ou d’un attribut `aria-labelledby` ;\n2. Pour chaque champ de formulaire, vérifier que le contenu de l’élément `<label>` ou de l’attribut `title` ou de l’attribut `aria-label` ou de l’attribut `aria-labelledby` contient l’intitulé visible ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "6": "1. Retrouver dans le document les champs de formulaire dont l’étiquette visible est fournie par un bouton adjacent ;\n2. Pour chaque champ de formulaire, vérifier que le contenu visible du bouton est pertinent ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**." }, "techniques": ["G82", "G131", "H44", "H65", "ARIA6", "ARIA9", "ARIA14", "ARIA16"], "particularCases": [ "Il existe une gestion de cas particuliers pour le test 11.2.5 lorsque :", "- La ponctuation et les lettres majuscules sont présentes dans le texte de l’[intitulé visible](#intitule-visible) : elles peuvent être ignorées dans le nom accessible sans porter à conséquence ;", "- Le texte de l’[intitulé visible](#intitule-visible) sert de symbole : le texte ne doit pas être interprété littéralement au niveau du nom accessible. Le nom doit exprimer la fonction véhiculée par le symbole (par exemple, “B” au niveau d’un éditeur de texte aura pour nom accessible “Mettre en gras”, le signe “>” en fonction du contexte signifiera “Suivant” ou “Lancer la vidéo”). Le cas des symboles mathématiques fait cependant exception (voir la note ci-dessous).", "Note : si l’étiquette visible représente une expression mathématique, les symboles mathématiques peuvent être repris littéralement pour servir d’étiquette au nom accessible (ex. : “A>B”). Il est laissé à l’utilisateur le soin d’opérer la correspondance entre l’expression et ce qu’il doit épeler compte tenu de la connaissance qu’il a du fonctionnement de son logiciel de saisie vocale (“A plus grand que B” ou “A supérieur à B”).", "Ce cas particulier s’applique également au test 11.9.2." ], "wcag": ["2.4.6", "2.5.3", "3.3.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment" }, "rules": [] } }, { "id": "11.3", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), chaque [étiquette](#etiquette-de-champ-de-formulaire) associée à un [champ de formulaire](#champ-de-saisie-de-formulaire) ayant la même fonction et répétée plusieurs fois dans une même page ou dans un [ensemble de pages](#ensemble-de-pages) est-elle [cohérente](#etiquettes-coherentes) ?" }, "titlePlain": { "fr": "Dans chaque formulaire, chaque étiquette associée à un champ de formulaire ayant la même fonction et répétée plusieurs fois dans une même page ou dans un ensemble de pages est-elle cohérente ?" }, "tests": { "1": [ "Chaque [étiquette](#etiquette-de-champ-de-formulaire) associée à un [champ de formulaire](#champ-de-saisie-de-formulaire) ayant la même fonction et répétée plusieurs fois dans une même page est-elle [cohérente](#etiquettes-coherentes) ?" ], "2": [ "Chaque [étiquette](#etiquette-de-champ-de-formulaire) associée à un [champ de formulaire](#champ-de-saisie-de-formulaire) ayant la même fonction et répétée dans un ensemble de pages est-elle [cohérente](#etiquettes-coherentes) ?" ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire ayant une même fonction (par exemple plusieurs champs d’adresse) ;\n2. Pour chaque champ de formulaire, vérifier que les étiquettes sont cohérentes (elles permettent de comprendre qu’il s’agit de saisies de natures identiques) ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "2": "1. Retrouver dans l’ensemble des pages considérées les champs de formulaire ayant une même fonction (par exemple le champ de saisie d’un moteur de recherche ou le champ de saisie d’inscription à une newsletter) ;\n2. Pour chaque champ de formulaire, vérifier que les étiquettes sont cohérentes (elles permettent de comprendre qu’il s’agit de saisies de natures identiques) ;\n3. Si c’est le cas pour chaque champ de formulaire de l’ensemble des pages considérées, **le test est validé**." }, "techniques": ["F31"], "wcag": ["3.2.4"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "11.4", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), chaque [étiquette de champ](#etiquette-de-champ-de-formulaire) et son champ associé sont-ils [accolés](#accoles-etiquette-et-champ-accoles) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque formulaire, chaque étiquette de champ et son champ associé sont-ils accolés (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [étiquette de champ](#etiquette-de-champ-de-formulaire) et son [champ](#champ-de-saisie-de-formulaire) associé sont-ils [accolés](#accoles-etiquette-et-champ-accoles) ?" ], "2": [ "Chaque [étiquette](#etiquette-de-champ-de-formulaire) [accolée](#accoles-etiquette-et-champ-accoles) à un [champ](#champ-de-saisie-de-formulaire) (à l’exception des cases à cocher, bouton radio ou balises ayant un attribut WAI-ARIA `role=\"checkbox\"`, `role=\"radio\"` ou `role=\"switch\"`), vérifie-t-elle ces conditions (hors cas particuliers) ?", "L’étiquette est visuellement [accolée](#accoles-etiquette-et-champ-accoles) immédiatement au-dessus ou à gauche du [champ de formulaire](#champ-de-saisie-de-formulaire) lorsque le sens de lecture de la langue de l’étiquette est de gauche à droite ;", "L’étiquette est visuellement [accolée](#accoles-etiquette-et-champ-accoles) immédiatement au-dessus ou à droite du [champ de formulaire](#champ-de-saisie-de-formulaire) lorsque le sens de lecture de la langue de l’étiquette est de droite à gauche." ], "3": [ "Chaque [étiquette](#etiquette-de-champ-de-formulaire) [accolée](#accoles-etiquette-et-champ-accoles) à un [champ](#champ-de-saisie-de-formulaire) de type `checkbox` ou `radio` ou à une balise ayant un attribut WAI-ARIA `role=\"checkbox\"`, `role=\"radio\"` ou `role=\"switch\"`, vérifie-t-elle ces conditions (hors cas particuliers) ?", "L’étiquette est visuellement [accolée](#accoles-etiquette-et-champ-accoles) immédiatement au-dessous ou à droite du [champ de formulaire](#champ-de-saisie-de-formulaire) lorsque le sens de lecture de la langue de l’étiquette est de gauche à droite ;", "L’étiquette est visuellement [accolée](#accoles-etiquette-et-champ-accoles) immédiatement au-dessous ou à gauche du [champ de formulaire](#champ-de-saisie-de-formulaire) lorsque le sens de lecture de la langue de l’étiquette est de droite à gauche." ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire ;\n2. Pour chaque champ de formulaire, vérifier qu’il est accolé à son étiquette ;\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "2": "1. Retrouver dans le document les champs de formulaire qui ne sont pas des éléments `<input>` de type `checkbox` ou de type `radio` ou des éléments ayant un attribut WAI-ARIA `role=\"checkbox\"`, `role=\"radio\"` ou `role=\"switch`\";\n2. Pour chaque champ de formulaire, vérifier que l’étiquette est visuellement accolée :\n - Immédiatement au-dessus ou à gauche du champ de formulaire lorsque le sens de lecture de la langue de l’étiquette est de gauche à droite ;\n - Immédiatement au-dessus ou à droite du champ de formulaire lorsque le sens de lecture de la langue de l’étiquette est de droite à gauche.\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**.", "3": "1. Retrouver dans le document les champs de formulaire qui sont `<input>` de type `checkbox` ou de type `radio` ou des éléments ayant un attribut WAI-ARIA `role=\"checkbox\"`, `role=\"radio\"` ou `role=\"switch`\";\n2. Pour chaque champ de formulaire, vérifier que l’étiquette est visuellement accolée :\n - Immédiatement au-dessous ou à droite du champ de formulaire lorsque le sens de lecture de la langue de l’étiquette est de gauche à droite ;\n - Immédiatement au-dessous ou à gauche du champ de formulaire lorsque le sens de lecture de la langue de l’étiquette est de droite à gauche.\n3. Si c’est le cas pour chaque champ de formulaire, **le test est validé**." }, "techniques": ["G162"], "particularCases": [ "Les tests 11.4.2 et 11.4.3 seront considérés comme non applicables :", "- Dans le cas où l’[étiquette](#etiquette-de-champ-de-formulaire) mélange une portion de texte qui se lit de droite à gauche avec une portion de texte qui se lit de gauche à droite ;", "- Dans le cas où un formulaire contient des labels de plusieurs langues qui se liraient de droite à gauche et inversement. Par exemple, un formulaire de commande en arabe qui propose une liste de cases à cocher de produit en langue française ou mixant des produits en langue arabe ou en langue française ;", "- Dans le cas où les champs de type `radio` ou `checkbox` et les balises ayant un attribut WAI-ARIA `role=\"checkbox\"`, `role=\"radio\"` ou `role=\"switch\"` ne sont pas visuellement présentés sous forme de bouton radio ou de case à cocher ;", "- Dans le cas où les champs seraient utilisés dans un contexte où il pourrait être légitime, du point de vue de l’expérience utilisateur, de placer les étiquettes de manière différente à celle requise dans les tests 11.4.2 et 11.4.3." ], "wcag": ["3.3.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "11.5", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), les [champs de même nature](#champs-de-meme-nature) sont-ils regroupés, si nécessaire ?" }, "titlePlain": { "fr": "Dans chaque formulaire, les champs de même nature sont-ils regroupés, si nécessaire ?" }, "tests": { "1": [ "Les [champs de même nature](#champs-de-meme-nature) vérifient-ils l’une de ces conditions, si nécessaire ?", "Les [champs de même nature](#champs-de-meme-nature) sont regroupés dans une balise `<fieldset>` ;", "Les [champs de même nature](#champs-de-meme-nature) sont regroupés dans une balise possédant un attribut WAI-ARIA `role=\"group\"` ;", "Les [champs de même nature](#champs-de-meme-nature) de type radio (`<input type=\"radio\">`) ou balises possédant un attribut WAI-ARIA `role=\"radio\"`) sont regroupés dans une balise possédant un attribut WAI-ARIA `role=\"radiogroup\"` ou `role=\"group\"`." ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire de même nature (par exemple un groupe de saisie d’informations d’identité, une série de cases à cocher, une saisie de date sur plusieurs champs successifs…) ;\n2. Pour chaque groupe de champs de formulaire de même nature, vérifier que ces champs de même nature sont regroupés :\n - Soit dans un élément `<fieldset>` ;\n - Soit dans un élément possédant un attribut WAI-ARIA `role=\"group\"` ;\n - Soit dans un élément possédant un attribut WAI-ARIA `role=\"radiogroup\"` ou `\"group\"`, s’il s’agit d’éléments `<input>` de type `radio` ( ou d’éléments possédant un attribut WAI-ARIA `role=\"radio\"`).\n3. Si c’est le cas pour chaque groupe de champs de formulaire de même nature, **le test est validé**." }, "techniques": ["H71", "ARIA17"], "wcag": ["1.3.1", "3.3.2"], "appliesTo": { "ruleIds": ["date-fields-ungrouped", "radio-checkbox-group-ungrouped"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "date-fields-ungrouped", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "radio-checkbox-group-ungrouped", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "11.6", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), chaque regroupement de [champs de même nature](#champs-de-meme-nature) a-t-il une [légende](#legende) ?" }, "titlePlain": { "fr": "Dans chaque formulaire, chaque regroupement de champs de même nature a-t-il une légende ?" }, "tests": { "1": ["Chaque regroupement de [champs de même nature](#champs-de-meme-nature) possède-t-il une [légende](#legende) ?"] }, "methodology": { "1": "1. Retrouver dans le document les groupes de champs de formulaire de même nature ;\n2. Pour chaque groupe de champs de formulaire de même nature, vérifier que :\n - Si le regroupement utilise un élément `<fieldset>`, l’élément `<fieldset>` possède un élément `<legend>` ;\n - Si l’élément de regroupement utilise un attribut WAI-ARIA `role=\"group\"` ou `\"radiogroup\"`, il possède un attribut WAI-ARIA `aria-label` ou `aria-labelledby`.\n3. Sinon, pour chacun des champs de même nature, vérifier la présence :\n - Soit d’un attribut title permettant de déterminer l’appartenance du champ au groupement de champ ;\n - Soit d’un attribut `aria-label` permettant de déterminer l’appartenance du champ au groupement de champ ;\n - Soit d’un attribut `aria-labelledby` qui référence un passage de texte permettant de déterminer l’appartenance du champ au groupement de champ ;\n - Soit d’un attribut `aria-describedby` qui référence un passage de texte permettant de déterminer l’appartenance du champ au groupement de champ.\n4. Si c’est le cas pour chaque groupe de champs de formulaire ou pour chacun des champs de même nature, **le test est validé**." }, "techniques": ["H71", "ARIA17"], "wcag": ["1.3.1", "3.3.2"], "appliesTo": { "ruleIds": ["axe:fieldset", "fieldset-legend-missing"] }, "automation": { "tests": { "1": "static" }, "rules": [ { "id": "axe:fieldset", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "fieldset-legend-missing", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "11.7", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), chaque [légende](#legende) associée à un regroupement de [champs de même nature](#champs-de-meme-nature) est-elle pertinente ?" }, "titlePlain": { "fr": "Dans chaque formulaire, chaque légende associée à un regroupement de champs de même nature est-elle pertinente ?" }, "tests": { "1": ["Chaque [légende](#legende) associée à un regroupement de [champs de même nature](#champs-de-meme-nature) est-elle pertinente ?"] }, "methodology": { "1": "1. Retrouver dans le document les groupes de champs de formulaire de même nature ;\n2. Pour chaque groupe de champs de formulaire de même nature ou pour chacun des champs de même nature qui dispose d’une légende, vérifier que le texte de cette légende est pertinent ;\n3. Si c’est le cas pour chaque groupe de champs de formulaire ou pour chacun des champs de même nature, **le test est validé**." }, "techniques": ["H71", "ARIA17"], "wcag": ["1.3.1", "3.3.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "11.8", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), les [items de même nature d’une liste de choix](#items-de-meme-nature-d-une-liste-de-choix) sont-ils regroupés de manière pertinente ?" }, "titlePlain": { "fr": "Dans chaque formulaire, les items de même nature d’une liste de choix sont-ils regroupés de manière pertinente ?" }, "tests": { "1": [ "Pour chaque balise `<select>`, les [items de même nature d’une liste de choix](#items-de-meme-nature-d-une-liste-de-choix) sont-ils regroupés avec une balise `<optgroup>`, si nécessaire ?" ], "2": ["Dans chaque balise `<select>`, chaque balise `<optgroup>` possède-t-elle un attribut `label` ?"], "3": ["Pour chaque balise `<optgroup>` ayant un attribut `label`, le contenu de l’attribut `label` est-il pertinent ?"] }, "methodology": { "1": "1. Retrouver dans le document les listes de sélection (élément `<select>`) ;\n2. Pour chaque liste de sélection proposant des groupes d’items de même nature, vérifier que ces items sont regroupés au moyen d’éléments `<optgroup>` ;\n3. Si c’est le cas pour chaque liste de sélection proposant des groupes d’items de même nature, **le test est validé**.", "2": "1. Retrouver dans le document les listes de sélection (élément `<select>`) qui possèdent des éléments `<optgroup>` ;\n2. Pour chaque élément `<optgroup>`, vérifier qu’il possède un attribut `label` ;\n3. Si c’est le cas pour chaque élément `<optgroup>`, **le test est validé**.", "3": "1. Retrouver dans le document les listes de sélection (élément `<select>`) qui possèdent des éléments `<optgroup>` pourvus d’un attribut `label` ;\n2. Pour chaque attribut `label`, vérifier que son contenu est pertinent ;\n3. Si c’est le cas pour chaque attribut `label`, **le test est validé**." }, "techniques": ["H85"], "technicalNote": [ "Il est possible d’utiliser une balise ayant un attribut WAI-ARIA `role=\"listbox\"` en remplacement d’une balise `<select>`. En revanche, il est impossible de créer des groupes d’options via l’utilisation de WAI-ARIA. De ce fait, une liste nécessitant un regroupement d’options structurée à l’aide d’une balise ayant un attribut WAI-ARIA `role=\"listbox\"` sera considérée comme non conforme au critère 11.8." ], "wcag": ["1.3.1"], "appliesTo": { "ruleIds": ["pack:rgaa:optgroup-without-label"] }, "automation": { "tests": { "1": "judgment", "2": "static", "3": "judgment" }, "rules": [ { "id": "pack:rgaa:optgroup-without-label", "tests": ["2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." } ] } }, { "id": "11.9", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), l’intitulé de chaque [bouton](#bouton-formulaire) est-il pertinent (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque formulaire, l’intitulé de chaque bouton est-il pertinent (hors cas particuliers) ?" }, "tests": { "1": [ "L’intitulé de chaque [bouton](#bouton-formulaire) vérifie-t-il ces conditions (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label` est pertinent ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) lié au bouton via un attribut WAI-ARIA `aria-labelledby` est pertinent ;", "S’il est présent, le contenu de l’attribut `value` d’une balise `<input>` de type `submit`, `reset` ou `button` est pertinent ;", "S’il est présent, le contenu de la balise `<button>` est pertinent ;", "S’il est présent, le contenu de l’attribut `alt` d’une balise `<input>` de type `image` est pertinent ;", "S’il est présent, le contenu de l’attribut `title` est pertinent." ], "2": [ "Chaque [bouton](#bouton-formulaire) affichant un [intitulé visible](#intitule-visible) vérifie-t-il ces conditions (hors cas particuliers) ?", "S’il est présent, le contenu de l’attribut WAI-ARIA `aria-label `contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) lié au bouton via un attribut WAI-ARIA `aria-labelledby` contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le contenu de l’attribut value d’une balise `<input>` de type `submit`, `reset` ou `button` contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le contenu de la balise `<button>` contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le contenu de l’attribut `alt` d’une balise `<input>` de type `image` contient au moins l’[intitulé visible](#intitule-visible) ;", "S’il est présent, le contenu de l’attribut `title` contient au moins l’[intitulé visible](#intitule-visible)." ] }, "methodology": { "1": "1. Retrouver dans le document les boutons présents au sein d’un formulaire ;\n2. Pour chaque bouton, vérifier que son intitulé visible et son nom accessible sont pertinents ;\n3. Si c’est le cas pour chaque bouton, **le test est validé**.", "2": "1. Retrouver dans le document les boutons présents au sein d’un formulaire ;\n2. Pour chaque bouton, vérifier que son nom accessible contient au moins son intitulé visible ;\n3. Si c’est le cas pour chaque bouton, **le test est validé**." }, "techniques": ["H36", "H91", "ARIA6", "ARIA9", "ARIA14", "ARIA16"], "particularCases": ["Pour le test 11.9.2, voir cas particuliers critère 11.2."], "wcag": ["2.5.3", "4.1.2"], "appliesTo": { "ruleIds": ["cross-icon-only-unnamed", "form-button-empty-name", "form-label-in-name-mismatch", "icon-only-control-unnamed"] }, "automation": { "tests": { "1": "static", "2": "static" }, "rules": [ { "id": "cross-icon-only-unnamed", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "form-button-empty-name", "tests": ["1"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "form-label-in-name-mismatch", "tests": ["2"], "effect": "decisive-nc", "rationale": "The observed failure exhausts the cited RGAA test." }, { "id": "icon-only-control-unnamed", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "11.10", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), le [contrôle de saisie](#controle-de-saisie-formulaire) est-il utilisé de manière pertinente (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque formulaire, le contrôle de saisie est-il utilisé de manière pertinente (hors cas particuliers) ?" }, "tests": { "1": [ "Les [indications du caractère obligatoire](#indication-de-champ-obligatoire) de la saisie des champs vérifient-elles une de ces conditions (hors cas particuliers) ?", "Une [indication de champ obligatoire](#indication-de-champ-obligatoire) est visible et permet d’identifier nommément le champ concerné préalablement à la validation du formulaire ;", "Le champ obligatoire dispose de l’attribut `aria-required=\"true\"` ou `required` préalablement à la validation du formulaire." ], "2": [ "Les champs obligatoires ayant l’attribut `aria-required=\"true\"` ou `required` vérifient-ils une de ces conditions ?", "Une [indication de champ obligatoire](#indication-de-champ-obligatoire) est visible et située dans l’étiquette associée au champ préalablement à la validation du formulaire ;", "Une [indication de champ obligatoire](#indication-de-champ-obligatoire) est visible et située dans le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé au champ préalablement à la validation du formulaire." ], "3": [ "Les messages d’erreur indiquant l’absence de saisie d’un champ obligatoire vérifient-ils une de ces conditions ?", "Le message d’erreur indiquant l’absence de saisie d’un champ obligatoire est visible et permet d’identifier nommément le champ concerné ;", "Le champ obligatoire dispose de l’attribut `aria-invalid=\"true\"`." ], "4": [ "Les champs obligatoires ayant l’attribut `aria-invalid=\"true\"` vérifient-ils une de ces conditions ?", "Le message d’erreur indiquant le caractère invalide de la saisie est visible et situé dans l’étiquette associée au champ ;", "Le message d’erreur indiquant le caractère invalide de la saisie est visible et situé dans le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé au champ." ], "5": [ "Les instructions et indications du type de données et/ou de format obligatoires vérifient-elles une de ces conditions ?", "Une instruction ou une indication du type de données et/ou de format obligatoire est visible et permet d’identifier nommément le champ concerné préalablement à la validation du formulaire ;", "Une instruction ou une indication du type de données et/ou de format obligatoire est visible dans l’étiquette ou le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé au champ préalablement à la validation du formulaire." ], "6": [ "Les messages d’erreurs fournissant une instruction ou une indication du type de données et/ou de format obligatoire des champs vérifient-ils une de ces conditions ?", "Le message d’erreur fournissant une instruction ou une indication du type de données et/ou de format obligatoires est visible et identifie le champ concerné ;", "Le champ dispose de l’attribut `aria-invalid=\"true\"`." ], "7": [ "Les champs ayant l’attribut `aria-invalid=\"true\"` dont la saisie requiert un type de données et/ou de format obligatoires vérifient-ils une de ces conditions ?", "Une instruction ou une indication du type de données et/ou de format obligatoire est visible et située dans la balise `<label>` associée au champ ;", "Une instruction ou une indication du type de données et/ou de format obligatoire est visible et située dans le [passage de texte](#passage-de-texte-lie-par-aria-labelledby-ou-aria-describedby) associé au champ." ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire obligatoires ;\n2. Pour chaque champ de formulaire, vérifier que préalablement à la validation du formulaire :\n - Soit une indication de champ obligatoire est visible et permet d’identifier nommément le champ concerné ;\n - Soit le champ possède un attribut `aria-required=\"true\"` ou `required`.\n3. Si c’est le cas pour chaque champ de formulaire obligatoire, **le test est validé**.", "2": "1. Retrouver dans le document les champs de formulaire obligatoires qui possèdent un attribut `aria-required=\"true\"` ou `required` ;\n2. Pour chaque champ de formulaire, vérifier que préalablement à la validation du formulaire :\n - Soit une indication de champ obligatoire est visible et située dans l’étiquette associée au champ ;\n - Soit une indication de champ obligatoire est visible et située dans le passage de texte associé au champ.\n3. Si c’est le cas pour chaque champ de formulaire obligatoire qui possèdent un attribut `aria-required=\"true\"` ou `required`, **le test est validé**.", "3": "1. Retrouver dans le document les messages d’erreur indiquant l’absence de saisie d’un champ obligatoire ;\n2. Pour chaque message d’erreur, vérifier que :\n - Soit le message d’erreur est visible et permet d’identifier nommément le champ concerné ;\n - Soit le champ obligatoire associé au message d’erreur possède un attribut `aria-invalid=\"true\"`.\n3. Si c’est le cas pour chaque message d’erreur indiquant l’absence de saisie d’un champ obligatoire, **le test est validé**.", "4": "1. Retrouver dans le document les champs de formulaire obligatoires qui possèdent un attribut `aria-invalid=\"true\"` ;\n2. Pour chaque champ de formulaire, vérifier que :\n - Soit le message d’erreur indiquant le caractère invalide de la saisie est visible et situé dans l’étiquette associée au champ ;\n - Soit le message d’erreur indiquant le caractère invalide de la saisie est visible et situé dans le passage de texte associé au champ.\n3. Si c’est le cas pour chaque champ de formulaire obligatoire qui possède un attribut `aria-invalid=\"true\"`, **le test est validé**.", "5": "1. Retrouver dans le document les champs de formulaire obligatoires auxquels est associée une instruction ou une indication du type de données et/ou de format obligatoire ;\n2. Pour chaque champ de formulaire, vérifier que l’instruction ou l’indication du type de données et/ou de format obligatoire est préalablement à la validation du formulaire :\n - Soit visible et permet d’identifier nommément le champ concerné ;\n - Soit visible dans l’étiquette ou le passage de texte associé au champ.\n3. Si c’est le cas pour chaque champ de formulaire obligatoire auquel est associée une instruction ou une indication du type de données et/ou de format obligatoire, **le test est validé**.", "6": "1. Retrouver dans le document les messages d’erreur fournissant une instruction ou une indication du type de données et/ou de format obligatoire d’un champ ;\n2. Pour chaque message d’erreur, vérifier que :\n - Soit le message d’erreur est visible et permet d’identifier nommément le champ concerné ;\n - Soit le champ associé au message d’erreur possède un attribut `aria-invalid=\"true\"`.\n3. Si c’est le cas pour chaque message d’erreur indiquant l’absence de saisie d’un champ obligatoire, **le test est validé**.", "7": "1. Retrouver dans le document les champs de formulaire qui possèdent un attribut `aria-invalid=\"true\"` ;\n2. Pour chaque champ de formulaire, vérifier que :\n - Soit une instruction ou une indication du type de données et/ou de format obligatoire est visible et située dans l’élément `<label>` associé au champ ;\n - Soit une instruction ou une indication du type de données et/ou de format obligatoire est visible et située dans le passage de texte associé au champ.\n3. Si c’est le cas pour chaque champ de formulaire qui possède un attribut `aria-invalid=\"true\"`, **le test est validé**." }, "techniques": [ "G83", "G84", "G85", "G89", "G184", "H44", "H81", "H89", "H90", "F81", "SCR18", "SCR32", "ARIA1", "ARIA2", "ARIA6", "ARIA9", "ARIA16", "ARIA21" ], "technicalNote": [ "Dans un long formulaire dont la majorité des champs sont obligatoires, on pourrait constater que ce sont les quelques champs restés facultatifs qui sont explicitement signalés comme tels. Dans ce cas, il faudrait s’assurer que :", "- Un message précise visuellement en haut de formulaire que “tous les champs sont obligatoires sauf ceux indiqués comme étant facultatifs” ;", "- Une mention “facultatif” est présente visuellement dans le libellé des champs facultatifs ou dans la légende d’un groupe de champs facultatifs ;", "- Un attribut `required` ou `aria-required=\"true\"` reste associé à chaque champ qui n’est pas concerné par ce caractère facultatif." ], "particularCases": [ "Le test 11.10.1 et le test 11.10.2 seront considérés comme non applicables lorsque le formulaire comporte un seul [champ de formulaire](#champ-de-saisie-de-formulaire) ou qu’il indique les champs optionnels de manière :", "- Visible ;", "- Dans la balise `<label>` ou dans la [légende](#legende) associée au champ.", "Dans le cas où l’ensemble des champs d’un formulaire sont obligatoires, les tests 11.10.1 et 11.10.2 restent applicables." ], "wcag": ["3.3.1", "3.3.2"], "appliesTo": { "ruleIds": ["aria-invalid-no-description", "error-not-associated"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment", "5": "judgment", "6": "judgment", "7": "judgment" }, "rules": [ { "id": "aria-invalid-no-description", "tests": ["3", "4", "6", "7"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "error-not-associated", "tests": ["3", "4", "6", "7"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "11.11", "theme": 11, "title": { "fr": "Dans chaque [formulaire](#formulaire), le [contrôle de saisie](#controle-de-saisie-formulaire) est-il accompagné, si nécessaire, de suggestions facilitant la correction des erreurs de saisie ?" }, "titlePlain": { "fr": "Dans chaque formulaire, le contrôle de saisie est-il accompagné, si nécessaire, de suggestions facilitant la correction des erreurs de saisie ?" }, "tests": { "1": ["Pour chaque erreur de saisie, les types et les formats de données sont-ils suggérés, si nécessaire ?"], "2": ["Pour chaque erreur de saisie, des exemples de valeurs attendues sont-ils suggérés, si nécessaire ?"] }, "methodology": { "1": "1. Retrouver dans le document les messages d’erreur ;\n2. Pour chaque message d’erreur, vérifier que les types et les formats de données attendus sont suggérés ;\n3. Si c’est le cas pour chaque message d’erreur , **le test est validé**.", "2": "1. Retrouver dans le document les messages d’erreur ;\n2. Pour chaque message d’erreur, vérifier que des exemples de valeurs attendues sont suggérés ;\n3. Si c’est le cas pour chaque message d’erreur , **le test est validé**." }, "techniques": ["G84", "G85", "G89", "G177", "H89"], "technicalNote": [ "Certains types de contrôles en HTML5 proposent des messages d’aide à la saisie automatique : par exemple le type `email` affiche un message du type « veuillez saisir une adresse e-mail valide » dans le cas où l’adresse e-mail saisie ne correspond pas au format attendu. Ces messages sont personnalisables via l’API Constraint Validation, ce qui permet de personnaliser les messages d’erreur et de valider le critère. L’attribut `pattern` permet d’effectuer automatiquement des contrôles de format (via des expressions régulières) et affiche un message d’aide personnalisable via l’attribut `title` : ce dispositif valide également le critère." ], "wcag": ["3.3.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "11.12", "theme": 11, "title": { "fr": "Pour chaque [formulaire](#formulaire) qui modifie ou supprime des données, ou qui transmet des réponses à un test ou à un examen, ou dont la validation a des conséquences financières ou juridiques, les données saisies peuvent-elles être modifiées, mises à jour ou récupérées par l’utilisateur ?" }, "titlePlain": { "fr": "Pour chaque formulaire qui modifie ou supprime des données, ou qui transmet des réponses à un test ou à un examen, ou dont la validation a des conséquences financières ou juridiques, les données saisies peuvent-elles être modifiées, mises à jour ou récupérées par l’utilisateur ?" }, "tests": { "1": [ "Pour chaque formulaire qui modifie ou supprime des données, ou qui transmet des réponses à un test ou un examen, ou dont la validation a des conséquences financières ou juridiques, la saisie des données vérifie-t-elle une de ces conditions ?", "L’utilisateur peut [modifier ou annuler les données et les actions effectuées](#modifier-ou-annuler-les-donnees-et-les-actions-effectues) sur ces données après la validation du formulaire ;", "L’utilisateur peut vérifier et corriger les données avant la validation d’un formulaire en plusieurs étapes ;", "Un mécanisme de confirmation explicite, via une case à cocher (balise `<input>` de type `checkbox` ou balise ayant un attribut WAI-ARIA `role=\"checkbox\"`) ou une étape supplémentaire, est présent." ], "2": [ "Chaque formulaire dont la validation modifie ou supprime des données à caractère financier, juridique ou personnel vérifie-t-il une de ces conditions ?", "Un mécanisme permet de récupérer les données supprimées ou modifiées par l’utilisateur ;", "Un mécanisme de demande de confirmation explicite de la suppression ou de la modification, via un [champ de formulaire](#champ-de-saisie-de-formulaire) ou une étape supplémentaire, est proposé." ] }, "methodology": { "1": "1. Retrouver dans le document les formulaires qui modifient ou suppriment des données, ou qui transmettent des réponses à un test ou un examen, ou dont la validation a des conséquences financières ou juridiques ;\n2. Pour chaque formulaire, vérifier que l’utilisateur peut :\n - Soit modifier ou annuler les données et les actions effectuées sur ces données après la validation du formulaire ;\n - Soit vérifier et corriger les données avant la validation d’un formulaire en plusieurs étapes ;\n - Soit disposer d’un mécanisme de confirmation explicite (par exemple, une case à cocher ou une étape supplémentaire).\n3. Si c’est le cas pour chaque formulaire retrouvé, **le test est validé**.", "2": "1. Retrouver dans le document les formulaires qui modifient ou suppriment des données à caractère financier, juridique ou personnel ;\n2. Pour chaque formulaire, vérifier que l’utilisateur dispose :\n - Soit d’un mécanisme qui permet de récupérer les données supprimées ou modifiées ;\n - Soit d’un mécanisme de demande de confirmation explicite de la suppression ou de la modification (par exemple, une case à cocher ou une étape supplémentaire).\n3. Si c’est le cas pour chaque formulaire retrouvé, **le test est validé**." }, "techniques": ["G98", "G99", "G155", "G164", "G168"], "wcag": ["3.3.4"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "11.13", "theme": 11, "title": { "fr": "La finalité d’un champ de saisie peut-elle être déduite pour faciliter le remplissage automatique des champs avec les données de l’utilisateur ?" }, "titlePlain": { "fr": "La finalité d’un champ de saisie peut-elle être déduite pour faciliter le remplissage automatique des champs avec les données de l’utilisateur ?" }, "tests": { "1": [ "Chaque [champ de formulaire](#champ-de-saisie-de-formulaire) dont l’objet se rapporte à une information concernant l’utilisateur vérifie-t-il ces conditions ?", "Le [champ de formulaire](#champ-de-saisie-de-formulaire) possède un attribut `autocomplete `;", "L’attribut `autocomplete` est pourvu d’une valeur présente dans la [liste des valeurs possibles pour l’attribut `autocomplete`](#liste-des-valeurs-possibles-pour-l-attribut-autocomplete) associés à un [champ de formulaire](#champ-de-saisie-de-formulaire) ;", "La valeur indiquée pour l’attribut `autocomplete` est pertinente au regard du type d’information attendu." ] }, "methodology": { "1": "1. Retrouver dans le document les champs de formulaire qui se rapportent à une information concernant l’utilisateur (nom, prénom, numéro de téléphone, etc.) ;\n2. Pour chaque champ de formulaire, vérifier que :\n - Le champ de formulaire possède un attribut `autocomplete` ;\n - L’attribut `autocomplete` est pourvu d’une valeur présente dans la <a rel=\"noreferrer noopener\" target=\"_blank\" title=\"liste des valeurs possibles - en anglais - nouvelle fenêtre\" href=\"https://www.w3.org/TR/html52/sec-forms.html#autofill-processing-model\">liste des valeurs possibles</a> ;\n - La valeur indiquée pour l’attribut `autocomplete` est pertinente au regard du type d’information attendu.\n3. Si c’est le cas pour chaque champ de formulaire retrouvé, **le test est validé**." }, "techniques": ["H98"], "technicalNote": [ "La [liste des valeurs possibles pour l’attribut `autocomplete`](#liste-des-valeurs-possibles-pour-l-attribut-autocomplete) repose sur la liste des valeurs présentes dans la spécification WCAG2.1 qui reprend elle-même la liste des valeurs de type “field name” de la spécification HTML5.2. Le critère WCAG demande à ce que l’une de ces valeurs soit présente pour qualifier un champ de saisie concernant l’utilisateur.", "Ce que le critère WCAG laisse implicite, ce sont les différentes règles de construction possibles pour obtenir une valeur (simple ou composée) pour l’attribut `autocomplete`. C’est cependant l’affaire du développeur de fournir à l’attribut `autocomplete` une valeur ou un ensemble de valeurs valides au regard des exigences de l’algorithme fourni par la spécification HTML5.2. Ainsi, un attribut `autocomplete` ne peut contenir qu’une seule valeur de type `“field name”`, comme `\"name\"` ou `\"street-address\"`. On peut avoir également un ensemble composé de différentes valeurs comme, par exemple, `autocomplete=\"shipping name\"` ou `autocomplete=\"section-software shipping street-address\"` : `\"section-software\"` renvoie à une valeur de type <span lang=\"en\">“scope”</span> et `\"shipping\"` à une valeur de type <span lang=\"en\">“hint set”</span>, mais toujours une seule valeur de type <span lang=\"en\">“field name”</span>." ], "wcag": ["1.3.5"], "appliesTo": { "ruleIds": ["autocomplete-token-invalid", "axe:autocomplete-valid", "field-purpose-incomplete"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "autocomplete-token-invalid", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:autocomplete-valid", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "field-purpose-incomplete", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "12.1", "theme": 12, "title": { "fr": "Chaque [ensemble de pages](#ensemble-de-pages) dispose-t-il de deux [systèmes de navigation](#systeme-de-navigation) différents, au moins (hors cas particuliers) ?" }, "titlePlain": { "fr": "Chaque ensemble de pages dispose-t-il de deux systèmes de navigation différents, au moins (hors cas particuliers) ?" }, "tests": { "1": [ "Chaque [ensemble de pages](#ensemble-de-pages) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "Un [menu de navigation](#menu-et-barre-de-navigation) et un [plan du site](#page-plan-du-site) sont présents ;", "Un [menu de navigation](#menu-et-barre-de-navigation) et un [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) sont présents ;", "Un [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) et un [plan du site](#page-plan-du-site) sont présents." ] }, "methodology": { "1": "1. Pour chaque ensemble de pages du site, vérifier la présence :\n - Soit d’un menu de navigation et d’un plan du site ;\n - Soit d’un menu de navigation et d’un moteur de recherche ;\n - Soit d’un moteur de recherche et d’un plan du site.\n2. Si c’est le cas pour chaque ensemble de pages du site, **le test est validé**." }, "techniques": ["G63", "G64", "G161"], "particularCases": [ "Il existe une gestion de cas particulier lorsque le site web est constitué d’une seule page ou d’un nombre très limité de pages (cf. note). Dans ce cas-là, le critère est non applicable.", "Le critère est également non applicable pour les pages d’un ensemble de pages qui sont le résultat ou une partie d’un processus (un processus de paiement ou de prise de commande, par exemple).", "Note : l’appréciation d’un nombre très limité de pages devrait être réservé à un site dont l’ensemble des pages sont atteignables depuis la page d’accueil." ], "wcag": ["2.4.5"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "12.2", "theme": 12, "title": { "fr": "Dans chaque [ensemble de pages](#ensemble-de-pages), le [menu et les barres de navigation](#menu-et-barre-de-navigation) sont-ils toujours à la même place (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque ensemble de pages, le menu et les barres de navigation sont-ils toujours à la même place (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), chaque page disposant d’un [menu et les barres de navigation](#menu-et-barre-de-navigation) vérifie-t-elle ces conditions (hors cas particuliers) ?", "Le [menu et les barres de navigation](#menu-et-barre-de-navigation) sont toujours à la même place dans la présentation ;", "Le [menu et les barres de navigation](#menu-et-barre-de-navigation) se présentent toujours dans le même ordre relatif dans le code source." ] }, "methodology": { "1": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer visuellement les deux pages et vérifier que le menu ou les barres de navigation sont toujours à la même place dans la présentation ;\n3. Comparer le code source (généré côté client) des deux pages et vérifier que le menu ou les barres de navigation se présentent toujours dans le même ordre relatif dans la structure ;\n4. Si c’est le cas, **le test est validé**.\n\nNote : le critère est non applicable dans les situations où :\n\n- Les pages d'un ensemble de pages sont le résultat ou une partie d'un processus (un processus de paiement ou de prise de commande, par exemple) ;\n- La page est la page d'accueil ;\n- Le site web est constitué d'une seule page." }, "techniques": ["G61", "F66"], "particularCases": [ "Il existe une gestion de cas particuliers lorsque :", "- La page est la page d’accueil ;", "- Le site web est constitué d’une seule page ;", "- Le changement fait suite à une modification initiée par l’utilisateur.", "Dans ces situations, le critère est non applicable." ], "wcag": ["3.2.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "12.3", "theme": 12, "title": { "fr": "La [page « plan du site »](#page-plan-du-site) est-elle pertinente ?" }, "titlePlain": { "fr": "La page « plan du site » est-elle pertinente ?" }, "tests": { "1": ["La [page « plan du site »](#page-plan-du-site) est-elle représentative de l’architecture générale du site ?"], "2": ["Les liens du [plan du site](#page-plan-du-site) sont-ils fonctionnels ?"], "3": ["Les liens du [plan du site](#page-plan-du-site) renvoient-ils bien vers les pages indiquées par l’intitulé ?"] }, "methodology": { "1": "1. Vérifier que le plan du site est représentatif de l’architecture générale du site (cf. note) ;\n2. Si c’est le cas, **le test est validé**.\n\nNote : Un plan du site trop complexe ou trop profond n'est pas recommandé pour aider à la navigation. Il n'est pas obligatoire que toutes les pages soient présentes dans le plan du site si elles peuvent être atteintes, par exemple, à partir de la page d'accueil d'une rubrique ou d'un catalogue.", "2": "1. Pour tous les liens du plan du site, vérifier qu’ils sont fonctionnels ;\n2. Si c’est le cas, **le test est validé**.", "3": "1. Pour tous les liens du plan du site, vérifier qu’ils sont à jour (ni obsolètes ni en erreur) et conduisent à la page indiquée par leur intitulé ;\n2. Si c’est le cas, **le test est validé**." }, "techniques": ["G63"], "wcag": ["2.4.5"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "12.4", "theme": 12, "title": { "fr": "Dans chaque [ensemble de pages](#ensemble-de-pages), la [page « plan du site »](#page-plan-du-site) est-elle accessible à partir d’une fonctionnalité identique ?" }, "titlePlain": { "fr": "Dans chaque ensemble de pages, la page « plan du site » est-elle accessible à partir d’une fonctionnalité identique ?" }, "tests": { "1": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), la [page « plan du site »](#page-plan-du-site) est-elle accessible à partir d’une fonctionnalité identique ?" ], "2": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), la fonctionnalité vers la [page « plan du site »](#page-plan-du-site) est-elle située à la même place dans la présentation ?" ], "3": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), la fonctionnalité vers la [page « plan du site »](#page-plan-du-site) se présente-t-elle toujours dans le même ordre relatif dans le code source ?" ] }, "methodology": { "1": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer le code source (généré côté client) des deux pages et vérifier que le moyen d’accès au plan du site est toujours le même (un lien ou un bouton, par exemple) ;\n3. Si c’est le cas, **le test est validé**.", "2": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer le code source (généré côté client) des deux pages et vérifier que le moyen d’accès au plan du site est toujours à la même place dans la structure (par rapport à l’ordre relatif des éléments de la page, par exemple il est toujours en haut de page) ;\n3. Si c’est le cas, **le test est validé**.", "3": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer visuellement les deux pages et vérifier que le moyen d’accès au plan du site est toujours à la même place dans la présentation ;\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G61", "G63"], "wcag": ["2.4.5", "3.2.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "12.5", "theme": 12, "title": { "fr": "Dans chaque [ensemble de pages](#ensemble-de-pages), le [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) est-il atteignable de manière identique ?" }, "titlePlain": { "fr": "Dans chaque ensemble de pages, le moteur de recherche est-il atteignable de manière identique ?" }, "tests": { "1": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), le [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) est-il accessible à partir d’une fonctionnalité identique ?" ], "2": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), la fonctionnalité vers le [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) est-elle située à la même place dans la présentation ?" ], "3": [ "Dans chaque [ensemble de pages](#ensemble-de-pages), la fonctionnalité vers le [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) se présente-t-elle toujours dans le même ordre relatif dans le code source ?" ] }, "methodology": { "1": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer le code source (généré côté client) des deux pages et vérifier que le moyen d’accès au moteur de recherche est toujours le même (un champ de formulaire, par exemple) ;\n3. Si c’est le cas, **le test est validé**.", "2": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer visuellement les deux pages et vérifier que le moyen d’accès au moteur de recherche est toujours à la même place dans la présentation ;\n3. Si c’est le cas, **le test est validé**.", "3": "1. Choisir une page de l’échantillon appartenant au même ensemble que la page en cours d’audit ;\n2. Comparer le code source (généré côté client) des deux pages et vérifier que le moyen d’accès au moteur de recherche est toujours à la même place dans la structure (par rapport à l’ordre relatif des éléments de la page, par exemple il est toujours en haut de page) ;\n3. Si c’est le cas, **le test est validé**." }, "techniques": ["G61", "F66"], "wcag": ["3.2.3"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "12.6", "theme": 12, "title": { "fr": "Les zones de regroupement de contenus présentes dans plusieurs pages web (zones d’[en-tête](#zone-d-en-tete), de [navigation principale](#menu-et-barre-de-navigation), de [contenu principal](#zone-de-contenu-principal), de [pied de page](#zone-de-pied-de-page) et de [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web)) peuvent-elles être atteintes ou évitées ?" }, "titlePlain": { "fr": "Les zones de regroupement de contenus présentes dans plusieurs pages web (zones d’en-tête, de navigation principale, de contenu principal, de pied de page et de moteur de recherche) peuvent-elles être atteintes ou évitées ?" }, "tests": { "1": [ "Dans chaque page web où elles sont présentes, la zone d’[en-tête](#zone-d-en-tete), de [navigation principale](#menu-et-barre-de-navigation), de [contenu principal](#zone-de-contenu-principal), de [pied de page](#zone-de-pied-de-page) et de [moteur de recherche](#moteur-de-recherche-interne-a-un-site-web) respectent-elles au moins une de ces conditions ?", "La zone possède un rôle WAI-ARIA de type [landmark](#landmarks) correspondant à sa nature ;", "La zone possède un titre dont le contenu permet de comprendre la nature du contenu de la zone ;", "La zone peut être masquée par le biais d’un bouton précédent directement la zone dans l’ordre du code source ;", "La zone peut être évitée par le biais d’un [lien d’évitement](#liens-d-evitement-ou-d-acces-rapide) précédent directement la zone dans l’ordre du code source ;", "La zone peut être atteinte par le biais d’un [lien d’accès rapide](#liens-d-evitement-ou-d-acces-rapide) visible ou, à défaut, visible à la prise de focus." ] }, "methodology": { "1": "1. Retrouver dans le document les zones de regroupement de contenus (zones d’en-tête, de navigation principale, de contenu principal, de pied de page et de moteur de recherche) ;\n2. Pour chaque zone, vérifier que la zone :\n - Soit possède un rôle WAI-ARIA de type landmark correspondant à sa nature ;\n - Soit possède un titre de hiérarchie dont le contenu permet de comprendre la nature du contenu de la zone ;\n - Soit peut être masquée au moyen d’un bouton précédant directement la zone dans l’ordre du code source ;\n - Soit peut être évitée au moyen d’un lien d’évitement précédant directement la zone dans l’ordre du code source ;\n - Soit peut être atteinte au moyen d’un lien d’accès rapide soit visible par défaut, soit visible à la prise de focus lors d’une tabulation.\n3. Si c’est le cas pour chaque zone de regroupement de contenus, **le test est validé**." }, "techniques": ["H69", "G115", "ARIA4", "ARIA11"], "wcag": ["1.3.1", "2.4.1", "4.1.2"], "appliesTo": { "ruleIds": ["axe:landmark-one-main", "missing-main-landmark", "multiple-main-landmark", "nav-landmark-missing", "nav-landmark-unnamed"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "axe:landmark-one-main", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "missing-main-landmark", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "multiple-main-landmark", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "nav-landmark-missing", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "nav-landmark-unnamed", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "12.7", "theme": 12, "title": { "fr": "Dans chaque page web, un [lien d’évitement ou d’accès rapide](#liens-d-evitement-ou-d-acces-rapide) à la [zone de contenu principal](#zone-de-contenu-principal) est-il présent (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, un lien d’évitement ou d’accès rapide à la zone de contenu principal est-il présent (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, un lien permet-il d’éviter la [zone de contenu principal](#zone-de-contenu-principal) ou d’y accéder (hors cas particuliers) ?" ], "2": [ "Dans chaque ensemble de pages, le [lien d’évitement ou d’accès rapide](#liens-d-evitement-ou-d-acces-rapide) à la [zone de contenu principal](#zone-de-contenu-principal) vérifie-t-il ces conditions (hors cas particuliers) ?", "Le lien est situé à la même place dans la présentation ;", "Le lien se présente toujours dans le même ordre relatif dans le code source ;", "Le lien est visible ou, à défaut, visible à la prise de focus ;", "Le lien est fonctionnel." ] }, "methodology": { "1": "1. Retrouver dans le document la zone de contenu principal (indiquée par l’élément main visible) ;\n2. Vérifier que la zone :\n - Soit peut être évitée au moyen d’un lien d’évitement précédant directement la zone dans l’ordre du code source ;\n - Soit peut être atteinte au moyen d’un lien d’accès rapide visible à la prise de focus lors d’une tabulation.\n3. Si c’est le cas, **le test est validé**.", "2": "1. Retrouver dans le document la zone de contenu principal (indiquée par l’élément main visible) ;\n2. Vérifier que le lien d’évitement ou d’accès rapide à la zone est :\n - Situé à la même place dans la présentation ;\n - Présent toujours dans le même ordre relatif dans le code source (généré côté client) ;\n - Visible à la prise de focus lors d’une tabulation ;\n - Fonctionnel.\n3. Si c’est le cas, **le test est validé**.\n\nNote : lorsque le site web est constitué d'une seule page, l'obligation de la présence d'un lien d'accès rapide est liée au contexte de la page (présence ou absence de navigation ou de contenus additionnels, par exemple). Le critère peut être considéré comme non applicable lorsqu'il est avéré qu'un lien d'accès rapide est inutile." }, "techniques": ["G1", "G59", "G123", "G124", "SCR28", "F66"], "particularCases": [ "Il existe une gestion de cas particuliers lorsque le site web est constitué d’une seule page.", "Dans ce cas de figure, l’obligation de la présence d’un lien d’accès rapide est liée au contexte de la page : présence ou absence de navigation ou de contenus additionnels, par exemple. Le critère peut être considéré comme non applicable lorsqu’il est avéré qu’un lien d’accès rapide est inutile." ], "wcag": ["2.4.1", "2.4.3", "3.2.3"], "appliesTo": { "ruleIds": ["axe:bypass", "axe:skip-link", "skip-link-target-missing"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "axe:bypass", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:skip-link", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "skip-link-target-missing", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "12.8", "theme": 12, "title": { "fr": "Dans chaque page web, l’[ordre de tabulation](#ordre-de-tabulation) est-il [cohérent](#comprehensible-ordre-de-lecture) ?" }, "titlePlain": { "fr": "Dans chaque page web, l’ordre de tabulation est-il cohérent ?" }, "tests": { "1": ["Dans chaque page web, l’[ordre de tabulation](#ordre-de-tabulation) dans le contenu est-il [cohérent](#comprehensible-ordre-de-lecture) ?"], "2": [ "Pour chaque [script](#script) qui met à jour ou insère un contenu, l’[ordre de tabulation](#ordre-de-tabulation) reste-t-il [cohérent](#comprehensible-ordre-de-lecture) ?" ] }, "methodology": { "1": "1. Parcourir dans le document l’ensemble des contenus au moyen de la touche de tabulation vers l’avant (touche Tab) et vers l’arrière (touches Maj+Tab) ;\n2. Vérifier que l’ordre de déplacement du focus reste cohérent relativement au contenu considéré (par exemple, l’ordre de tabulation dans une fenêtre modale ne doit considérer que les éléments d’interface présents au sein de cette fenêtre) ;\n3. Si c’est le cas, **le test est validé**.\n\nNote : il n'est pas obligatoire que la tabulation suive l'ordre de lecture naturel (de gauche à droite et de haut en bas par exemple) tant que les éléments sont accessibles dans un ordre cohérent.", "2": "1. Retrouver dans le document l’ensemble des contenus insérés au moyen d’un script (affichage d’éléments masqués, mise jour de contenu via AJAX par exemple) ;\n2. Positionner la tabulation sur l’élément déclencheur et l’activer ;\n3. Après l’affichage du contenu mis à jour, vérifier que la tabulation reste cohérente (repositionnement correct du focus) ;\n4. Si c’est le cas, **le test est validé**." }, "techniques": ["G59", "H4", "F44", "F85", "SCR26", "SCR27", "SCR37", "C27"], "wcag": ["2.4.3"], "appliesTo": { "ruleIds": ["axe:tabindex", "positive-tabindex"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "axe:tabindex", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "positive-tabindex", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "12.9", "theme": 12, "title": { "fr": "Dans chaque page web, la navigation ne doit pas contenir de piège au clavier. Cette règle est-elle respectée ?" }, "titlePlain": { "fr": "Dans chaque page web, la navigation ne doit pas contenir de piège au clavier. Cette règle est-elle respectée ?" }, "tests": { "1": [ "Dans chaque page web, chaque [élément recevant le focus](#prise-de-focus) vérifie-t-il une de ces conditions ?", "Il est possible d’atteindre l’élément suivant ou précédent pouvant recevoir le focus avec la touche de tabulation ;", "L’utilisateur est informé d’un mécanisme fonctionnel permettant d’atteindre au clavier l’élément suivant ou précédent pouvant recevoir le focus." ] }, "methodology": { "1": "1. Retrouver dans le document l’ensemble des éléments d’interface susceptibles de recevoir le focus (au moyen de la tabulation ou au moyen d’un script) ;\n2. Pour chaque élément d’interface, vérifier que l’utilisateur peut atteindre l’élément suivant ou précédent pouvant recevoir le focus :\n - Soit au moyen de la touche de tabulation (Tab ou Maj+Tab) ;\n - Soit au moyen d’une autre interaction clavier dont l’utilisateur est informé (par exemple, les flèches de direction).\n3. Si c’est le cas pour chaque élément d’interface, **le test est validé**.\n\nNote : certains éléments d'interface complexes, comme un groupe de boutons radio, une liste de sélection et tous les composants développés avec WAI-ARIA font appel à des navigations optimisées qui utilisent généralement les flèches de direction pour passer d'une partie du composant à l'autre. Par exemple, dans un groupe de boutons radio les options sont navigables avec les flèches de direction. De même dans un système d'onglets l'utilisateur active les onglets avec les flèches de direction. Le test sur le piège au clavier se limite alors à vérifier que le composant est atteint avec la tabulation et qu'il est possible de passer au composant suivant ou revenir au composant précédent." }, "techniques": ["G21", "H91", "F10"], "wcag": ["2.1.1", "2.1.2"], "appliesTo": { "ruleIds": ["dyn-keyboard-trap"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "dyn-keyboard-trap", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "12.10", "theme": 12, "title": { "fr": "Dans chaque page web, les [raccourcis clavier](#raccourci-clavier) n’utilisant qu’une seule touche (lettre minuscule ou majuscule, ponctuation, chiffre ou symbole) sont-ils contrôlables par l’utilisateur ?" }, "titlePlain": { "fr": "Dans chaque page web, les raccourcis clavier n’utilisant qu’une seule touche (lettre minuscule ou majuscule, ponctuation, chiffre ou symbole) sont-ils contrôlables par l’utilisateur ?" }, "tests": { "1": [ "Dans chaque page web, chaque [raccourci clavier](#raccourci-clavier) n’utilisant qu’une seule touche (lettre minuscule ou majuscule, ponctuation, chiffre ou symbole) vérifie-t-il l’une de ces conditions ?", "Un mécanisme est disponible pour désactiver le [raccourci clavier](#raccourci-clavier) ;", "Un mécanisme est disponible pour configurer la touche de [raccourci clavier](#raccourci-clavier) au moyen des touches de modification (Ctrl, Alt, Maj, etc.) ;", "Dans le cas d’un [composant d’interface](#composant-d-interface) utilisateur, le [raccourci clavier](#raccourci-clavier) qui lui est associé ne peut être activé que si le focus clavier est sur ce composant." ] }, "methodology": { "1": "1. Retrouver dans le document l’ensemble des raccourcis clavier proposés à l’utilisateur ;\n2. Pour chaque raccourci clavier, vérifier que :\n - Soit un mécanisme est disponible pour désactiver le raccourci clavier ;\n - Soit un mécanisme est disponible pour configurer la touche de raccourci clavier au moyen des touches de modification (Ctrl, Alt, Maj, etc.) ;\n - Soit, dans le cas d’un composant d’interface utilisateur, le raccourci clavier qui lui est associé ne peut être activé que si le focus clavier est sur ce composant.\n3. Si c’est le cas pour chaque raccourci clavier, **le test est validé**." }, "techniques": ["F99", "G217"], "wcag": ["2.1.4"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "12.11", "theme": 12, "title": { "fr": "Dans chaque page web, les contenus additionnels apparaissant au survol, à la prise de focus ou à l’activation d’un [composant d’interface](#composant-d-interface) sont-ils si nécessaire atteignables au clavier ?" }, "titlePlain": { "fr": "Dans chaque page web, les contenus additionnels apparaissant au survol, à la prise de focus ou à l’activation d’un composant d’interface sont-ils si nécessaire atteignables au clavier ?" }, "tests": { "1": [ "Dans chaque page web, les contenus additionnels apparaissant au survol, à la prise de focus ou à l’activation d’un [composant d’interface](#composant-d-interface) sont-ils si nécessaire atteignables au clavier ?" ] }, "methodology": { "1": "1. Retrouver dans le document l’ensemble des contenus additionnels apparaissant au survol, à la prise de focus ou à l’activation d’un composant d’interface ;\n2. Pour chaque contenu additionnel, s’il contient des composants d’interface avec lesquels l’utilisateur peut interagir au clavier (par exemple, une infobulle personnalisée qui propose un lien dans son contenu), vérifier que ces composants d’interface sont atteignables au clavier ;\n3. Si c’est le cas pour chaque contenu additionnel, **le test est validé**." }, "techniques": [], "technicalNote": [ "Ce critère adresse les situations où un contenu additionnel contient des [composants d’interface](#composant-d-interface) avec lesquels il doit être possible d’interagir au clavier. Par exemple, une infobulle personnalisée qui propose un lien dans son contenu." ], "wcag": ["2.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.1", "theme": 13, "title": { "fr": "Pour chaque page web, l’utilisateur a-t-il le contrôle de chaque limite de temps modifiant le contenu (hors cas particuliers) ?" }, "titlePlain": { "fr": "Pour chaque page web, l’utilisateur a-t-il le contrôle de chaque limite de temps modifiant le contenu (hors cas particuliers) ?" }, "tests": { "1": [ "Pour chaque page web, chaque [procédé de rafraîchissement](#procede-de-rafraichissement) (balise `<object>`, balise `<embed>`, balise `<svg>`, balise `<canvas>`, balise `<meta>`) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’utilisateur peut arrêter ou relancer le rafraîchissement ;", "L’utilisateur peut augmenter la limite de temps entre deux rafraîchissements de dix fois, au moins ;", "L’utilisateur est averti de l’imminence du rafraîchissement et dispose de vingt secondes, au moins, pour augmenter la limite de temps avant le prochain rafraîchissement ;", "La limite de temps entre deux rafraîchissements est de vingt heures, au moins." ], "2": ["Pour chaque page web, chaque procédé de [redirection](#redirection) effectué via une balise `<meta>` est-il immédiat (hors cas particuliers) ?"], "3": [ "Pour chaque page web, chaque procédé de [redirection](#redirection) effectué via un [script](#script) vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’utilisateur peut arrêter ou relancer la redirection ;", "L’utilisateur peut augmenter la limite de temps avant la redirection de dix fois, au moins ;", "L’utilisateur est averti de l’imminence de la redirection et dispose de vingt secondes, au moins, pour augmenter la limite de temps avant la prochaine redirection ;", "La limite de temps avant la redirection est de vingt heures, au moins." ], "4": [ "Pour chaque page web, chaque procédé limitant le temps d’une session vérifie-t-il une de ces conditions (hors cas particuliers) ?", "L’utilisateur peut supprimer la limite de temps ;", "L’utilisateur peut augmenter la limite de temps ;", "La limite de temps avant la fin de la session est de vingt heures au moins." ] }, "methodology": { "1": "1. Retrouver dans le document les rafraîchissements initiés dans le contenu par un élément `<object>`, `<embed>`, `<svg>`, `<canvas>` ou par un élément `<meta http-equiv=\"refresh\" content=\"[compteur]\">` (dans l’élément `<head>` de la page) ;\n2. Pour chaque rafraîchissement, vérifier que :\n - Soit la présence d’un mécanisme permet à l’utilisateur de stopper et de relancer le rafraîchissement ;\n - Soit la présence d’un mécanisme permet à l’utilisateur d’augmenter la limite de temps entre deux rafraîchissements de dix fois, au moins ;\n - Soit la présence d’un mécanisme qui avertit l’utilisateur de l’imminence du rafraîchissement, laisse 20 secondes, au moins, à l’utilisateur, pour augmenter la limite de temps avant le prochain rafraîchissement ;\n - Soit la limite de temps entre deux rafraîchissements est de vingt heures, au moins.\n3. Si c’est le cas, **le test est validé**.", "2": "1. Retrouver dans le document une redirection automatique initiée par un élément `<meta http-equiv=\"refresh\" content=\"0;URL='[URL ciblée]'\" />` ;\n2. Vérifier que la redirection est immédiate ;\n3. Si c’est le cas, **le test est validé**.", "3": "1. Retrouver dans le document les redirections automatiques initiées par un script (sous la forme d’un décompte par exemple) ;\n2. Pour chaque redirection automatique, vérifier que :\n - Soit la présence d’un mécanisme permet à l’utilisateur de stopper et relancer la redirection ;\n - Soit la présence d’un mécanisme permet à l’utilisateur d’augmenter la limite de temps avant le rafraîchissement de dix fois, au moins ;\n - Soit la présence d’un mécanisme qui avertit l’utilisateur de l’imminence du rafraîchissement, laisse 20 secondes, au moins, à l’utilisateur, pour augmenter la limite de temps avant le prochain rafraîchissement ;\n - Soit la limite de temps avant la redirection est de vingt heures, au moins.\n3. Si c’est le cas, **le test est validé**.", "4": "1. Retrouver dans le document les procédés limitant le temps d’une session (par exemple, après une authentification) ;\n2. Pour chaque procédé, vérifier que :\n - Soit la présence d’un mécanisme permet à l’utilisateur de supprimer la limite de temps ;\n - Soit la présence d’un mécanisme permet à l’utilisateur d’augmenter la limite de temps ;\n - Soit la limite de temps est de vingt heures, au moins.\n3. Si c’est le cas, **le test est validé**.\n\nNote : lorsque la limite de temps est essentielle, notamment lorsqu'elle ne pourrait pas être supprimée sans changer fondamentalement le contenu ou les fonctionnalités liées au contenu, le critère est non applicable. Par exemple, le rafraîchissement d'un flux RSS dans une page n'est pas une limite de temps essentielle ; le critère est applicable. En revanche, une redirection automatique qui amène vers la nouvelle version d'une page à partir d'une url obsolète est essentielle ; le critère est non applicable." }, "techniques": ["F40", "F41", "F58", "F61", "G75", "G76", "G110", "G133", "G180", "G186", "G198", "H76", "SCR1", "SCR16", "SCR36", "SVR1"], "particularCases": [ "Il existe une gestion de cas particuliers lorsque la limite de temps est essentielle, notamment lorsqu’elle ne pourrait pas être supprimée sans changer fondamentalement le contenu ou les fonctionnalités liées au contenu.", "Dans ces situations, le critère est non applicable. Par exemple, le rafraîchissement d’un flux RSS dans une page n’est pas une limite de temps essentielle ; le critère est applicable. En revanche, une redirection automatique qui amène vers la nouvelle version d’une page à partir d’une URL obsolète est essentielle ; le critère est non applicable." ], "wcag": ["2.2.1", "2.2.2"], "appliesTo": { "ruleIds": ["meta-refresh-redirect"] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment", "4": "judgment" }, "rules": [ { "id": "meta-refresh-redirect", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "13.2", "theme": 13, "title": { "fr": "Dans chaque page web, l’ouverture d’une nouvelle fenêtre ne doit pas être déclenchée sans action de l’utilisateur. Cette règle est-elle respectée ?" }, "titlePlain": { "fr": "Dans chaque page web, l’ouverture d’une nouvelle fenêtre ne doit pas être déclenchée sans action de l’utilisateur. Cette règle est-elle respectée ?" }, "tests": { "1": [ "Dans chaque page web, l’ouverture d’une nouvelle fenêtre ne doit pas être déclenchée sans action de l’utilisateur. Cette règle est-elle respectée ?" ] }, "methodology": { "1": "1. Vérifier qu’à l’ouverture du document, aucune nouvelle fenêtre (pop-up ou pop-under, par exemple) n’est ouverte.\n2. Si c’est le cas, **le test est validé**." }, "techniques": ["F55", "G107"], "wcag": ["3.2.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.3", "theme": 13, "title": { "fr": "Dans chaque page web, chaque document bureautique en téléchargement possède-t-il, si nécessaire, une [version accessible](#version-accessible-pour-un-document-en-telechargement) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque document bureautique en téléchargement possède-t-il, si nécessaire, une version accessible (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, chaque fonctionnalité de téléchargement d’un document bureautique vérifie-t-elle une de ces conditions ?", "Le document en téléchargement est compatible avec l'accessibilité ;", "Il en existe une version alternative en téléchargement compatible avec l'accessibilité ;", "Il en existe une version alternative au format HTML compatible avec l'accessibilité." ] }, "methodology": { "1": "1. Retrouver dans le document les liens et les contrôles de formulaire (un bouton de formulaire ou un formulaire de téléchargement par exemple) permettant de télécharger un fichier au format bureautique ;\n2. Pour chaque fichier au format bureautique, vérifier la présence d’une version alternative présentée comme accessible :\n - Pour les documents au format .pdf, analyser le fichier avec l’outil PAC (PDF Accessibility Checker) et vérifier l’absence d’erreur d’accessibilité dans le document (cf. note) ;\n - Pour les documents au format .doc ou .docx, analyser le fichier avec l’outil de vérification d’accessibilité de Microsoft Office (à partir de la version 2010) et vérifier l’absence d’erreur d’accessibilité (cf. note) ;\n - Pour les documents au format .odt, analyser le document avec l’éditeur OpenOffice et vérifier que l’ensemble des contenus est conforme avec la liste des critères « Liste document bureautique en téléchargement » (cf. note pour une méthode alternative) ;\n - Pour les documents au format EPUB/DAISY, analyser le document avec un éditeur EPUB/DAISY et vérifier que l’ensemble des contenus est conforme avec la liste des critères « Liste document bureautique en téléchargement ».\n - Pour les documents eux-mêmes au format .html, analyser l’accessibilité du document.\n3. Si c’est le cas pour chaque fichier au format bureautique, **le test est validé**.\n\nNote au sujet de l'outil PAC : l'outil analyse le document PDF du point de vue de l'accessibilité mais également de critères de qualité (par exemple la norme PDF/UA). Seules les erreurs relatives à des critères présents dans la liste des critères « Liste document bureautique en téléchargement » rendent le critère « Non conforme ». Par ailleurs, cet outil ne fonctionne que sur la plateforme Windows. Sur Mac, le contrôle doit se faire manuellement.\n\nNote au sujet Microsoft Office : le logiciel offre un vérificateur d'accessibilité en standard, (accessible via le menu « Fichier > Informations > Vérifier la présence de problèmes > Vérifier l'accessibilité »). Ce vérificateur peut être considérablement amélioré via le plugin Word Accessibility Plug-in (voir dans la section Outils). Ce plugin ne fonctionne que sur Windows. Sur Mac, le contrôle doit se faire manuellement.\n\nNote au sujet des documents au format .odt : OpenOffice et LibreOffice ne possèdent pas de vérificateur d'accessibilité. Une méthode plus rapide qu'une analyse manuelle peut consister à enregistrer le document au format .docx et le vérifier via le vérificateur d'accessibilité de Microsoft Office 2010. Attention cependant : cette méthode rapide est à réserver aux documents très simples car certaines informations liées à l'accessibilité ne sont pas correctement transcodées. C'est le cas des indications de langue, de certaines alternatives d'images ou d'en-têtes fusionnées sur les tableaux par exemple.\n\nNote au sujet du format EPUB : l'utilitaire Ace by DAISY App permet d'effectuer le travail de validation d'un fichier EPUB 3 de manière efficace.\n\nNote au sujet des documents dérogés : le référentiel propose un statut de dérogation dans certains cas (cf. guide d'accompagnement). Dans ce cas, les tests ne sont pas à réaliser, la version accessible étant fournie sur demande de l'utilisateur.\n\nNote à l'attention des personnes de droit privé mentionnées aux 2° à 4° du I de l’article 47 de la loi du 11 février 2005 : si les fichiers bureautiques (ex : PDF, documents Microsoft ou LibreOffice, etc.) ont été publiés avant le 23 septembre 2018 (sauf si ce sont des documents nécessaires pour accomplir une démarche administrative relevant des tâches effectuées par l'organisme concerné), ils sont exemptés de l’obligation d’accessibilité." }, "techniques": ["F15", "G10", "G135"], "particularCases": [ "Il existe une gestion de cas particuliers :", "- Pour les personnes de droit privé mentionnées aux 2° à 4° du I de l’article 47 de la loi du 11 février 2005 : si les fichiers bureautiques (ex : PDF, documents Microsoft ou LibreOffice, etc.) ont été publiés avant le 23 septembre 2018 (sauf si ce sont des documents nécessaires pour accomplir une démarche administrative relevant des tâches effectuées par l’organisme concerné), ils sont exemptés de l’obligation d’accessibilité.", "Dans cette situation, le critère est non applicable." ], "wcag": ["1.1.1", "1.3.1", "1.3.2", "2.4.1", "2.4.3", "3.1.1", "4.1.2"], "appliesTo": { "ruleIds": [] }, "judgment": true, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.4", "theme": 13, "title": { "fr": "Pour chaque document bureautique ayant une [version accessible](#version-accessible-pour-un-document-en-telechargement), cette version offre-t-elle la même information ?" }, "titlePlain": { "fr": "Pour chaque document bureautique ayant une version accessible, cette version offre-t-elle la même information ?" }, "tests": { "1": [ "Chaque document bureautique ayant une version accessible vérifie-t-il une de ces conditions ?", "La version compatible avec l’accessibilité offre la même information ;", "La version alternative au format HTML est pertinente et offre la même information." ] }, "methodology": { "1": "1. Retrouver dans le document les fichiers en téléchargement au format bureautique accompagné de leur version alternative accessible ;\n2. Pour chaque couple de fichiers, ouvrir les deux documents (le document d’origine et le document accessible) et vérifier que les deux documents apportent la même information ;\n3. Si c’est le cas pour chaque couple de fichiers, **le test est validé**." }, "techniques": ["F15", "G10", "G135"], "wcag": ["1.1.1", "1.3.1", "1.3.2", "2.4.1", "2.4.3", "3.1.1", "4.1.2"], "appliesTo": { "ruleIds": [] }, "judgment": true, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.5", "theme": 13, "title": { "fr": "Dans chaque page web, chaque contenu cryptique (art ASCII, émoticône, syntaxe cryptique) a-t-il une alternative ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque contenu cryptique (art ASCII, émoticône, syntaxe cryptique) a-t-il une alternative ?" }, "tests": { "1": [ "Dans chaque page web, chaque contenu cryptique (art ASCII, émoticône, syntaxe cryptique) vérifie-t-il une de ces conditions ?", "Un attribut title est disponible ;", "Une définition est donnée par le contexte adjacent." ] }, "methodology": { "1": "1. Retrouver dans le document les contenus cryptiques (art ASCII, émoticône, syntaxe cryptique) ;\n2. Pour chaque contenu cryptique, vérifier que :\n - Soit une définition est disponible au moyen d’un attribut `title`, sur un lien, un contrôle de formulaire, une abréviation (élément `<abbr>`) par exemple ;\n - Soit une définition est donnée dans le contexte adjacent (immédiatement avant ou après).\n3. Si c’est le cas pour chaque contenu cryptique, **le test est validé**." }, "techniques": ["F71", "F70", "G135", "H86"], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.6", "theme": 13, "title": { "fr": "Dans chaque page web, pour chaque contenu cryptique (art ASCII, émoticône, syntaxe cryptique) ayant une alternative, cette alternative est-elle pertinente ?" }, "titlePlain": { "fr": "Dans chaque page web, pour chaque contenu cryptique (art ASCII, émoticône, syntaxe cryptique) ayant une alternative, cette alternative est-elle pertinente ?" }, "tests": { "1": [ "Dans chaque page web, chaque contenu cryptique (art ASCII, émoticône, syntaxe cryptique) vérifie-t-il une de ces conditions ?", "Le contenu de l’attribut `title` est pertinent ;", "La définition donnée par le contexte adjacent est pertinente." ] }, "methodology": { "1": "1. Retrouver dans le document les contenus cryptiques (art ASCII, émoticône, syntaxe cryptique) ;\n2. Pour chaque contenu cryptique, vérifier que la définition donnée est pertinente.\n3. Si c’est le cas pour chaque contenu cryptique, **le test est validé**." }, "techniques": ["F71", "F72", "H86"], "wcag": ["1.1.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.7", "theme": 13, "title": { "fr": "Dans chaque page web, [les changements brusques de luminosité ou les effets de flash](#changement-brusque-de-luminosite-ou-effet-de-flash) sont-ils correctement utilisés ?" }, "titlePlain": { "fr": "Dans chaque page web, les changements brusques de luminosité ou les effets de flash sont-ils correctement utilisés ?" }, "tests": { "1": [ "Dans chaque page web, chaque image ou élément multimédia (balise `<video>`, balise `<img>`, balise `<svg>`, balise `<canvas>`, balise `<embed>` ou balise `<object>`) qui provoque un changement brusque de luminosité ou un effet de flash vérifie-t-il une de ces conditions ?", "La fréquence de l’effet est inférieure à 3 par seconde ;", "La surface totale cumulée des effets est inférieure ou égale à 21824 pixels." ], "2": [ "Dans chaque page web, chaque script qui provoque [un changement brusque de luminosité ou un effet de flash](#changement-brusque-de-luminosite-ou-effet-de-flash) vérifie-t-il une de ces conditions ?", "La fréquence de l’effet est inférieure à 3 par seconde ;", "La surface totale cumulée des effets est inférieure ou égale à 21824 pixels." ], "3": [ "Dans chaque page web, chaque mise en forme CSS qui provoque [un changement brusque de luminosité ou un effet de flash](#changement-brusque-de-luminosite-ou-effet-de-flash) vérifie-t-il une de ces conditions ?", "La fréquence de l’effet est inférieure à 3 par seconde ;", "La surface totale cumulée des effets est inférieure ou égale à 21824 pixels." ] }, "methodology": { "1": "1. Retrouver dans le document les contenus clignotants ou qui provoquent des effets de flash de type image animée, vidéo (cf. note) ou animation (éléments `<img>`, `<svg>`, `<canvas>`, `<embed>`, `<object>` ou `<video>`) ;\n2. Pour chaque contenu clignotant ou provoquant des effets de flash, vérifier que :\n - Soit la fréquence de l’effet est inférieur à 3 par seconde ;\n - Soit la surface cumulée est inférieure à 21824 pixels.\n3. Si c’est le cas pour chaque contenu clignotant ou provoquant des effets de flash, **le test est validé**.\n\nNote : l'évaluation de ce critère peut être complexe. Lorsque l'effet est géré par un script ou au moyen de CSS, l'analyse du code est suffisante. L'outil PEAT permet d'analyser les vidéos au format .avi, par exemple. Un exemple de vidéo ayant provoqué des crises d'épilepsie peut être consulté ici : London 2012 Olympics Seizure (https://www.youtube.com/watch?v=vs0hfhSje9M).", "2": "1. Retrouver dans le document les contenus clignotants ou qui provoquent des effets de flash obtenus au moyen d’un script ;\n2. Pour chaque contenu clignotant ou provoquant des effets de flash, vérifier que :\n - Soit la fréquence de l’effet est inférieur à 3 par seconde ;\n - Soit la surface cumulée est inférieure à 21824 pixels.\n3. Si c’est le cas pour chaque contenu clignotant ou provoquant des effets de flash, **le test est validé**.", "3": "1. Retrouver dans le document les contenus clignotants ou qui provoquent des effets de flash obtenus au moyen d’une animation CSS ;\n2. Pour chaque contenu clignotant ou provoquant des effets de flash, vérifier que :\n - Soit la fréquence de l’effet est inférieur à 3 par seconde ;\n - Soit la surface cumulée est inférieure à 21824 pixels.\n3. Si c’est le cas pour chaque contenu clignotant ou provoquant des effets de flash, **le test est validé**." }, "techniques": ["G15", "G19", "G176"], "wcag": ["2.3.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } }, { "id": "13.8", "theme": 13, "title": { "fr": "Dans chaque page web, chaque contenu en mouvement ou clignotant est-il [contrôlable](#controle-contenu-en-mouvement-ou-clignotant) par l’utilisateur ?" }, "titlePlain": { "fr": "Dans chaque page web, chaque contenu en mouvement ou clignotant est-il contrôlable par l’utilisateur ?" }, "tests": { "1": [ "Dans chaque page web, chaque contenu en mouvement déclenché automatiquement, vérifie-t-il une de ces conditions ?", "La durée du mouvement est inférieure ou égale à 5 secondes ;", "L’utilisateur peut arrêter et relancer le mouvement ;", "L’utilisateur peut afficher et masquer le contenu en mouvement ;", "L’utilisateur peut afficher la totalité de l’information sans le mouvement." ], "2": [ "Dans chaque page web, chaque contenu clignotant déclenché automatiquement, vérifie-t-il une de ces conditions ?", "La durée du clignotement est inférieure ou égale à 5 secondes ;", "L’utilisateur peut arrêter et relancer le clignotement ;", "L’utilisateur peut afficher et masquer le contenu clignotant ;", "L’utilisateur peut afficher la totalité de l’information sans le clignotement." ] }, "methodology": { "1": "1. Retrouver dans le document les contenus en mouvement (obtenus au moyen d’une image, d’un script ou d’un effet CSS) déclenchés automatiquement au chargement de la page ou lors de l’affichage d’un contenu (cf. note) ;\n2. Pour chaque contenu, vérifier que :\n - Soit la durée du mouvement est inférieure à 5 secondes ;\n - Soit la présence d’un mécanisme (un bouton, par exemple) permet d’arrêter et de relancer le mouvement ;\n - Soit la présence d’un mécanisme (un bouton, par exemple) permet de cacher et d’afficher à nouveau le contenu en mouvement ;\n - Soit la présence d’un mécanisme (un bouton, par exemple) permet d’afficher la totalité du contenu sans mouvement.\n3. Si c’est le cas pour chaque contenu en mouvement, **le test est validé**.", "2": "1. Retrouver dans le document les contenus clignotants (obtenus au moyen d’une image, d’un script ou d’un effet CSS) déclenchés automatiquement au chargement de la page ou lors de l’affichage d’un contenu (cf. note).\n2. Pour chaque contenu, vérifier que :\n - Soit la durée du clignotement est inférieure à 5 secondes ;\n - Soit la présence d’un mécanisme (un bouton, par exemple) permet d’arrêter et de relancer le clignotement ;\n - Soit la présence d’un mécanisme (un bouton, par exemple) permet de cacher et d’afficher à nouveau le contenu clignotant ;\n - Soit la présence d’un mécanisme (un bouton, par exemple) permet d’afficher la totalité du contenu clignotant.\n3. Si c’est le cas pour chaque contenu clignotant, **le test est validé**.\n\nNote : l'arrêt ou la mise en pause d'un contenu en mouvement ou clignotant au moyen de la prise de focus (par exemple, l'effet est suspendu uniquement pendant la prise de focus) n'est pas considéré comme un procédé conforme. Dans certains cas, le mouvement ne peut pas être arrêté, par exemple dans le cas d'une barre de progression, dans ce cas, le critère est non applicable." }, "techniques": ["F4", "F7", "F16", "F47", "F50", "G4", "G11", "G152", "G186", "G187", "G191", "SCR22", "SCR33", "SCR36", "SM11", "SM12"], "wcag": ["2.2.1", "2.2.2"], "appliesTo": { "ruleIds": ["axe:blink", "axe:marquee", "blink-marquee"] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [ { "id": "axe:blink", "tests": ["2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "axe:marquee", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." }, { "id": "blink-marquee", "tests": ["1", "2"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "13.9", "theme": 13, "title": { "fr": "Dans chaque page web, le contenu proposé est-il consultable quelle que soit l’orientation de l’écran (portrait ou paysage) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, le contenu proposé est-il consultable quelle que soit l’orientation de l’écran (portrait ou paysage) (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, chaque contenu vérifie-t-il ces conditions (hors cas particuliers) ?", "La consultation est possible quel que soit le mode d’orientation de l’écran ;", "Le contenu proposé reste le même quel que soit le mode d’orientation de l’écran utilisé même si sa présentation et le moyen d’y accéder peut différer." ] }, "methodology": { "1": "1. Consulter le document dans un mode d’orientation portrait puis dans un mode d’orientation paysage ;\n2. Vérifier que :\n - La consultation est possible quel que soit le mode d’orientation de l’écran.\n - Le contenu proposé reste le même quel que soit le mode d’orientation de l’écran utilisé même si sa présentation et le moyen d’y accéder peut différer.\n3. Si c’est le cas, **le test est validé**.\n\nNote : il existe des interfaces pour lesquelles l'orientation du périphérique est essentielle à leur utilisation. Dans ces situations, le critère est non applicable. Il peut s'agir d'interfaces de jeu, de piano, de dépôt de chèques bancaires, etc. Si l'interface est le seul moyen d'accéder au service proposé, une alternative devrait être mise en place pour pallier cette carence." }, "techniques": [], "particularCases": [ "Il existe des interfaces pour lesquelles l’orientation du périphérique est essentielle à leur utilisation.", "Dans ces situations, le critère est non applicable. Il peut s’agir d’interfaces de jeu, de piano, de dépôt de chèques bancaires, etc.", "Si l’interface est le seul moyen d’accéder au service proposé, une alternative devrait être mise en place pour pallier cette carence." ], "wcag": ["1.3.4"], "appliesTo": { "ruleIds": ["rendered-orientation-lock"] }, "automation": { "tests": { "1": "judgment" }, "rules": [ { "id": "rendered-orientation-lock", "tests": ["1"], "effect": "candidate", "rationale": "Useful engine evidence, but the RGAA test still has an alternative, applicability condition, relevance judgment, or particular case to adjudicate." } ] } }, { "id": "13.10", "theme": 13, "title": { "fr": "Dans chaque page web, les fonctionnalités utilisables ou disponibles au moyen d’un [geste complexe](#gestes-complexes-et-gestes-simples) peuvent-elles être également disponibles au moyen d’un [geste simple](#gestes-complexes-et-gestes-simples) (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, les fonctionnalités utilisables ou disponibles au moyen d’un geste complexe peuvent-elles être également disponibles au moyen d’un geste simple (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, chaque fonctionnalité utilisable ou disponible suite à un contact multipoint est-elle également utilisable ou disponible suite à un contact en un point unique de l’écran (hors cas particuliers)." ], "2": [ "Dans chaque page web, chaque fonctionnalité utilisable ou disponible suite à un geste basé sur le suivi d’une trajectoire sur l’écran est-elle également utilisable ou disponible suite à un contact en un point unique de l’écran (hors cas particuliers)." ] }, "methodology": { "1": "1. Retrouver dans le document les fonctionnalités utilisables ou disponibles au moyen d’une interaction au toucher de type contact multipoint ;\n2. Pour chaque fonctionnalité, vérifier qu’elle reste disponible au moyen d’une interaction au toucher de type contact en un point unique de l’écran (par exemple, la possibilité de consulter les éléments d’une liste par un mouvement de balayage horizontal droit ou gauche doit aussi être disponible au moyen de boutons “précédent” et “suivant” ou encore un geste de pincer et zoomer qui peut être alternativement réalisé au moyen de boutons “plus” et “moins”) ;\n3. Si c’est le cas pour chaque fonctionnalité utilisable ou disponible au moyen d’une interaction au toucher de type contact multipoint, **le test est validé**.", "2": "1. Retrouver dans le document les fonctionnalités utilisables ou disponibles au moyen d’une interaction au toucher qui implique le suivi d’une trajectoire sur l’écran ;\n2. Pour chaque fonctionnalité, vérifier qu’elle reste disponible au moyen d’une interaction au toucher de type contact en un point unique de l’écran (par exemple, la possibilité de composer son mot de passe en suivant une trajectoire sur un clavier virtuel doit aussi être disponible au moyen de pressions successives sur les touches du clavier) ;\n3. Si c’est le cas pour chaque fonctionnalité utilisable ou disponible au moyen d’une interaction au toucher qui implique le suivi d’une trajectoire sur l’écran, **le test est validé**.\n\nIl existe une gestion de cas particuliers dans deux types de situation :\n\n- Le critère ne s'applique qu'à des fonctionnalités mises en place par l'auteur du site. Il ne concerne donc pas les gestes requis par l'agent utilisateur ou le système d'exploitation.\n- Le critère ne s'applique pas aux fonctionnalités dont la réalisation d'un geste complexe est essentielle (exécuter le tracé d'une signature, par exemple)." }, "techniques": ["G215", "G216"], "particularCases": [ "Il existe une gestion de cas particuliers dans deux types de situation :", "- Le critère ne s’applique qu’à des fonctionnalités mises en place par l’auteur du site. Il ne concerne donc pas les gestes requis par l’agent utilisateur ou le système d’exploitation ;", "- Le critère ne s’applique pas aux fonctionnalités dont la réalisation d’un geste complexe est essentielle (exécuter le tracé d’une signature, par exemple)." ], "wcag": ["2.5.1"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment" }, "rules": [] } }, { "id": "13.11", "theme": 13, "title": { "fr": "Dans chaque page web, les actions déclenchées au moyen d’un dispositif de pointage sur un point unique de l’écran peuvent-elles faire l’objet d’une annulation (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, les actions déclenchées au moyen d’un dispositif de pointage sur un point unique de l’écran peuvent-elles faire l’objet d’une annulation (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, les actions déclenchées au moyen d’un dispositif de pointage sur un point unique de l’écran vérifient-elles l’une de ces conditions (hors cas particuliers) ?", "L’action est déclenchée au moment où le dispositif de pointage est [relâché ou relevé](#relache-ou-releve) ;", "L’action est déclenchée au moment où le dispositif de pointage est [pressé ou posé](#presse-ou-pose) puis annulée lorsque le dispositif de pointage est [relâché ou relevé](#relache-ou-releve) ;", "Un mécanisme est disponible pour abandonner (avant achèvement de l’action) ou annuler (après achèvement) l’exécution de l’action." ] }, "methodology": { "1": "1. Retrouver dans le document les actions déclenchées au moyen d’un dispositif de pointage sur un point unique de l’écran ;\n2. Pour chaque action, vérifier que :\n - Soit l’action est déclenchée au moment où le dispositif de pointage est relâché ou relevé ;\n - Soit l’action est déclenchée au moment où le dispositif de pointage est pressé ou posé puis annulée lorsque le dispositif de pointage est relâché ou relevé ;\n - Soit il existe un mécanisme pour abandonner (avant achèvement de l’action) ou annuler (après achèvement) l’exécution de l’action ; par exemple, lors d’une interaction de type glisser-déposer un relâchement du dispositif de pointage doit permettre d’abandonner l’interaction en cours et une fois la zone de dépôt atteinte, l’utilisateur doit rester en mesure d’annuler son opération de dépôt au moyen d’un dialogue de confirmation (choix de confirmer ou d’annuler le dépôt) ou par le fait de pouvoir replacer l’élément déposé à sa position initiale.\n3. Si c’est le cas pour chaque action déclenchée au moyen d’un dispositif de pointage sur un point unique de l’écran, **le test est validé**." }, "techniques": [], "technicalNote": [ "Deux exemples de mécanisme mis en place pour annuler ou abandonner une action déclenchée au moyen d’un dispositif de pointage sur un point unique de l’écran :", "- Une fenêtre modale permettant d’annuler l’action après son achèvement ;", "- Pour une fonction de glisser/déposer, le fait d’abandonner l’action si l’utilisateur relâche l’élément en dehors de la zone cible." ], "particularCases": [ "Il existe une gestion de cas particulier lorsque la fonctionnalité nécessite que le comportement attendu soit réalisé lors d’un événement descendant, par exemple, un émulateur de clavier dont les touches doivent s’activer à la pression comme sur un clavier physique. Dans ces situations, le critère est non applicable." ], "wcag": ["2.5.2"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment" }, "rules": [] } }, { "id": "13.12", "theme": 13, "title": { "fr": "Dans chaque page web, les fonctionnalités qui impliquent un mouvement de l’appareil ou vers l’appareil peuvent-elles être satisfaites de manière alternative (hors cas particuliers) ?" }, "titlePlain": { "fr": "Dans chaque page web, les fonctionnalités qui impliquent un mouvement de l’appareil ou vers l’appareil peuvent-elles être satisfaites de manière alternative (hors cas particuliers) ?" }, "tests": { "1": [ "Dans chaque page web, les fonctionnalités disponibles en bougeant l’appareil peuvent-elles être accomplies avec des [composants d’interface](#composant-d-interface) utilisateur (hors cas particuliers) ?" ], "2": [ "Dans chaque page web, les fonctionnalités disponibles en faisant un geste en direction de l’appareil peuvent-elles être accomplies avec des [composants d’interface](#composant-d-interface) utilisateur (hors cas particuliers) ?" ], "3": [ "L’utilisateur a-t-il la possibilité de désactiver la détection du mouvement pour éviter un déclenchement accidentel de la fonctionnalité (hors cas particuliers) ?" ] }, "methodology": { "1": "1. Retrouver dans le document les fonctionnalités disponibles en bougeant l’appareil ;\n2. Pour chaque fonctionnalité, vérifier qu’elle peut être accomplie au moyen de composants d’interface utilisateur ;\n3. Si c’est le cas pour chaque fonctionnalité disponible en bougeant l’appareil, **le test est validé**.", "2": "1. Retrouver dans le document les fonctionnalités disponibles en faisant un geste en direction de l’appareil ;\n2. Pour chaque fonctionnalité, vérifier qu’elle peut être accomplie au moyen de composants d’interface utilisateur ;\n3. Si c’est le cas pour chaque fonctionnalité disponible en faisant un geste en direction de l’appareil, **le test est validé**.", "3": "1. Retrouver dans le document les fonctionnalités disponibles en mettant en mouvement l’appareil ;\n2. Vérifier si l’utilisateur à la possibilité de désactiver la détection du mouvement ;\n3. Si c’est le cas, pour chaque fonctionnalité, vérifier qu’elle ne peut pas être déclenchée ;\n4. Si c’est le cas pour chaque fonctionnalité disponible en mettant en mouvement l’appareil, **le test est validé**." }, "techniques": [], "particularCases": [ "Il existe une gestion de cas particulier lorsque :", "- Le mouvement est essentiel à l’accomplissement de la fonctionnalité (ex. podomètre) ;", "- La détection du mouvement est utilisée pour contrôler une fonctionnalité au travers d’une interface compatible avec l’accessibilité." ], "wcag": ["2.5.4"], "appliesTo": { "ruleIds": [] }, "automation": { "tests": { "1": "judgment", "2": "judgment", "3": "judgment" }, "rules": [] } } ] }