Note de révision

Test 1.1.3 : Chaque bouton de formulaire (balise input avec l'attribut type="image") a-t-il un attribut alt ?

Test 1.1.3 : Chaque bouton de type image (balise input avec l'attribut type="image") a-t-il un attribut alt ?

Test 1.3.3 : Chaque bouton associé à une image (balise input avec l'attribut type="image"), ayant un attribut alt, vérifie-t-il ces conditions (hors cas particuliers) ?

Test 1.3.3 : Chaque bouton de type image (balise input avec l'attribut type="image"), ayant un attribut alt, vérifie-t-il ces conditions (hors cas particuliers) ?

Test 1.2.3 : Chaque image objet (balise object avec l'attribut type="image/…") de décoration, sans légende, vérifie-t-elle ces conditions ?

• La balise object possède un attribut aria-hidden="true" ;
• L'alternative textuelle entre <object> et </object> est vide ;
• La balise object ou l'un de ses enfants est dépourvue de rôle, propriété ou état ARIA visant à labelliser l'image (aria-label, aria-describedby, aria-labelledby par exemple).

Test 1.2.3 : Chaque image objet (balise object avec l'attribut type="image/…") de décoration, sans légende, vérifie-t-elle ces conditions ?

• La balise object possède un attribut aria-hidden="true".
• L'alternative textuelle entre <object> et </object> est vide.
• La balise object ou l'un de ses enfants est dépourvue d'attribut title.
• La balise object ou l'un de ses enfants est dépourvue de rôle, propriété ou état ARIA visant à labelliser l'image (aria-label, aria-describedby, aria-labelledby par exemple).

Test 1.2.5 : Chaque image bitmap (balise canvas) de décoration, sans légende, vérifie-t-elle ces conditions ?

• La balise canvas possède un attribut aria-hidden="true" ;
• Le contenu entre <canvas> et </canvas> est dépourvue de contenus textuels ;
• La balise canvas ou l'un de ses enfants est dépourvue de rôle, propriété ou état ARIA visant à labelliser l'image (aria-label, aria-describedby, aria-labelledby par exemple).

Test 1.2.5 : Chaque image bitmap (balise canvas) de décoration, sans légende, vérifie-t-elle ces conditions ?

• La balise canvas possède un attribut aria-hidden="true".
• Le contenu entre <canvas> et </canvas> est dépourvue de contenus textuels.
• La balise canvas ou l'un de ses enfants est dépourvue d'attribut title.
• La balise canvas ou l'un de ses enfants est dépourvue de rôle, propriété ou état ARIA visant à labelliser l'image (aria-label, aria-describedby, aria-labelledby par exemple).

Test 1.2.6 : Chaque image embarquée (balise embed avec l'attribut type="image/…") de décoration, sans légende, vérifie-t-elle ces conditions ?

• La balise embed possède un attribut aria-hidden="true" ;
• La balise embed ou l'un de ses enfants est dépourvue de rôle, propriété ou état ARIA visant à labelliser l'image (aria-label, aria-describedby, aria-labelledby par exemple).

Test 1.2.6 : Chaque image embarquée (balise embed avec l'attribut type="image/…") de décoration, sans légende, vérifie-t-elle ces conditions ?

• La balise embed possède un attribut aria-hidden="true".
• La balise embed ou l'un de ses enfants est dépourvue d'attribut title.
• La balise embed ou l'un de ses enfants est dépourvue de rôle, propriété ou état ARIA visant à labelliser l'image (aria-label, aria-describedby, aria-labelledby par exemple).

Test 1.3.8 : Chaque image vectorielle (balise svg) porteuse d'information, en l'absence d'alternative, vérifie-t-elle ces conditions (hors cas particuliers) ?

• La balise svg possède un role="img" ;
• La balise svg possède une propriété aria-label dont le contenu est pertinent et identique à l'attribut title s'il est présent ;
• La balise svg possède une balise desc dont le contenu est pertinent et contient un passage de texte identique à la propriété aria-label et à l'attribut title de la balise svg s'il est présent.

Test 1.3.8 : Chaque image vectorielle (balise svg) porteuse d'information, en l'absence d'alternative, vérifie-t-elle ces conditions (hors cas particuliers) ?

• La balise svg possède un role="img".
• La balise svg possède une propriété aria-label dont le contenu est pertinent et identique à l'attribut title s'il est présent.
• La balise svg possède une balise <title> dont le contenu est pertinent et contient un passage de texte identique à la propriété aria-label.

Test 1.4.8 : Chaque image vectorielle (balise svg) utilisée comme CAPTCHA ou comme image-test, en l'absence d'alternative, vérifie-t-elle ces conditions ?

• La balise svg possède un role="img" ;
• La balise svg possède une propriété aria-label dont le contenu permet de comprendre la nature et la fonction de l'image et identique à l'attribut title s'il est présent ;
• La balise svg possède une balise desc dont le contenu permet de comprendre la nature et la fonction de l'image et identique à la propriété aria-label et à l'attribut title de la balise svg s'il est présent ;
• Un lien adjacent permet d'accéder à une alternative dont le contenu permet de comprendre la nature et la fonction de l'image et identique à la propriété aria-label et à l'attribut title de la balise svg s'il est présent.

Test 1.4.8 : Chaque image vectorielle (balise svg) utilisée comme CAPTCHA ou comme image-test, en l'absence d'alternative, vérifie-t-elle ces conditions ?

• La balise svg possède un role="img".
• La balise svg possède une propriété aria-label dont le contenu permet de comprendre la nature et la fonction de l'image et identique à l'attribut title s'il est présent.
• La balise svg possède une balise <title> dont le contenu permet de comprendre la nature et la fonction de l'image et identique à la propriété aria-label.
• Un lien adjacent permet d'accéder à une alternative dont le contenu permet de comprendre la nature et la fonction de l'image et identique à la propriété aria-label.

Test 1.4.12 : Pour chaque image bitmap (balise canvas) utilisée comme CAPTCHA ou comme image-test, ayant une alternative textuelle, l'alternative textuelle est-elle correctement restituée par les technologies d'assistance ?

Test 1.4.12 : Pour chaque image bitmap (balise <canvas>) utilisée comme CAPTCHA ou comme image-test, ayant une alternative (contenu entre <canvas> et </canvas>), cette alternative est-elle correctement restituée par les technologies d'assistance ?

Test 1.6.5 : Chaque bouton de type image (balise input avec l'attribut type="image") porteur d'information, qui implémente une référence à une description détaillée adjacente via une propriété aria-describedby, vérifie-t-il ces conditions ?

Test 1.6.5 : Chaque bouton de type image (balise input avec l'attribut type="image") porteur d'information, qui implémente une référence à une description détaillée via une propriété aria-describedby, vérifie-t-il ces conditions ?

Test 1.6.6 : Chaque image vectorielle (balise svg) porteuse d'information, qui nécessite une description détaillée, vérifie-t-elle une de ces conditions ?

• Il existe une propriété aria-label contenant une référence à une description détaillée adjacente à l'image vectorielle ;
• Il existe une balise desc contenant une référence à une description détaillée adjacente à l'image vectorielle ;
• Il existe une balise desc contenant la description détaillée ;
• Il existe un lien adjacent (via une url ou une ancre) permettant d'accéder au contenu de la description détaillée.

Test 1.6.6 : Chaque image vectorielle (balise svg) porteuse d'information, qui nécessite une description détaillée, vérifie-t-elle une de ces conditions ?

• Il existe une propriété aria-label contenant une référence à une description détaillée adjacente à l'image vectorielle.
• La balise <title> contient une référence à une description détaillée adjacente à l'image vectorielle.
• Il existe une balise desc contenant la description détaillée.
• Il existe un lien adjacent (via une url ou une ancre) permettant d'accéder au contenu de la description détaillée.

Test 1.7.1 : Chaque image (balise img) porteuse d'information, ayant une description détaillée, vérifie-t-elle une de ces conditions ?

• La description détaillée via l'adresse référencée dans l'attribut longdesc est pertinente ;
• La description détaillée dans la page et signalée dans l'attribut alt est pertinente ;
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.1 : Chaque image (balise img) porteuse d'information, ayant une description détaillée, vérifie-t-elle ces conditions ?

• La description détaillée via l'adresse référencée dans l'attribut longdesc est pertinente.
• La description détaillée dans la page et signalée dans l'attribut alt est pertinente.
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.3 : Chaque image objet (balise object avec l'attribut type="image/…") porteuse d'information, ayant une description détaillée, vérifie-t-elle une de ces conditions ?

• La description détaillée adjacente à l'image objet est pertinente ;
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.3 : Chaque image objet (balise object avec l'attribut type="image/…") porteuse d'information, ayant une description détaillée, vérifie-t-elle ces conditions ?

• La description détaillée adjacente à l'image objet est pertinente.
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.4 : Chaque image embarquée (balise embed avec l'attribut type="image/…") porteuse d'information, ayant une description détaillée, vérifie-t-elle une de ces conditions ?

• La description détaillée adjacente à l'image embarquée est pertinente ;
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.4 : Chaque image embarquée (balise embed avec l'attribut type="image/…") porteuse d'information, ayant une description détaillée, vérifie-t-elle ces conditions ?

• La description détaillée adjacente à l'image embarquée est pertinente.
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.7 : Chaque image bitmap (balise canvas) porteuse d'information, ayant undescription détaillée, vérifie-t-elle une de ces conditions ?

• La description détaillée adjacente à l'image bitmap est pertinente ;
• La description détaillée contenue entre <canvas> et </canvas> est pertinente ;
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.7 : Chaque image bitmap (balise canvas) porteuse d'information, ayant undescription détaillée, vérifie-t-elle ces conditions ?

• La description détaillée adjacente à l'image bitmap est pertinente.
• La description détaillée contenue entre <canvas> et </canvas> est pertinente.
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.2 : Chaque bouton de type image (balise input avec l'attribut type="image") porteur d'information, ayant une description détaillée, vérifie-t-il une de ces conditions ?

• La description détaillée via l'adresse référencée dans l'attribut longdesc est pertinente ;
• La description détaillée dans la page et signalée dans l'attribut alt est pertinente ;
• La description détaillée via un lien adjacent est pertinente ;
• Le passage de texte référencé via la propriété aria-describedby est pertinent.

Test 1.7.2 : Chaque bouton de type image (balise input avec l'attribut type="image") porteur d'information, ayant une description détaillée, vérifie-t-il ces conditions ?

• La description détaillée dans la page et signalée dans l'attribut alt est pertinente.
• La description détaillée via un lien adjacent est pertinente.
• Le passage de texte référencé via la propriété aria-describedby est pertinent.

Test 1.7.5 : Chaque image vectorielle (balise svg) porteuse d'information, ayant une description détaillée, vérifie-t-elle une de ces conditions ?

• La description détaillée adjacente à l'image vectorielle est pertinente ;
• La description détaillée contenue dans la balise desc est pertinente ;
• La description détaillée via un lien adjacent est pertinente.

Test 1.7.5 : Chaque image vectorielle (balise svg) porteuse d'information, ayant une description détaillée, vérifie-t-elle ces conditions ?

• La description détaillée adjacente à l'image vectorielle et signalée dans la propriété aria-label ou la balise desc est pertinente.
• La description détaillée contenue dans la balise desc est pertinente.
• La description détaillée via un lien adjacent est pertinente.

Test 3.3.5 : Chaque mécanisme qui permet d'afficher le texte avec un rapport de contraste conforme a-t-il un rapport de contraste supérieur ou égal à 4,5:1 ?

Test 3.3.5 : Chaque mécanisme qui permet d'afficher le texte avec un rapport de contraste conforme a-t-il un rapport de contraste supérieur ou égal à 7:1 ?

Test 4.1.2 : Chaque média temporel 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 » accessible via un lien adjacent (une url ou une ancre) ;
• Il existe une transcription textuelle accessible via un lien adjacent (une url ou une ancre) ;
• Il existe une transcription textuelle adjacente clairement identifiable ;
• Il existe une audio-description synchronisée ;
• Il existe une version alternative avec une audio-description synchronisée accessible via un lien adjacent (une url ou une ancre).

Test 4.1.2 : Chaque média temporel 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 » accessible via un lien adjacent (une url ou une ancre).
• Il existe une version alternative « audio seulement » adjacente clairement identifiable.
• Il existe une transcription textuelle accessible via un lien adjacent (une url ou une ancre).
• Il existe une transcription textuelle adjacente clairement identifiable.
• Il existe une audiodescription synchronisée.
• Il existe une version alternative avec une audiodescription synchronisée accessible via un lien adjacent (une url ou une ancre).

Test 4.14.2 : Chaque média temporel synchronisé ayant une transcription textuelle, celle-ci est-elle pertinente ?

Test 4.14.2 : Pour chaque média temporel synchronisé ayant une transcription textuelle, celle-ci est-elle pertinente ?

Test 4.22.1 : Chaque média temporel et non temporel inséré via une balise object ou embed vérifie-t-il une de ces conditions (hors cas particuliers) ?

Test 4.22.1 : Chaque média temporel et non temporel vérifie-t-il une de ces conditions (hors cas particuliers) ?

Test 4.22.2 : Chaque média temporel et non temporel inséré via une balise object ou embed, qui possède une alternative compatible avec les technologies d'assistance, vérifie-t-il une de ces conditions ?

Test 4.22.2 : Chaque média temporel et non temporel qui possède une alternative compatible avec les technologies d'assistance, vérifie-t-il une de ces conditions ?

Test 5.5.1 : Pour chaque tableau de données (balise table) ayant une balise caption, le contenu de cette balise donne-t-il le titre du tableau ?

Test 5.5.1 : Pour chaque tableau de données (balise table) ayant un titre de tableau dans la balise caption, le titre est-il pertinent ?

Test 5.8.1 : Chaque tableau de mise en forme (balise table) vérifie-t-il ces conditions ?

• Le tableau de mise en forme (balise table) ne possède pas de balises caption, th, thead, tfoot ;
• Les cellules du tableau de mise en forme (balise td) ne possèdent pas d'attributs scope, headers, colgroup, axis.

Test 5.8.1 : Chaque tableau de mise en forme (balise table) vérifie-t-il ces conditions ?

• Le tableau de mise en forme (balise table) ne possède pas de balises caption, th, thead, tfoot, colgroup.
• Les cellules du tableau de mise en forme (balise td) ne possèdent pas d'attributs scope, headers, axis.

Test 6.3.2 : Chaque intitulé de lien image est-il explicite hors contexte (hors cas particuliers) ?

Test 6.3.2 : Chaque lien image vérifie-t-il une de ces conditions (hors cas particuliers) ?

• L'intitulé du lien image est explicite hors contexte.
• Un mécanisme permet à l'utilisateur d'obtenir un intitulé de lien explicite hors contexte.
• Le contenu du titre de lien (attribut title) est explicite hors contexte.

Test 6.3.3 : Chaque lien composite (contenu texte et de l'attribut alt) est-il explicite hors contexte (hors cas particuliers) ?

Test 6.3.3 : Chaque lien composite vérifie-t-il une de ces conditions (hors cas particuliers) ?

• L'intitulé du lien composite est explicite hors contexte.
• Un mécanisme permet à l'utilisateur d'obtenir un intitulé de lien explicite hors contexte.
• Le contenu du titre de lien (attribut title) est explicite hors contexte.

Test 7.1.5 : Chaque script qui génère ou contrôle un composant d'interface via des rôles, des états ou des propriétés définis par l'API ARIA respecte-t-il une de ces conditions ?

• Le composant d'interface est correctement restitué par les technologies d'assistance ;
• Une alternative accessible permet d'accéder aux mêmes fonctionnalités.

Test 7.1.5 : Chaque script qui génère ou contrôle un composant d'interface respecte-t-il une de ces conditions ?

• Le composant d'interface est correctement restitué par les technologies d'assistance.
• Une alternative accessible permet d'accéder aux mêmes fonctionnalités.

Test 7.1.7 : Chaque script qui génère ou contrôle un composant d'interface vérifie-t-il ces conditions ?

• Le composant possède un nom pertinent.
• Le composant possède un rôle pertinent.

Test 8.10.1 : Dans chaque page Web, chaque texte dont le sens de lecture est différent du sens de lecture par défaut vérifie-t-il ces conditions ?

• Le texte est contenu dans une balise possédant un attribut dir ;
• La valeur de l'attribut dir est conforme (rtl ou ltr) ;
• La valeur de l'attribut dir est pertinente.

Test 8.10.1 : Dans chaque page web, chaque texte dont le sens de lecture est différent du sens de lecture par défaut est contenu dans une balise possédant un attribut dir ?

Critère 10.4 [AA] Dans chaque page Web, le texte reste-t-il lisible lorsque la taille des caractères est augmentée jusqu'à 200%, au moins ?

• Test 10.4.1 : Dans les feuilles de styles du site Web, les unités non relatives (pt, pc, mm, cm, in) ne doivent pas être utilisées pour les types de média screen, tv, handheld, projection. Cette règle est-elle respectée ?
• Test 10.4.2 : Dans les feuilles de styles du site Web, pour les types de média screen, tv, handheld, projection, les tailles de caractères utilisent-elles uniquement des unités relatives ?
• Test 10.4.3 : Dans chaque page Web, l'augmentation de la taille des caractères jusqu'à 200%, au moins, ne doit pas provoquer de perte d'information. Cette règle est-elle respectée ?

Critère 10.4 [AA] 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) ?

• Test 10.4.1 : Dans les feuilles de styles du site web, les unités non relatives (pt, pc, mm, cm, in) ne doivent pas être utilisées pour les types de média screen, tv, handheld, projection. Cette règle est-elle respectée (hors cas particuliers) ?
• Test 10.4.2 : Dans les feuilles de styles du site web, pour les types de média screen, tv, handheld, projection, les tailles de caractères utilisent-elles uniquement des unités relatives (hors cas particuliers) ?
• Test 10.4.3 : Dans chaque page web, l'augmentation de la taille des caractères jusqu'à 200%, au moins, ne doit pas provoquer de perte d'information. Cette règle est-elle respectée ?

Test 11.1.3 : Chaque champ de formulaire associé à une étiquette via la propriété ARIA aria-labelledby, vérifie-t-il ces conditions ?

• L'étiquettepossède un attribut id ;
• La valeur de l'attribut id est unique ;
• Les valeurs de la propriété ARIA aria-labelledby sont égales à la valeur des attributs id des passages de textes utilisés pour créer l'étiquette ;
• L'étiquetteliée par la propriété ARIA aria-labelledby est visible à la prise de focus au moins.

Test 11.1.3 : Chaque champ de formulaire associé à une étiquette via la propriété ARIA aria-labelledby, vérifie-t-il ces conditions ?

• L'étiquettepossède un attribut id.
• La valeur de l'attribut id est unique.
• Les valeurs de la propriété ARIA aria-labelledby sont égales à la valeur des attributs id des passages de textes utilisés pour créer l'étiquette.

Test 11.1.4 : Chaque champ de formulaire qui utilise une propriété ARIA aria-label doit être accompagné d'un passage de texte visible et accolé au champ permettant de comprendre la nature de la saisie attendue. Cette règle est-elle respectée ?

Test 11.1.4 : Chaque champ de formulaire qui utilise une propriété ARIA aria-label ou aria-labelledby est-il, si nécessaire, accompagné d'un passage de texte visible et accolé au champ permettant de comprendre la nature de la saisie attendue ?

Test 11.5.1 : Dans chaque formulaire, les informations de même nature sont-elles regroupées via une balise fieldset, si nécessaire ?

Test 11.5.1 : Dans chaque formulaire, les informations de même nature sont-elles regroupées, si nécessaire ?

Test 11.6.1 : Chaque regroupement de champs de formulaire (balise fieldset) est-il suivi dans le code source par une légende (balise legend) ?

Test 11.6.1 : Chaque regroupement de champs de formulaire possède-t-il une légende ?

Test 11.7.1 : Dans chaque formulaire, chaque légende (balise legend) associée à un groupement de champs de formulaire (balise fieldset) est-elle pertinente ?

Test 11.7.1 : Dans chaque formulaire, chaque légende associée à un groupement de champs de formulaire est-elle pertinente ?

Test 11.9.1 : Dans chaque formulaire, l'intitulé de chaque bouton vérifie-t-il une de ces conditions ?

• Le contenu de l'attribut value des boutons de formulaire de type submit, reset ou button est pertinent.
• Le contenu de la balise <button> est pertinent.
• Le contenu de l'attribut title est pertinent.
• Le contenu de la propriété ARIA aria-label est pertinent.
• Un passage de texte est lié au bouton via une propriété aria-labelledby.

Test 11.9.1 : Dans chaque formulaire, l'intitulé de chaque bouton vérifie-t-il ces conditions ?

• Le contenu de l'attribut value des boutons de formulaire de type submit, reset ou button est pertinent.
• Le contenu de la balise <button> est pertinent.
• Le contenu de l'attribut title est pertinent.
• Le contenu de la propriété ARIA aria-label est pertinent.
• Un passage de texte est lié au bouton via une propriété aria-labelledby.

Test 11.9.2 : Dans chaque formulaire, l'intitulé de chaque bouton implémenté via une propriété ARIA aria-labelledby vérifie-t-il ces conditions ?

• Le passage de texte servant d'intitulé possède un attribut id ;
• La valeur de l'attribut id est unique ;
• Les valeurs de la propriété ARIA aria-labelledby sont égales aux valeurs des attributs id des passages de texte utilisés pour créer l'étiquette ;
• Le passage de texte est pertinent.

Test 11.9.2 : Dans chaque formulaire, l'intitulé de chaque bouton implémenté via une propriété ARIA aria-labelledby vérifie-t-il ces conditions ?

• Le passage de texte servant d'intitulé possède un attribut id.
• La valeur de l'attribut id est unique.
• Les valeurs de la propriété ARIA aria-labelledby sont égales aux valeurs des attributs id des passages de texte utilisés pour créer l'intitulé.
• Le passage de texte est pertinent.

Test 11.10.1 : Pour chaque formulaire, les indications de champs obligatoires vérifient-elles une de ces conditions ?

• L'indication de champ obligatoire est donnée par un passage de texte situé avant le champ de formulaire ;
• L'indication de champ obligatoire est donnée via un attribut required ;
• L'indication de champ obligatoire est donnée via la propriété ARIA aria-required ;
• L'indication de champ obligatoire est donnée dans l'étiquette (balise label, attribut title, propriété ARIA aria-label, passage de texte lié via la propriété ARIA aria-labelledby) du champ de formulaire ;
• L'indication de champ obligatoire est donnée par un passage de texte lié par la propriété ARIA aria-describedby.

Test 11.10.1 : Pour chaque formulaire, les indications de champs obligatoires vérifient-elles une de ces conditions ?

• L'indication de champ obligatoire est donnée par un passage de texte situé avant le champ de formulaire.
• L'indication de champ obligatoire est donnée via un attribut required.
• L'indication de champ obligatoire est donnée via la propriété ARIA aria-required.
• L'indication de champ obligatoire est donnée dans l'étiquette du champ de formulaire.
• L'indication de champ obligatoire est donnée par un passage de texte lié par la propriété ARIA aria-describedby.

Test 11.10.4 : Pour chaque formulaire, les erreurs de saisie vérifient-elles une de ces conditions ?

• L'erreur de saisie est indiquée dans l'étiquette (balise label, attribut title, propriété ARIA aria-label, passage de texte lié via la propriété ARIA aria-labelledby) du champ de formulaire ;
• L'erreur de saisie est indiquée par un passage de texte avant le champ de formulaire ;
• Le champ de formulaire possède un type qui produit de manière automatique un message d'erreur de saisie ;
• L'erreur de saisie est indiquée par un passage de texte lié par la propriété ARIA aria-describedby ;
• L'erreur de saisie est indiquée via la propriété ARIA aria-invalid.;

Test 11.10.4 : Pour chaque formulaire, les erreurs de saisie vérifient-elles une de ces conditions ?

• L'erreur de saisie est indiquée dans l'étiquette du champ de formulaire.
• L'erreur de saisie est indiquée par un passage de texte avant le champ de formulaire.
• Le champ de formulaire possède un type qui produit de manière automatique un message d'erreur de saisie.
• L'erreur de saisie est indiquée par un passage de texte lié par la propriété ARIA aria-describedby.
• L'erreur de saisie est indiquée via la propriété ARIA aria-invalid.

Test 11.14.1 : Chaque formulaire vérifie-t-il une de ces conditions ?

• Il existe un lien vers une page d'aide ;
• Il existe des indications avant le formulaire ;
• Il existe des indications avant les champs de formulaire ;
• Il existe des indications dans l'étiquette (balise label, attribut title, propriété aria-label, passage de texte lié via la propriété aria-labelledby) du champ de formulaire ;
• Il existe des indications dans un passage de texte lié par la propriété ARIA aria-describedby ;
• Un assistant est disponible.

Test 11.14.1 : Chaque formulaire vérifie-t-il une de ces conditions ?

• Il existe un lien vers une page d'aide.
• Il existe des indications avant le formulaire.
• Il existe des indications avant les champs de formulaire.
• Il existe des indications dans l'étiquette du champ de formulaire.
• Il existe des indications dans un passage de texte lié par la propriété ARIA aria-describedby.
• Un assistant est disponible.

Test 11.14.4 : Chaque champ de type texte vérifie-t-il, si nécessaire, l'une de ces conditions ?

• Un correcteur orthographique est disponible ;
• Des suggestions de saisie sont disponibles avant le champ du formulaire ;
• Des suggestions de saisie sont disponibles dans l'étiquette (balise label, attribut title, propriété aria-label, passage de texte lié via la propriété aria-labelledby) du champ de formulaire ;
• Des suggestions de saisie sont disponibles dans un passage de texte lié par la propriété ARIA aria-describedby.

Test 11.14.4 : Chaque champ de type texte vérifie-t-il, si nécessaire, l'une de ces conditions ?

• Un correcteur orthographique est disponible.
• Des suggestions de saisie sont disponibles avant le champ du formulaire.
• Des suggestions de saisie sont disponibles dans l'étiquette du champ de formulaire.
• Des suggestions de saisie sont disponibles dans un passage de texte lié par la propriété ARIA aria-describedby.

Test 11.10.7 : Pour chaque formulaire, chaque champ obligatoire vérifie-t-il une de ces conditions ?

• Le type de données et/ou de format est indiqué, si nécessaire, dans l'étiquette (balise label, attribut title, propriété ARIA aria-label, texte lié via la propriété ARIA aria-labelledby) du champ ;
• Le type de données et/ou de format est indiqué, si nécessaire, par un passage de texte avant le champ de formulaire ;
• Le type de données et/ou de format est indiqué, si nécessaire, par un texte lié par la propriété ARIA aria-describedby.

Test 11.10.7 : Pour chaque formulaire, chaque champ obligatoire vérifie-t-il une de ces conditions ?

• Le type de données et/ou de format est indiqué, si nécessaire, dans l'étiquette du champ.
• Le type de données et/ou de format est indiqué, si nécessaire, par un passage de texte avant le champ de formulaire.
• Le type de données et/ou de format est indiqué, si nécessaire, par un passage de texte lié par la propriété ARIA aria-describedby.

Test 11.10.2 : Chaque indication de champ obligatoire qui utilise les propriétés ARIA aria-label, aria-required ou l'attribut required doit être accompagnée d'une indication visuelle explicite dans l'étiquette (balise label) ou dans un passage de texte lié au champ par la propriété ARIA aria-describedby ou aria-labelledby, cette règle est-elle respectée ?

Test 11.10.2 : Chaque indication de champ obligatoire qui utilise les propriétés ARIA aria-label, aria-required ou l'attribut required doit être accompagnée d'une indication visuelle explicite dans l'étiquette ou dans un passage de texte lié au champ par la propriété ARIA aria-describedby ou aria-labelledby, cette règle est-elle respectée ?

Test 11.10.8 : Chaque indication du type de données et/ou de format réalisée grâce à la propriété ARIA aria-label doit être accompagnée d'une indication visuelle explicite dans l'étiquette (balise label) ou dans un passage de texte lié au champ par la propriété ARIA aria-describedby ou aria-labelledby, cette règle est-elle respectée ?

Test 11.10.8 : Chaque indication du type de données et/ou de format réalisée grâce à la propriété ARIA aria-label doit être accompagnée d'une indication visuelle explicite dans l'étiquette ou dans un passage de texte lié au champ par la propriété ARIA aria-describedby ou aria-labelledby, cette règle est-elle respectée ?

Test 12.10.1 : Dans chaque page Web, chaque groupe de liens importants est-il implémenté dans une balise commune ?

Test 12.10.2 : Dans chaque page Web, chaque groupe de liens importants vérifie-t-il une de ces conditions ?

• La balise structurant le groupe de liens importants possède un attribut id ;
• La balise structurant le groupe de liens importants est immédiatement précédée, dans le code source, d'une ancre ;
• Le premier lien du groupe de liens est immédiatement précédé, dans le code source, d'une ancre.

Test 12.10.3 : Dans chaque page Web, la zone de contenu vérifie-t-elle une de ces conditions ?

• La zone de contenu possède un attribut id ;
• La zone de contenu est immédiatement précédée, dans le code source, d'une ancre ;
• Le premier élément de la zone de contenu est immédiatement précédé, dans le code source, d'une ancre.

Test 12.10.1 : Dans chaque page web, la structure du document vérifie-t-elle ces conditions ?

Test 13.16.1 : Dans chaque page Web, chaque changement brusque de luminosité ou effet de flash provoqué par une image animée (balise img, balise svg, balise embed, balise canvas ou balise object) a-t-il une fréquence inférieure ou égale à 3 par seconde ?

Test 13.16.1 : Dans chaque page web, chaque changement brusque de luminosité ou effet de flash provoqué par une image (balise img, balise svg, balise embed, balise canvas ou balise object) a-t-il une fréquence inférieure ou égale à 3 par seconde ?

Il faut que l'étiquette et son champ soient visuellement proches de manière à ce que la relation entre les deux ne puisse pas prêter à confusion.

Note : WCAG préconise que les étiquettes des champs de saisie de texte ou de valeurs prédéterminées, comme les listes par exemple, soient placées avant le champ, donc à gauche ou en haut des champs concernés. À l'inverse, les étiquettes des champs de type radio ou case à cocher devraient être placées après le champ, donc à droite ou en bas. Cette recommandation n'a pas été jugée raisonnable et n'est donc pas reprise dans le RGAA 3. Un positionnement différent, mais respectant une liaison visuelle sans confusion ne peut pas constituer une non-conformité au sens du RGAA 3.

Narration ajoutée (via un fichier son) à une piste sonore pour décrire les détails visuels importants qui ne peuvent être compris à partir de la piste sonore principale seulement. L'audio-description doit être synchronisée avec le média temporel grâce à l'utilisation de format spécialisés comme le format SRT par exemple.

Narration ajoutée (via un fichier son) à une piste sonore pour décrire les détails visuels importants qui ne peuvent être compris à partir de la piste sonore principale seulement. L'audiodescription doit être synchronisée avec le média temporel par un dispositif applicatif lié au lecteur lui-même ou fourni par le développement par exemple avec JavaScript.

Dans un formulaire, ensemble des champs pouvant être regroupés par la nature des informations attendues. Le regroupement vise à identifier les champs devant être traités comme un ensemble.

Quelques exemples :

• Trois champs successifs pour saisir une date (jour/mois/année) ;
• Champs successifs pour un numéro de téléphone ;
• Un bloc destiné à saisir l'identité et l'adresse de l'utilisateur, lorsque le formulaire contient plusieurs blocs de contact ;
• Un ensemble de boutons radio ou de cases à cocher qui se rapportent à une question.

Ces champs doivent être regroupés par une balise fieldset accompagnée d'une balise legend pertinente. Dans le cas de boutons radio, la légende est généralement l'intitulé de la question.

Note : lorsque le formulaire est uniquement constitué d'un seul bloc d'informations de même nature (l'identité et l'adresse de l'utilisateur, par exemple) ou d'un champ unique (un moteur de recherche, par exemple), la présence de l'élément fieldset n'est pas obligatoire.

Dans un formulaire, ensemble des champs pouvant être regroupés par la nature des informations attendues. Le regroupement vise à identifier les champs devant être traités comme un ensemble.

Quelques exemples :

• Trois champs successifs pour saisir une date (jour/mois/année).
• Champs successifs pour un numéro de téléphone.
• Un bloc destiné à saisir l'identité et l'adresse de l'utilisateur, lorsque le formulaire contient plusieurs blocs de contact.
• Un ensemble de boutons radio ou de cases à cocher qui se rapportent à une question.

Ces champs doivent être regroupés lorsque les intitulés de label ne sont pas suffisants pour informer l'utilisateur que les champs font partie d'un regroupement. HTML propose un dispositif natif par l'intermédiaire des éléments fieldset et legend.

Il est également possible de créer des regroupements avec le rôle ARIA group et un passage de texte, faisant office de légende, liée par la propriété aria-labelledby ou implémentée par l'intermédiaire d'une propriété aria-label.

Note 1 : Les regroupements de champs peuvent utiliser d'autres méthodes qui associent l'information du regroupement directement dans l'étiquette du champ. Par exemple, par l'intermédiaire d'un attribut title, d'une propriété aria-label ou d'une liaison aria-labelledby faisant office d'étiquette ou encore par la propriété aria-describedby associant un texte complémentaire. Dans ce cas, le regroupement de champs devient inutile puisque les labels sont suffisamment pertinents.

Note 2 : Lorsque le formulaire est constitué d'un seul bloc d'informations de même nature (l'identité et l'adresse de l'utilisateur, par exemple) ou d'un champ unique (un moteur de recherche, par exemple), le regroupement des champs n'est pas obligatoire.

Un composant d'interface est un élément avec lequel l'utilisateur peut interagir, par exemple un bouton, un lien, une zone de saisie. Certains composants peuvent être plus complexes comme un menu, une fenêtre de dialogue, un système d'onglets. Enfin un composant d'interface peut être basé sur des éléments natifs de HTML ou développés de toutes pièces avec JavaScript et l'API ARIA.

• Si R_sRGB <= 0,03928 alors R = R_sRGB/12,92 sinon R = ((R_sRGB+0,055)/1,055) ^ 2,4 ;
• Si G_sRGB <= 0,03928 alors G = G_sRGB/12,92 sinon G = ((G_sRGB+0,055)/1,055) ^ 2,4 ;
• Si B_sRGB <= 0,03928 alors B = B_sRGB/12.92 sinon B = ((B_sRGB+0,055)/1,055) ^ 2,4 ;

et R_sRGB, G_sRGB et B_sRGB sont définis par :

• R_sRGB = R8bit/255 ;
• G_sRGB = G8bit/255 ;
• B_sRGB = B8bit/255.

Contenu associé à une image en complément de son alternative textuelle afin de décrire en totalité l'information véhiculée par l'image. La description détaillée peut être insérée via :

• Un attribut longdesc qui contient l'adresse d'une page ou d'un emplacement dans la page contenant la description détaillée ;
• Une référence, dans l'attribut alt, à une description détaillée adjacente à l'image ;
• Un lien adjacent à l'image qui contient l'adresse d'une page ou d'un emplacement dans la page contenant la description détaillée.

Contenu associé à une image en complément de son alternative textuelle afin de décrire en totalité l'information véhiculée par l'image. La description détaillée peut être insérée via :

• Un attribut longdesc qui contient l'adresse d'une page ou d'un emplacement dans la page contenant la description détaillée ;
• Une référence, dans l'attribut alt, à une description détaillée adjacente à l'image ;
• Un lien adjacent à l'image qui contient l'adresse d'une page ou d'un emplacement dans la page contenant la description détaillée ;
• Un ou plusieurs passages de texte identifiés par un id et liés par une propriété aria-describedby sur le modèle aria-describedby="ID1 ID2 ID3…".

Note : Pour assurer une compatibilité maximum avec les agents utilisateurs, notamment Internet Explorer 11, il est recommandé d'implémenter un tabindex="-1" sur les passages de textes qui ne sont pas des éléments interactifs (bouton, liens, éléments de formulaires, etc.).

Note importante au sujet de l'utilisation de placeholder : lorsque l'attribut placeholder est présent, il est susceptible d'être restitué à la place de l'attribut title. Par conséquent, lorsque ces deux attributs title et placeholder sont présents, ils doivent être identiques.

Note au sujet des étiquettes liées par aria-labelledby : Il s'agit d'un ou de plusieurs passages de texte identifiés par des id et liés par aria-labelledby sur le modèle suivant : aria-labelledby="ID1 ID2 ID3…". Pour assurer une compatibilité maximum avec les agents utilisateurs, notamment Internet Explorer 11, il est recommandé d'implémenter un tabindex="-1" sur les passages de textes qui ne sont pas des éléments interactifs (bouton, liens, éléments de formulaires, etc.).

Il s'agit des fonctionnalités de contrôle de la consultation (objet multimédia) suivantes :

• L'objet multimédia doit toujours avoir les fonctionnalités suivantes, au minimum : lecture, pause, stop ;
• Si l'objet multimédia a du son, il doit avoir une fonctionnalité permettant d'activer ou de désactiver le son et d'en contrôler le niveau sonore ;
• Si l'objet multimédia a des sous-titres, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition des sous-titres ;
• Si l'objet multimédia a une audio-description, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition de l'audio-description.

Note : s'il n'y a pas de son à un objet multimédia, il n'est pas utile de mettre une fonctionnalité de contrôle du volume. Si cette fonctionnalité est cependant présente et qu'elle nécessite une alternative textuelle pour être comprise par certains utilisateurs (exemple : bouton "volume" dans une vidéo en Flash), il faut alors lui en donner une puisque l'utilisateur est susceptible d'y accéder et de vouloir l'activer.

Possibilité pour l'utilisateur de contrôler la consultation d'un média temporel par le clavier et la souris, au moins. Les points suivants doivent être respectés :

• Liste des fonctionnalités obligatoires de contrôle de la consultation :
  • L'objet multimédia doit toujours avoir les fonctionnalités suivantes, au minimum : lecture, pause ou stop ;
  • Si l'objet multimédia a du son, il doit avoir une fonctionnalité de contrôle du volume ;
  • Si l'objet multimédia a des sous-titres, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition des sous-titres ;
  • Si l'objet multimédia a une audio-description, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition de l'audio-description.
• Chaque fonctionnalité doit être accessible par le clavier, via la touche de tabulation, et par la souris au moins ;
• Chaque fonctionnalité doit être activable par le clavier et par la souris, au moins.

Note : s'il n'y a pas de son à un média temporel, il n'est pas utile de mettre une fonctionnalité de contrôle du volume.

Possibilité pour l'utilisateur de contrôler la consultation d'un média temporel par le clavier et la souris, au moins. Les points suivants doivent être respectés :

• Liste des fonctionnalités obligatoires de contrôle de la consultation :
  • L'objet multimédia doit toujours avoir les fonctionnalités suivantes, au minimum : lecture, pause ou stop.
  • Si l'objet multimédia a du son, il doit avoir une fonctionnalité de contrôle du volume.
  • Si l'objet multimédia a des sous-titres, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition des sous-titres.
  • Si l'objet multimédia a une audiodescription, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition de l'audiodescription.
• Chaque fonctionnalité doit être accessible par le clavier, via la touche de tabulation, et par la souris au moins.
• Chaque fonctionnalité doit être activable par le clavier et par la souris, au moins.

Note : s'il n'y a pas de son à un média temporel, il n'est pas utile de mettre une fonctionnalité de contrôle du volume. Si cette fonctionnalité est cependant présente et qu'elle nécessite une alternative textuelle pour être comprise par certains utilisateurs (exemple : bouton « volume » dans une vidéo en Flash), il faut alors lui en donner une puisque l'utilisateur est susceptible d'y accéder et de vouloir l'activer.

Image qui véhicule une information nécessaire à la compréhension du contenu auquel elle est associée.

Image qui véhicule une information nécessaire à la compréhension du contenu auquel elle est associée.

Note 1 : lorsque l'image est le seul contenu d'un lien, son alternative est l'intitulé du lien. Dans ce cas, l'alternative de l'image devrait être évaluée avec la thématique « Liens ».

Note 2 : lorsqu'un bouton de formulaire, inséré avec l'élément <button>, ne contient qu'une image (balise <img>, <object>, <embed>, <canvas> ou <svg>), l'alternative de l'image est l'intitulé du bouton. Deux cas peuvent se présenter :

• Le bouton est contrôlé par son type, par exemple, le type submit ou reset, et fait partie d'un formulaire. Dans ce cas, le bouton image doit être évalué avec la thématique « Formulaires ».
• Le bouton est contrôlé par un dispositif JavaScript. Dans ce cas, le bouton image doit être évalué avec la thématique « Scripts ».

Lien dont le contenu entre <a href="…"> et </a> est uniquement constitué d'une image. L'intitulé de lien pour un lien image est le contenu de l'alternative textuelle de l'image.

Un lien image peut être constitué :

• D'une image (balise img), l'alternative est le contenu de l'attribut alt ;
• D'une zone cliquable (balise area) possédant un attribut href, l'alternative est le contenu de l'attribut alt ;
• D'une image objet (balise object), l'alternative est contenue entre <object> et </object> ;
• D'une image bitmap (balise canvas), l'alternative est contenue entre <canvas> et </canvas> ;
• D'une image embarquée (balise embed), l'alternative est contenue entre <embed> et </embed> ;
• D'une image vectorielle (balise svg), l'alternative est contenue dans les attributs title, aria-label ou la balise <desc>.

Note au sujet de embed : en HTML5, la balise embed a été modifiée. C'est une balise autofermante qui ne peut pas embarquer de contenu alternatif. Les propriétés ARIA, comme aria-label qui permettrait d'embarquer une alternative, n'étant pas supportées de manière uniforme, il n'est pas possible d'utiliser une image embarquée, porteuse d'information, via l'élément embed HTML5.

Lien dont le contenu entre <a href="…"> et </a> est uniquement constitué d'une image. L'intitulé de lien pour un lien image est le contenu de l'alternative textuelle de l'image.

Un lien image peut être constitué :

• D'une image (balise img), l'alternative est le contenu de l'attribut alt ;
• D'une zone cliquable (balise area) possédant un attribut href, l'alternative est le contenu de l'attribut alt ;
• D'une image objet (balise object), l'alternative est contenue entre <object> et </object> ;
• D'une image bitmap (balise canvas), l'alternative est contenue entre <canvas> et </canvas> ;
• D'une image vectorielle (balise svg), l'alternative est contenue dans l'attribut aria-label ou la balise <title>.

Note au sujet de embed : Pour les doctype antérieurs à HTML5, l’alternative d'une image embarquée peut être contenue entre <embed> et </embed>. En HTML5, la balise embed a été modifiée. C’est une balise autofermante qui ne peut donc pas embarquer de contenu alternatif. Les propriétés ARIA, comme aria-label qui permettrait d’embarquer une alternative, n’étant pas supportées de manière uniforme, les seules méthodes possibles pour fournir une alternative à ces images embarquées porteuses d'informations sont : un lien adjacent permettant d’afficher une page ou un passage de texte contenant une alternative pertinente, un mécanisme qui permet à l’utilisateur de remplacer l’image par un texte alternatif ou par une image possédant une alternative pertinente.

Si le mécanisme est géré par un lien ou un bouton dont l'intitulé visible est constitué par un texte seul (contenu entre les balises <a> et </a>, <button> et </button> ou encore attribut value par exemple), alors le rapport de contraste de l'élément est à tester avec les tests 3.3.1, 3.3.2, 3.3.3, 3.3.4, 3.4.1, 3.4.2, 3.4.3 ou 3.4.5, selon le niveau exigé et le cas d'application.

Pour toutes les autres implémentations, les tests 3.3.5 et 3.4.5 s'appliquent (selon, le niveau AA ou AAA, exigé).

La spécification WAI-ARIA permet de modifier le rôle natif d'un élément, par exemple modifier un élément a href="" en élément button.

Ces modifications ne peuvent être réalisées que sous certaines conditions décrites dans le document : Notes on Using WAI-ARIA in HTML qui définit un certain nombre de restrictions notamment.

Pour qu'une modification du rôle natif d'un élément HTML via WAI-ARIA soit compatible, il faut que les restrictions soient respectées.

La spécification WAI-ARIA permet de modifier le rôle natif d'un élément, par exemple modifier un élément <a href=""> en élément <button>.

Ces modifications ne peuvent être réalisées que sous certaines conditions décrites dans le document : Notes on Using WAI-ARIA in HTML qui définit un certain nombre de restrictions notamment.

Pour qu'une modification du rôle natif d'un élément HTML via WAI-ARIA soit compatible, il faut que les restrictions soient respectées.

Chaque élément, dont la nature a été altérée par l'implémentation d'un rôle ARIA, doit respecter les critères et tests relatifs au rôle défini. Par exemple, un lien <a> qui possède le rôle ARIA button doit respecter les conditions définies pour les éléments button, et non pas celles pour les liens.

Il s'agit d'un ou de plusieurs passages de texte identifiés par des id et liés par aria-labelledby ou aria-describedby sur le modèle suivant : aria-labelledby="ID1 ID2 ID3…".

Note : pour assurer une compatibilité maximum avec les agents utilisateurs, notamment Internet Explorer 11, il est recommandé d'implémenter un tabindex="-1" sur les passages de textes qui ne sont pas des éléments interactifs (bouton, liens, éléments de formulaires, etc.).

Restitution visuelle des contenus via un navigateur en mode graphique. La présentation concerne le style, la position et les dimensions des éléments HTML et de leur contenu. La présentation de l'information doit être réalisée via CSS. Les éléments (basefont, blink, center, font, marquee, s, strike, tt, u, bing et small) et les attributs (align, alink, background, bgcolor, border, cellpading, cellspacing, char, charoff, clear, compact, color, frameborder,hspace, link, marginheight, marginwidth, text, valign, vlink, vspace, size) sont interdits.

Note  : Les attributs width et height utilisés sur d'autres éléments que les balises img, object, embed, canvas et svg, sont également interdits.

Restitution visuelle des contenus via un navigateur en mode graphique. La présentation concerne le style, la position et les dimensions des éléments HTML et de leur contenu. La présentation de l'information doit être réalisée via CSS. Les éléments (basefont, blink, center, font, marquee, s, strike, tt et big) et les attributs (align, alink, background, bgcolor, border, cellpading, cellspacing, char, charoff, clear, compact, color, frameborder,hspace, link, marginheight, marginwidth, text, valign, vlink, vspace, size) sont interdits.

Note  : Les attributs width et height utilisés sur d'autres éléments que les balises img, object, embed, canvas et svg, sont également interdits.

Les propriétés aria-label et aria-labelledby peuvent être utilisées pour créer une étiquette de champ de formulaire. L'étiquette ainsi créée restera invisible ce qui permet de résoudre beaucoup de cas où un label visible n'est pas souhaité.

En revanche cela crée un risque potentiel pour certains utilisateurs et il peut être nécessaire qu'un texte visible et accolé au champ vienne compléter le dispositif proposé par aria-label ou aria-labelledby.

Élément HTML (balise h) à 6 niveaux de hiérarchie (de h1 pour le titre le plus important à h6 pour le moins important) permettant de structurer l'information d'un contenu Web. La hiérarchie entre les titres doit être respectée dans une page Web et les degrés de titre ne peuvent pas être sautés (un titre h3 ne peut pas venir directement après un titre h1, par exemple). Dans chaque page Web, il doit y avoir un titre h1, au moins.

Note : les titres cachés via CSS sont considérés comme présents et valident le critère 9.1.

Élément HTML (balise h) à 6 niveaux de hiérarchie (de h1 pour le titre le plus important à h6 pour le moins important) permettant de structurer l'information d'un contenu web.

La hiérarchie entre les titres doit être respectée dans une page web et les degrés de titre ne peuvent pas être sautés (un titre h3 ne peut pas venir directement après un titre h1, par exemple). Par contre, la hiérarchie ne doit pas obligatoirement débuter par un h1. Même si cet usage n'est pas encouragé, il est considéré comme conforme de débuter la hiérarchie des titres d'une page par un autre niveau que le niveau 1.

Dans chaque page web, il doit y avoir un titre h1, au moins.

Note : les titres cachés via CSS sont considérés comme présents et valident le critère 9.1.

Note 1 : Par exception, un titre de lien identique à l'intitulé est accepté dans le seul cas d'un lien image (lien ne contenant que des images), une icône par exemple.

Note 1 : Par exception, un titre de lien identique à l'intitulé est accepté dans les seuls cas d'un lien image (lien ne contenant que des images), une icône par exemple, ou d'un lien dont le seul contenu visible est une image (lien composite dont le texte est visuellement caché).

Région d'une image réactive à laquelle aucune action n'est associée. Une zone cliquable côté client est contenue dans une balise area :

Région d'une image réactive à laquelle aucune action n'est associée. Une zone non cliquable côté client est contenue dans une balise area :

Pour ces critères, il existe une gestion de cas particulier lorsque le texte fait partie d'un logo ou d'un élément associé à l'identité graphique d'un organisme ou d'une société. Dans ces situations, les critères sont non applicables pour ces éléments.

Note 1 : Les cas particuliers concernant des textes associés à l'identité graphique d'un organisme ou d'une société devraient être limités à des éléments particuliers comme un slogan par exemple. Dans le cas où c'est l'intégralité d'une charte graphique, particulièrement lorsque la charte graphique est imposée, qui est en cause, comme un choix de couleur de police par exemple, la solution consiste à avoir recours à une version alternative, à fort contraste.

Note 2 : Les changements de couleurs consécutifs à la prise de focus ne sont pas concernés par l'application du critère, sauf si le contenu change également lors de la prise de focus.

Note 3 : les indications des états de liens (visités ou actifs) ne sont pas concernées par l'application du critère.

Pour ces critères, il existe une gestion de cas particuliers lorsque le texte en image est utilisé comme CAPTCHA ou comme image-test. Dans cette situation, les critères sont non applicables.

Pour ces critères, il existe une gestion de cas particulier :

Dans ces situations, les critères sont non applicables pour ces éléments.

• Le texte fait partie d'un logo ou d'un élément associé à l'identité graphique d'un organisme ou d'une société ;
• Le texte fait partie d'une image de décoration ;
• Le texte inséré dans une image porteuse d'information n'apporte aucune information essentielle ;
• Le texte fait partie d'un élément interactif (par exemple un bouton avec l'attribut disabled) sur lequel aucune action n'est possible et qui n'apporte pas une information essentielle ;
• Le texte est inséré via l'attribut placeholder et n'apporte aucune information essentielle ;
• Le texte est inséré dans une image utilisée comme CAPTCHA ou comme image-test.

Note 1 : Les cas particuliers concernant des textes associés à l'identité graphique d'un organisme ou d'une société devraient être limités à des éléments particuliers comme un slogan par exemple. Dans le cas où c'est l'intégralité d'une charte graphique, particulièrement lorsque la charte graphique est imposée, qui est en cause, comme un choix de couleur de police par exemple, la solution consiste à avoir recours à une version alternative, à fort contraste.

Note 2 : Les changements de couleur consécutifs à la prise de focus ne sont pas concernés par l'application du critère, sauf si le contenu change également lors de la prise de focus.

Note 3 : les indications des états de liens (visités ou actifs) ne sont pas concernées par l'application du critère.

L'API ARIA propose un mécanisme permettant de surcharger le rôle natif d'un élément HTML pour proposer des composants.

L'API ARIA propose un mécanisme permettant de surcharger le rôle natif d'un élément HTML pour définir des composants.

Il existe une gestion de cas particuliers pour les polices-icônes. Les polices-icônes permettent de créer des icônes à partir d'un fichier de police. Dans ces cas, il est autorisé d'utiliser des tailles en unités fixes pour la propriété CSS font-size.

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.

WCAG propose plusieurs techniques visant à améliorer la visibilité du focus :

• C15: Using CSS to change the presentation of a user interface component when it receives focus ;
• G195: Using an author-supplied, highly visible focus indicator ;
• SCR31: Using script to change the background color or border of the element with focus.

Bien que ces techniques apportent un bénéfice important à l'utilisateur elles ne sont pas rendues obligatoires par le RGAA du fait de leur impact très fort sur le design et d'éventuelles interactions avec des dispositifs tiers (plugin ou indication native du navigateur). En tout état de cause elles devraient être proposées via un mécanisme de personnalisation.

Note importante : même si ces techniques sont utilisées elles ne permettent pas de s'abstenir de garantir que l'indication visuelle du focus (propriété outline) n'est ni dégradée ni supprimée. En effet, l'outline controlé et pris en charge par le navigateur apparaît comme la seule solution suffisamment robuste car elle ne dépend pas de l'auteur

Dans la vie de tous les jours, le manque d'accessibilité de bâtiments publics ou privés par le simple fait de n'avoir que des escaliers comme seul moyen d'accès est l'un des exemples les plus flagrants de l'inégalité d'accès à une information ou un service qui existe entre des personnes présentant un handicap ou âgées et des personnes ne présentant pas de handicap.

Dans la vie de tous les jours, la présence d'escaliers comme unique moyen d'accès à un bâtiment est un exemple flagrant d'inégalité d'accès à une information ou un service qui existe entre des personnes présentant un handicap et d'autres n'en présentant pas.

Le 7 octobre 2016, les volontés sont réaffirmées avec la loi n° 2016-1321 pour une République numérique. L'article 106 vient étendre la portée de l'article 47 de la loi du 11 février 2005 « pour l'égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées » en incluant dans l'obligation de mise en accessibilité des sites web les services de communication au public en ligne des organismes délégataires d'une mission de service public et des entreprises dont le chiffre d'affaires excède un seuil défini par le décret en Conseil d'État.

De plus, cette loi impose à tout service de communication au public en ligne, d'afficher sur sa page d'accueil une mention clairement visible précisant s'il est ou non conforme aux règles relatives à l'accessibilité ainsi qu'un lien renvoyant à une page indiquant notamment l'état de mise en œuvre du schéma pluriannuel de mise en accessibilité et du plan d'actions de l'année en cours. Un manquement à ces dispositifs d'affichage fera l'objet d'une sanction administrative d'un montant inférieur ou égal à 5 000 €.

Les conditions d'élaboration, d'approbation, de modification et de publication du RGAA sont fixées par décret.

Ceci se traduit notamment par :

• La publication du document sur un site Web public, afin qu'il soit consultable par tous ;
• Des mises à jour régulières, afin de tenir compte des évolutions des technologies liées à l'accessibilité et des usages des autorités administratives.

Sa mise à jour est assurée par les services du ministre chargé des personnes handicapées en liaison avec les services du ministre chargé du développement de l'économie numérique.

Les définitions de la conformité pour chaque niveau sont traduites de la note Understanding Conformance du W3C.

Pour le référentiel technique du RGAA 3, un critère peut désormais avoir l'un des 4 statuts suivants :

• Conforme ou validé : le critère est conforme ;
• Non-conforme ou invalidé : le critère est non-conforme ;
• Non applicable : le critère est non applicable ;
• Non testé : le critère est non testé (nouveau statut permettant de mesurer la progression de l'audit).

En plus de ces 4 statuts est créé un état particulier, traité à part, concernant les contenus dérogés. Cela se traduira par une colonne supplémentaire dans la grille d'audit permettant d'indiquer quand un contenu dérogé est présent et qu'il impacte des critères. Un même critère peut donc avoir un état dérogé quand il concerne un contenu dérogé, mais il reste applicable pour le reste des contenus de la page.

Cet état particulier viendra en complément des quatre premiers statuts et servira à signaler que des contenus dérogés sont applicables au critère et à conserver la trace de ces dérogations.

Pour le référentiel technique du RGAA 3, un critère peut désormais avoir l'un des 4 statuts suivants :

• Conforme (C) : l'ensemble des tests applicables sont réussis ;
• Non conforme (NC) : un test applicable est échoué, au moins ;
• Non applicable (NA) : il n'y a pas de contenu concerné par le critère ;
• Non testé (NT) : le critère n'a pas été testé (nouveau statut permettant de mesurer la progression de l'audit).

En plus de ces 4 statuts est créé un état particulier, traité à part, concernant les contenus dérogés. Cela se traduira par une colonne supplémentaire dans la grille d'audit permettant d'indiquer quand un contenu dérogé est présent et qu'il impacte des critères. Un même critère peut donc avoir un état dérogé quand il concerne un contenu dérogé, mais il reste applicable pour le reste des contenus de la page.

Cet état particulier viendra en complément des quatre premiers statuts. Il servira à signaler l'existence de contenus dérogés pour les critères applicables et à conserver la trace de ces dérogations.

À noter qu’une dérogation ne s’applique qu’à un contenu et non à un critère du RGAA. Une fois le contenu dérogé, il sort du champ de l’audit.

À noter qu’une dérogation ne s’applique qu’à un contenu et non à un critère du RGAA. Une fois le contenu dérogé, il sort du champ de l’audit et le critère concerné devient non applicable pour ce contenu.

14. La France a signé la CRDPH le 30 mars 2007, son protocole le 23 septembre 2008, puis a ratifié la convention et le protocole le 18 février 2008. Source ONU.

14. La France a signé la CRDPH le 30 mars 2007, son protocole le 23 septembre 2008, puis a ratifié la convention et le protocole le 18 février 2010. (Source ONU).

Note : La France a signé la CRDPH le 30 mars 2007, son protocole le 23 septembre 2008, puis a ratifié la convention et le protocole le 18 février 2008 (Source ONU).

Note : La France a signé la CRDPH le 30 mars 2007, son protocole le 23 septembre 2008, puis a ratifié la convention et le protocole le 18 février 2010 (Source ONU).

Le RGAA et son contenu sont propriété de l'État. Ils sont élaborés par les services du ministre chargé de la réforme de l'État qui doivent respecter les conditions d'élaboration, d'approbation, de modification et de publication fixées par décret.

[…]

Par la suite, le RGAA sera mis à jour après consultation du ministre chargé du développement de l'économie numérique et après avis du Conseil national consultatif des personnes handicapées.

Le RGAA et son contenu sont propriété de l'État. Ils sont élaborés par les services de l'État qui doivent respecter les conditions d'élaboration, d'approbation, de modification et de publication fixées par décret.

[…]

Par la suite, le RGAA sera mis à jour après consultation du ou des ministres concernés et après avis du Conseil national consultatif des personnes handicapées.