Accessibilité numérique pour tous : que faut-il faire pour rendre le site de la collectivité accessible ?

A compter de Janvier 2020, le site internet de votre collectivité devra être en conformité avec la directive européenne portant sur l'accessibilité numérique, qui consiste à rendre accessible le site de la collectivité à tous les utilisateurs, y compris ceux en situation de handicap (notamment les personnes malvoyantes et aveugles ou dans l'impossibilité d'utiliser une souris). Cela va demander certaines adaptations techniques et ergonomiques de notre côté, et organisationnelles du vôtre (intégration des médias avec des légendes, océrisation des documents disponibles en téléchargement, etc.)

Côté développeur, qu'implique la mise en conformité avec l'accessibilité numérique ?

Chaque cas étant unique, nous allons devoir en premier lieu procéder à un audit d'accessibilité afin de déterminer les opérations que nous allons mener sur le site, lorsque cela est possible, pour atteindre un niveau d'accessibilité convenable.

Voici la liste des opérations qui devront être menées à minima pour franchir avec succès les audits d'accessibilité  :

  • Adaptation du code source du template graphique

  • Adaptations aux normes RGAA

  • Intégration d'un module d'agrandissement des polices

  • Intégration d'un sélecteur de contraste
  • Intégration de la navigation au clavier

  • Ajout d'un menu d’accessibilité rapide

  • Intégration de la prise de focus

  • Ajout d'un plan du site

  • Modification de l'outil de gestion documentaire pour l'intégration des infos doctype

En fonction de « l'âge» de votre site et de la validité de son code, ces opérations pourront être menées plus ou moins rapidement.

Notez enfin que nous vous fournirons également des recommandations pour l'intégration des contenus afin de vous inculquer les bonnes pratiques pour garantir l'accessibilité des contenus que vous intégrerez, comme nous l'expliquons en détails dans le chapitre suivant.

Côté mairie, qu'est-ce-que cela va changer au niveau de la gestion quotidienne du site internet de la collectivité ?

A propos de la publication des délibérations sur le site internet de la collectivité

Veillez désormais scrupuleusement à la lisibilité de vos documents !

Vos pdf ne doivent en aucun cas être « aplatis » (par exemple les délibération scannées doivent être océsirées avant d'être publiées sur le site internet), sous peine de léser les personnes malvoyantes ou aveugles qui ne pourront pas faire interpréter ou vocaliser vos documents par leurs outils d'aide à la lecture. Cela peut être considéré comme une discrimination et donc à ce titre constituer une infraction passible de sanctions financières dans le cadre de la directive européenne qui entre en vigueur au 1er Janvier 2020.

En ce qui concerne l'intégration de documents en général

Lorsque vous invitez un utilisateur à télécharger un ficher (pdf, doc, zip … ), vous devez l'informer sur la nature de ce fichier (type Mime) ainsi que sa taille finale.

Exemple : cliquez ici pour télécharger le dernier bulletin municipal (PDF – 11,9Mo)

Exemple d'insertion d'un document avec son type mime et son poids

Notre plug-in « ajouter un document » vient d'être mis à jour et permet désormais d'intégrer automatiquement ces informations lors de l'insertion du lien.

Description des images

Il est indispensable de renseigner l'attribut « ALT » des images avec une description courte. Cet attribut (alternative textuelle) permet de décrire l'image aux utilisateurs malvoyants ou aveugles qui disposent d'un logiciel d'aide à la lecture. Il faut donc également que cette alternative textuelle soit pertinente.

Ajout d'un attribut alt dans une image

Avertir l'utilisateur de l'ouverture de liens externes

Si vous ajoutez un texte contenant un lien sortant dans votre contenu, vous devrez désormais informer les utilisateurs en complètent l'attribut HTML « Title (titre)»

Informer l'utilisateur sur le type de lien

Veiller à respecter la structure standard de vos pages

Des styles préformatés sont disponibles dans l'éditeur de Joomla afin de vous permettre de structurer les titres de vos contenus. Pour cela on utilise des balises HTML nommées "heading" (H1, H2, H3, Hn...)

  • Le titre de l'article (balise html : h1) doit être unique

  • Les sous-titres doivent respecter un ordre logique (h2 → h3 → h4 … )

  • Autre exemple ( (h2 → h3 + h3 + (h3 → h4)) / (retour sur h2 → h3))
    Cela est important aussi bien pour les moteurs de recherche que pour les outils des personnes déficientes visuelles qui vont pouvoir analyser la structure de la page et proposer des raccourcis vers certains paragraphes en navigant avec le clavier.

Respecter l'ordre et la logique des titre Hn

Évitez désormais strictement l'ajout de styles « inline » superflus et "polluants"

Évitez autant que possible de forcer une couleur sur un texte et/ou de modifier sa taille.

Certaines personnes en situation de handicap utilisent des outils d'aide à la lecture, qui facilitent notamment le changement de la taille des polices, ou encore de leur couleur afin d'ajouter du contraste pour un meilleur confort visuel. Si vous forcez les styles de l'un de ces deux éléments, vous pénalisez ces utilisateurs qui ne pourront pas modifier la taille ou la couleur des titres avec leur navigateur.

Veillez aussi à la vitesse de chargement de vos pages

L’accessibilité prend aussi en compte la vitesse de chargement des pages afin de garantir l'accès à vos contenus quel que soit l'emplacement des utilisateurs ou de leur moyen d'accéder à internet (ADSL bas-débit, EDGE, 3g, internet par satellite … )

Pour cela, il est important d'optimiser vos images avant de les charger sur le serveur. Si vous ajoutez à vos contenus des images provenant d'un appareil photo récent, celles-ci pourront aisément dépasser la dizaine de méga-octets (Mo). Un utilisateur qui voudra charger votre page depuis un téléphone mobile ou disposant d’une mauvaise connexion devra attendre plusieurs secondes, voire plus d'une minute avant que votre page ne soit complètement chargée.

Exemple d'exif entre une photo optimisée et non optimisée