Design et accessibilité
Système de design de l'État
L'interface du site Open Collectivités utilise les composants du système de design de l'État. Vous pouvez retrouver tous les composants et les ressources sur le site dédié au système de design de l'État.
- Les maquettes ont été réalisées sur Sketch, à l'aide de la librairie de composants.
- Les typographies officielles sont Marianne et Spectral.
- Les icônes utilisées sont celles de la sous-librairie d'icônes du DSFR, ou si besoin de la librairie open source remix icons.
- Les illustrations sont issues de la librairie open source undraw, mises aux couleurs du DSFR avec la couleur d'illustration F-blue-soft #5770BE.
Audit d'accessibilité
Respecter la loi
A minima, le site Open Collectivités doit afficher en pied de page la mention “Accessibilité : conforme OU non conforme” qui ouvre une déclaration d’accessibilité.
La déclaration d'accessibilité peut-être générée à cette adresse : https://betagouv.github.io/a11y-generateur-declaration/#create
Améliorer l'accessibilité
Les outils utiles pour améliorer l'accessibilité du site :
Outils d’auto-diagnostic spécifiques à l'État :
- 10 choses faciles à vérifier pour un site plus accessible
- Diagnostic flash
- Audit rapide
- Assistant RGAA
- Liste d’outils gérant le RGAA sur le site du W3C
Outils d’auto-diagnostic généralistes :
- Wave, pour un diagnostic global : wave.webaim.org
- Webhint, pour un diagnostic global (en ligne de commande ou en extension navigateur) : webhint.io
- HeadingsMap, pour vérifier la hiérarchie des niveaux de titres : Extension pour Chrome | Extension pour Firefox
- WCAG Color contrast checker, pour vérifier les contrastes de couleurs en ligne : Extension pour Chrome | Extension pour Firefox | Outil en ligne
- Stark, pour vérifier les contrastes de couleurs et simuler les daltonismes sur les softs de design (Sketch, Figma, XD + extension Chrome) : getstark.co