Accessibilité numérique des sites du SIEEEN

Date de mise à jour : 18 avril 2024

Un plan d’actions à mener sur les 3 ans à venir

Afin d’être conforme aux demandes d’accessibilités numériques pour le site internet et extranet du SIEEEN, un audit a été réalisé début 2022. Un plan d’actions a été mis en place pour les deux prochaines années, pour tendre au maximum aux 100 % de conformité demandé.

Début 2022, le site du SIEEEN était à 43 % de conformité RGAA. En avril 2023, suite aux actions menées sur l'année 2022, le site du SIEEEN atteint 54 % de conformité au RGAA.

En avril 2024, suite aux actions menées sur l'année 2023, le site du SIEEEN atteint 61 % de conformité au RGAA.

Conformément à la réglementation stipulée par le RGAA, la conformité est atteinte dès 50 %.

L’accessibilité numérique est composée de quatre piliers fondateurs :

  • La perceptibilité : faciliter la perception visuelle et auditive,
  • L’utilisabilité : permettre l’utilisation effective des outils,
  • La compréhensibilité : faciliter la compréhension des outils,
  • La robustesse : proposer des outils adaptés.

Ces quatre piliers ont pour mission de veiller à rendre les services de la communication en ligne disponibles à tous, que la personne soit en situation de handicap ou non.

  • Lire le rapport d’accessibilité numérique du site internet du SIEEEN (lien vers le rapport en PDF)
  • Lire le rapport d’accessibilité numérique du site extranet du SIEEEN (lien vers le rapport en PDF)

Liste des actions pour l’accessibilité des sites du SIEEEN réalisées en 2022

  • Publier la page accessibilité sur le site internet et l’extranet, le lien de la page doit être /accessibilité
  • Retirer l’obligation de saisir une alternative texte aux images
  • Modifier la structuration de la page d’accueil pour que celle-ci soit cohérente après la suppression du carrousel
  • Rédiger une page décrivant de manière détaillé la carte des sites du SIEEEN sur le territoire
  • Déterminer une autre couleur pour le fond des boutons avec fond vert et texte blanc car le contraste n’est pas suffisant. Idem boutons fond bleu clair et texte blanc, pastilles du carrousel + flèches navigation chiffres clés
  • Retirer l’ensemble des balises br de chaque page car ce n’est pas conforme, il faut utiliser les balises p et gérer l’espacement via css
  • Modifier l’ensemble des formulaires des sites pour respecter le critère 11.1 et 11.10 et 11.13 et ajouter une information html pour les champs obligatoires + 10.7, 11.5, 11.6,11.10,11.13,12.11 de P02 et voir 11.13 de P12
  • Prévoir alternative aux cartes de la partie contact et des contenus agenda
  • Revoir les listes page confidentialité pour respecter critère 9.3
  • Modifier le titre des accordéons de la page publication qui doivent être introduite en tant que titre h2
  • Pagination correspond à un <h2> et non à un <h4>. Et revoir également 9.1 de P08
  • Rajout d’un focus le bouton enregistrer de la page groupement d’achat
  • Rendre les flèches des chiffres clés accessibles au clavier, introduire les éléments via des balises button ou leur attribuer l’ensemble des caractéristiques propres à ce rôle voir également 4.13 de p12
  • Les éléments permettant d’agrandir ou de réduire la taille des caractères ne sont pas activables via lecteur d’écran, il faut les introduire via une balise button. Il faut également leur donner un nom accessible via un aria-label ou title précisant l’action qu’ils permettent de réaliser
  • S’assurer que l’ensemble des composants d’interface présentent bien un nom accessible (via un attribut aria-label, aria-labelledby, title). Menu hamburger en vue mobile, éléments permettant de grossir/réduire la taille des caractères, Idem pour le bouton permettant de fermer le champ de recherche, Les flèches de navigation au sein des actualités ne sont pas actionnables via technologies d’assistance, l’état disabled des flèches de navigation au sein des actualités doit être retranscrit dans le code via l’attribut approprié.
  • L’élément permettant de soumettre le formulaire d’inscription à la newsletter n’est pas activable via lecteurs d’écran. Voir pour l’introduire via une balise correspondant à son rôle (<button>, <input type="submit">…). Voir 12.6 de P12
  • Introduire le logo du SIEEEN via une balise image et pas via du css
  • Introduire la croix de la fenêtre qui apparaît en cas d’erreur via une balise button + 7.5,9.1 de P02
  • Modifier le code de la page publication en modifiant l’ordre des input de type radio afin de respecter le critère 10.3 de P06, voir également contraste -> 10.7
  • Ajout prise de focus sur bouton voir de la page évènements + ajout étiquette de champ des select et les rendre non visible
  • Modifier le code de la page authentification pour la rendre accessible, voir P01 de l’extranet et P02 et P03
  • Pagination correspond à un <h2> et non à un <h4>. Et revoir également 9.1 de P08

