Retour à la page projet

Audit Accessibilité pour Paiement des amendes

Scores - 106 critères

Accéder à la déclaration

Conformité globale selon les critères

  • 71%
    Critères conformes
  • 29%
    Critères non conformes
  • 45
    Critères conformes
  • 43
    Critères non applicables
  • 18
    Critères non conformes

Conformité détaillée de répartition

Contexte

Version du référentiel : RAWeb 1.0
Technologies utilisées sur le site : HTML, CSS, JS, PDF
Outils pour réaliser l’audit : Wave, AXE, Web Developper, Usability Hike, Heading Maps

Environnement de test Ordinateur
Système d’exploitation Technologie d’assistance Navigateur
Windows 11 NVDA (dernière version) Firefox
MacOS VoiceOver (dernière version) Safari
Environnement de test Mobile
Système d’exploitation Technologie d’assistance Navigateur
Androïd natif TalkBack (dernière version) Chrome
iOS VoiceOver (dernière version) Safari


Liste des pages auditées

Par ordre des critères du référentiel

Anomalies présentes sur toutes les pages

Test 7.1.2

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

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

Test 7.1.3

Chaque script qui génère ou contrôle un composant d’interface vérifie-t-il ces conditions (hors cas particuliers) ?

  1. Le composant possède un nom pertinent.
  2. Le nom accessible du composant contient au moins l’ intitulé visible .
  3. Le composant possède un rôle pertinent.

Test 8.2.1

Pour chaque page web, le code source généré est-il valide selon le type de document spécifié ?

Test 9.1.1

Dans chaque page web, la hiérarchie entre les titres (balise <hx> ou balise possédant un attribut WAI-ARIA role="heading" associé à un attribut WAI-ARIA aria-level) est-elle pertinente ?

Test 10.6.1

Dans chaque page web, chaque lien texte signalé uniquement par la couleur, et dont la nature n’est pas évidente, vérifie-t-il ces conditions ?

  1. La couleur du lien a un rapport de contraste supérieur ou égal à 3:1 par rapport au texte environnant.
  2. Le lien dispose d’une indication visuelle au survol autre qu’un changement de couleur.
  3. Le lien dispose d’une indication visuelle au focus autre qu’un changement de couleur.

Anomalies présentes sur les pages spécifiques

Page : Accueil

Test 1.6.1 Facile

Commentaire(s) : Modale « Où trouver mon numéro de télépaiement et la clé? » & Modale « par application » && « par téléphone »

Chaque image (balise <img>) porteuse d’information , qui nécessite une description détaillée , vérifie-t-elle une de ces conditions ?

  1. Il existe une alternative textuelle contenant la référence à une description détaillée adjacente à l’image.
  2. Il existe un lien ou un bouton adjacent permettant d’accéder à la description détaillée .

Test 3.2.2 Modéré

Commentaire(s) : Titre de la zone actualités

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) ?

  1. Le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins.
  2. Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.

Test 7.1.1 Modéré

Commentaire(s) : Les Modales. L’accordéon ne présente pas d’attribut WAI-ARIA, dans “ou trouver mon numéro de télépaiment”

Chaque script qui génère ou contrôle un composant d’interface vérifie-t-il, si nécessaire, une de ces conditions ?

  1. Le nom, le rôle, la valeur, le paramétrage et les changements d’états sont accessibles aux technologies d’assistance via une API d’accessibilité.
  2. Un composant d’interface accessible permettant d’accéder aux mêmes fonctionnalités est présent dans la page.
  3. Une alternative accessible permet d’accéder aux mêmes fonctionnalités.

Test 7.3.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) ?

  1. L’élément est accessible par le clavier et tout dispositif de pointage .
  2. Un élément accessible par le clavier et tout dispositif de pointage permettant de réaliser la même action est présent dans la page.

Test 10.11.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) ?

Test 11.9.1

L’intitulé de chaque bouton vérifie-t-il ces conditions (hors cas particuliers) ?

  1. S’il est présent, le contenu de l’attribut WAI-ARIA aria-label est pertinent.
  2. S’il est présent, le passage de texte lié au bouton via un attribut WAI-ARIA aria-labelledby est pertinent.
  3. S’il est présent, le contenu de l’attribut value d’une balise <input> de type submit, reset ou button est pertinent.
  4. S’il est présent, le contenu de la balise <button> est pertinent.
  5. S’il est présent, le contenu de l’attribut alt d’une balise <input> de type image est pertinent.
  6. S’il est présent, le contenu de l’attribut title est pertinent.

Test 11.10.3

Les messages d’erreur indiquant l’absence de saisie d’un champ obligatoire vérifient-ils une de ces conditions ?

  1. Le message d’erreur indiquant l’absence de saisie d’un champ obligatoire est visible et permet d’identifier nommément le champ concerné.
  2. Le champ obligatoire dispose de l’attribut aria-invalid="true".

Test 11.10.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 ?

  1. 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.
  2. 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.

Page : Vérification des informations de paiement

Test 3.2.2 Modéré

Commentaire(s) : Zone information du montant

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) ?

  1. Le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins.
  2. Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.

Test 6.1.1

Commentaire(s) : Lien de téléchargement non pertinent (paiement partiel)

Chaque lien texte vérifie-t-il une de ces conditions (hors cas particuliers) ?

  1. L’ intitulé de lien seul permet d’en comprendre la fonction et la destination.
  2. L’ intitulé de lien additionné au contexte du lien permet d’en comprendre la fonction et la destination.

Test 7.3.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) ?

  1. L’élément est accessible par le clavier et tout dispositif de pointage .
  2. Un élément accessible par le clavier et tout dispositif de pointage permettant de réaliser la même action est présent dans la page.

Test 7.5.1

Commentaire(s) : Valeur montant pour Paiement partiel

Chaque 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" ?

Test 7.5.2

Commentaire(s) : Erreur pour Paiement partiel

Chaque 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" ?

Test 8.9.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 . Cette règle est-elle respectée ?

Test 11.5.1

Commentaire(s) : Paiement partiel

Les champs de même nature vérifient-ils l’une de ces conditions, si nécessaire ?

  1. Les champs de même nature sont regroupés dans une balise <fieldset>.
  2. Les champs de même nature sont regroupés dans une balise possédant un attribut WAI-ARIA role="group".
  3. Les champs de même 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".

Test 11.6.1

Commentaire(s) : Paiement partiel

Chaque regroupement de champs de même nature possède-t-il une légende ?


Page : Justificatif de paiement

Test 7.1.1 Modéré

Commentaire(s) : Modales du menu de gauche

Chaque script qui génère ou contrôle un composant d’interface vérifie-t-il, si nécessaire, une de ces conditions ?

  1. Le nom, le rôle, la valeur, le paramétrage et les changements d’états sont accessibles aux technologies d’assistance via une API d’accessibilité.
  2. Un composant d’interface accessible permettant d’accéder aux mêmes fonctionnalités est présent dans la page.
  3. Une alternative accessible permet d’accéder aux mêmes fonctionnalités.

Test 7.4.1

Chaque script qui initie un changement de contexte vérifie-t-il une de ces conditions ?

  1. L’utilisateur est averti par un texte de l’action du script et du type de changement avant son déclenchement.
  2. Le changement de contexte est initié par un bouton (input de type submit, button ou image ou balise <button>) explicite.
  3. Le changement de contexte est initié par un lien explicite.

Test 7.5.1

Chaque 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" ?

Test 8.9.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 . Cette règle est-elle respectée ?

Test 10.11.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) ?

Test 11.6.1

Chaque regroupement de champs de même nature possède-t-il une légende ?

Test 11.9.1

L’intitulé de chaque bouton vérifie-t-il ces conditions (hors cas particuliers) ?

  1. S’il est présent, le contenu de l’attribut WAI-ARIA aria-label est pertinent.
  2. S’il est présent, le passage de texte lié au bouton via un attribut WAI-ARIA aria-labelledby est pertinent.
  3. S’il est présent, le contenu de l’attribut value d’une balise <input> de type submit, reset ou button est pertinent.
  4. S’il est présent, le contenu de la balise <button> est pertinent.
  5. S’il est présent, le contenu de l’attribut alt d’une balise <input> de type image est pertinent.
  6. S’il est présent, le contenu de l’attribut title est pertinent.

Test 11.10.1

Les indications du caractère obligatoire de la saisie des champs vérifient-elles une de ces conditions (hors cas particuliers) ?

  1. Une indication de champ obligatoire est visible et permet d’identifier nommément le champ concerné préalablement à la validation du formulaire.
  2. Le champ obligatoire dispose de l’attribut aria-required="true" ou required préalablement à la validation du formulaire.

Test 11.10.2