Liste des actions pour l’accessibilité des sites du SIEEEN réalisées en 2023

  • Modifier le code des pages pour le rendre acccessible, le code doit être conforme et être validé par le validateur HTML du W3C. La hiérarchisation des titres doit être respectée et les balises h1 h2 et h3 ne doivent pas être utilisées pour des questions de mises en page.
  • Ajout d’un title au logo title="SIEEEN (Syndicat Intercommunal d’Energies, d’Equipement et d’Environnement de la Nièvre) - Aller à l’accueil"
  • Modifier la page video pour que les titres soient des h2 et pas des div class="h2"
  • Ajout d’un titre h1 dans la page de recherche et modification de la hiérarchie des titres
  • Rajout d’un focus le bouton enregistrer de la page groupement d’achat

Liste des actions pour l’accessibilité des sites du SIEEEN prévues en 2024-2025

  • Modifier page newsletter en introduisant le titre de la newsletter via un h1 et les titres des actus via h2
  • Modifier toutes les pages afin de respecter le critère 9.3 "Toute information structurée visuellement comme une liste doit être traduite par les balises correspondantes dans le code." et il ne doit pas y avoir d’élément isolé (une liste avec un seul élément -> page groupement d’achat par exemple pose problème + page nos missions régie chaleur + page statuts
  • Corriger le positionnement du captcha de l’ensemble des formulaires + voir 11.5 de P15 et 11.6 + 11.10
  • Modifier les boutons voir de la newsletter en ajoutant un aria-label explicite et traduire les attributs titles qui sont en anglais pour la pagination
  • Rétablir l’étiquette du premier input de type radio de la page publication + Ajout balise legend (11.7)
  • Modifier l’ensemble des liens "lire la suite" via un attribut aria-label. Pour pouvoir distinguer un lien lire la suite d’un autre il faut compléter le aria-label avec le titre du contenu, par exemple "Lire la suite informatique groupement d’achat d’énergies"Modifier le lien partager via email en ajoutant un titre "Partager via email"
  • Partager l’article sur est introduit via du css et disparait lors de la désactivation de celui-ci, il faut introduire le texte en html ou prévoir un texte caché en complément
  • Ajout d’un titre "Lecteur Vidéo Youtube" à toutes les balises iframe et frame présent sur le site (toutes les vidéos ou carte)
  • Ajout d’un attribut longdesc à la carte du territoire donnant une url vers une page contenant une description détaillée ou mettre le lien dans l’alternative textuelle ou via un lien adjacent à l’image, idem pour carte des réseaux de chaleurs page site du SIEEEN sur le département
  • Création d’une page contenant une description de la carte territoire de la page d’accueil idem carte site du SIEEEN et carte réseau chaleur et carte des syndicats de bourgogne de la page groupement d’achat + carte mission régie SIEEEN chaleur
  • Retirer les alternatives textes des miniatures des publications
  • Modifier l’alternative texte de toutes les applications. Celui-ci doit correspondre aux textes associés à l’icône
  • Vérifier chaque alternative texte des images de toutes les pages du site y compris les images affichées dans les résultats de recherche
  • Vider l’attribut alt de l’ensemble des pictogrammes et toutes les images utilisées en page d’accueil pour les actus
  • Modifier la couleur des boutons pour respecter les contraintes de contraste
  • Modification du menu principal et des sous menus. Il faut ajouter des attributs aria-haspopup et aria-expanded
  • Modifier le fil d’ariane pour signaler la page active via aria-current="true" et 12.6 de p02
  • Rendre la fonctionnalité "accordéon" de la page publication accessible, voir 7.1 et 7.2 de P06 et ajout des attributs aria-expanded et aria-haspopup pour respecter critère 10.9 de P06
  • Modifier la liste des newsletters avec des balises ul et li
  • Rédiger un guide de bonne pratiques pour respecter le RGAA lors de la publication d’un nouveau contenu
  • Modifier hiérarchie des titres de la page évènements
  • Utilisation d’unités relative pour le carrousel des chiffres clés. Voir 10.4 du P12 et 13.10
  • Modifier le titre des accordéons de la page publication qui doivent être introduite en tant que titre h2
  • Modifier les boutons voir de la newsletter en ajoutant un aria-label explicite et traduire les attibuts titles qui sont en anglais pour la pagination
  • Modifier page newsletter en introduisant titre de la newsletter via un h1 et les titres des actus via h2

Liste des actions qui ne seront pas traitées

  • Fournir une alternative à l’ensemble des contenus vidéos, soit via une page contenant une transcription textuelle soit ajouter une audio description
  • Proposer une version accessible de l’ensemble des documents bureautique téléchargeable (13.3)