Les champs obligatoires ayant l’attribut aria-required="true" ou required vérifient-ils une de ces conditions ?

  1. Une indication de champ obligatoire est visible et située dans l’étiquette associée au champ préalablement à la validation du formulaire.
  2. Une indication de champ obligatoire est visible et située dans le passage de texte associé au champ préalablement à la validation du formulaire.

Test 11.10.3

Les messages d’erreur indiquant l’absence de saisie d’un champ obligatoire vérifient-ils une de ces conditions ?

  1. Le message d’erreur indiquant l’absence de saisie d’un champ obligatoire est visible et permet d’identifier nommément le champ concerné.
  2. Le champ obligatoire dispose de l’attribut aria-invalid="true".

Page : Plan du site


Page : FAQ

Test 10.11.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) ?


Page : Modalités de règlement

Test 6.1.1

Chaque lien texte vérifie-t-il une de ces conditions (hors cas particuliers) ?

  1. L’ intitulé de lien seul permet d’en comprendre la fonction et la destination.
  2. L’ intitulé de lien additionné au contexte du lien permet d’en comprendre la fonction et la destination.

Test 7.4.1

Chaque script qui initie un changement de contexte vérifie-t-il une de ces conditions ?

  1. L’utilisateur est averti par un texte de l’action du script et du type de changement avant son déclenchement.
  2. Le changement de contexte est initié par un bouton (input de type submit, button ou image ou balise <button>) explicite.
  3. Le changement de contexte est initié par un lien explicite.

Test 7.5.1

Chaque 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" ?

Test 10.11.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) ?

Test 11.6.1

Chaque regroupement de champs de même nature possède-t-il une légende ?

Test 11.10.1

Les indications du caractère obligatoire de la saisie des champs vérifient-elles une de ces conditions (hors cas particuliers) ?

  1. Une indication de champ obligatoire est visible et permet d’identifier nommément le champ concerné préalablement à la validation du formulaire.
  2. Le champ obligatoire dispose de l’attribut aria-required="true" ou required préalablement à la validation du formulaire.

Test 11.10.2

Les champs obligatoires ayant l’attribut aria-required="true" ou required vérifient-ils une de ces conditions ?

  1. Une indication de champ obligatoire est visible et située dans l’étiquette associée au champ préalablement à la validation du formulaire.
  2. Une indication de champ obligatoire est visible et située dans le passage de texte associé au champ préalablement à la validation du formulaire.

Page : Saisie Indicatif

Test 1.3.1

Chaque image (balise <img> ou balise possédant l’attribut WAI-ARIA role="img") porteuse d’information , ayant une alternative textuelle , cette alternative est-elle pertinente (hors cas particuliers) ?

  1. S’il est présent, le contenu de l’attribut alt est pertinent.
  2. S’il est présent, le contenu de l’attribut title est pertinent.
  3. S’il est présent, le contenu de l’attribut WAI-ARIA aria-label est pertinent.
  4. S’il est présent, le passage de texte associé via l’attribut WAI-ARIA aria-labelledby est pertinent.

Test 1.6.1

Chaque image (balise <img>) porteuse d’information , qui nécessite une description détaillée , vérifie-t-elle une de ces conditions ?

  1. Il existe une alternative textuelle contenant la référence à une description détaillée adjacente à l’image.
  2. Il existe un lien ou un bouton adjacent permettant d’accéder à la description détaillée .

Test 7.4.1

Chaque script qui initie un changement de contexte vérifie-t-il une de ces conditions ?

  1. L’utilisateur est averti par un texte de l’action du script et du type de changement avant son déclenchement.
  2. Le changement de contexte est initié par un bouton (input de type submit, button ou image ou balise <button>) explicite.
  3. Le changement de contexte est initié par un lien explicite.

Test 7.5.1

Chaque 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" ?

Test 11.6.1

Chaque regroupement de champs de même nature possède-t-il une légende ?

Test 11.9.1

L’intitulé de chaque bouton vérifie-t-il ces conditions (hors cas particuliers) ?

  1. S’il est présent, le contenu de l’attribut WAI-ARIA aria-label est pertinent.
  2. S’il est présent, le passage de texte lié au bouton via un attribut WAI-ARIA aria-labelledby est pertinent.
  3. S’il est présent, le contenu de l’attribut value d’une balise <input> de type submit, reset ou button est pertinent.
  4. S’il est présent, le contenu de la balise <button> est pertinent.
  5. S’il est présent, le contenu de l’attribut alt d’une balise <input> de type image est pertinent.
  6. S’il est présent, le contenu de l’attribut title est pertinent.

Test 11.10.1

Les indications du caractère obligatoire de la saisie des champs vérifient-elles une de ces conditions (hors cas particuliers) ?

  1. Une indication de champ obligatoire est visible et permet d’identifier nommément le champ concerné préalablement à la validation du formulaire.
  2. Le champ obligatoire dispose de l’attribut aria-required="true" ou required préalablement à la validation du formulaire.

Test 11.10.2

Les champs obligatoires ayant l’attribut aria-required="true" ou required vérifient-ils une de ces conditions ?

  1. Une indication de champ obligatoire est visible et située dans l’étiquette associée au champ préalablement à la validation du formulaire.
  2. Une indication de champ obligatoire est visible et située dans le passage de texte associé au champ préalablement à la validation du formulaire.

Test 11.10.3

Les messages d’erreur indiquant l’absence de saisie d’un champ obligatoire vérifient-ils une de ces conditions ?

  1. Le message d’erreur indiquant l’absence de saisie d’un champ obligatoire est visible et permet d’identifier nommément le champ concerné.
  2. Le champ obligatoire dispose de l’attribut aria-invalid="true".

Test 11.10.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 ?

  1. 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.
  2. 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.

Page : Informations du virement

Test 7.4.1

Chaque script qui initie un changement de contexte vérifie-t-il une de ces conditions ?

  1. L’utilisateur est averti par un texte de l’action du script et du type de changement avant son déclenchement.
  2. Le changement de contexte est initié par un bouton (input de type submit, button ou image ou balise <button>) explicite.
  3. Le changement de contexte est initié par un lien explicite.

Test 7.5.1

Chaque 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" ?

Test 13.3.1

Dans chaque page web, chaque fonctionnalité de téléchargement d’un document bureautique vérifie-t-elle une de ces conditions ?

  1. Le document en téléchargement est compatible avec l’accessibilité ;
  2. Il en existe une version alternative en téléchargement compatible avec l’accessibilité ;
  3. Il en existe une version alternative au format HTML compatible avec l’accessibilité.

Page : Erreur


Tous les critères non conformes du site

Critère 1.3
Certaines images porteuses d’information ayant une alternative textuelle, ont une alternative non pertinente.

Critère 1.6
Certaines images porteuses d’information n’ont pas de description détaillée.

Critère 3.2
Pour certaines pages web, le contraste entre la couleur du texte et la couleur de son arrière-plan n’est pas suffisamment élevé.

Critère 6.1
Certains liens ne sont pas explicites.

Critère 7.1
Certains scripts ne sont pas compatibles avec les technologies d’assistance.

Critère 7.3
Certains scripts ne sont pas contrôlables par le clavier et par tout dispositif de pointage.

Critère 7.4
Pour certains scripts qui initient un changement de contexte, l’utilisateur n’est pas averti ou en n’a pas le contrôle.

Critère 7.5
Pour certaines pages web, les messages de statut ne sont pas correctement restitués par les technologies d’assistance.

Critère 8.2
Pour certaines pages web, le code source généré n’est pas valide selon le type de document spécifié.

Critère 8.9
Pour certaines pages web, les balises ne doivent pas être utilisées uniquement à des fins de présentation.

Critère 9.1
Pour certaines pages web, l’information n’est pas structurée par l’utilisation appropriée de titres.

Critère 10.6
Pour certaines pages web, certains liens dont la nature n’est pas évidente ne sont pas visibles par rapport au texte environnant.

Critère 10.11
Pour certaines pages web, les contenus sont présentés en ayant recours à la fois à un défilement vertical pour une fenêtre ayant une hauteur de 256px ou une largeur de 320px.

Critère 11.5
Pour certains formulaires, les champs de même nature ne sont pas regroupés, si nécessaire.

Critère 11.6
Pour certains formulaires, certains regroupements de champs de formulaire n’ont pas de légende.

Critère 11.9
Pour certains formulaires, certains intitulés de certains boutons ne sont pas pertinents.

Critère 11.10
Pour certains formulaires, certains contrôles de saisie ne sont pas utilisés de manière pertinente.

Critère 13.3
Pour certaines pages web, certains documents bureautiques en téléchargement ne possèdent pas une version accessible.