boîte à outils Partage

Charte d'accessibilité d'un site web définition des objectifs et des critères d'évaluation

Concevoir un site web performant, pérenne et accessible au plus grand nombre constituent l’ambition majeure du présent site.
Pour ce faire, une checklist permettant de répondre aux objectifs fixés a été élaborée. Ce livrable s’appuie sur des articles, outils et référentiels (RGAA, Opquast, etc.) traitant des bonnes pratiques quant à la conception et la mise en ligne d'un projet web. Cette checklist, au caractère non exhaustif, définit les lignes directrices et les critères d’évaluation du niveau de performance, d’éco-conception et d’accessibilité d’un site.

Les critères d'évaluation retenus, tels que définis par les référentiels du PiDila, se veulent :

  • Objectivables : non soumis à l'interprétation de l'observateur
  • Vérifiables : critères quantifiables ou contrôlés
  • Réalistes : à l'impossible nul n'est tenu
  • Universels : indépendance vis-à-vis d'un langage ou d'une technologie spécifique

Cette charte d'accessibilité, sous forme de checklist, est disponible en téléchargement sous licence CC BY-NC-SA.
TÉLÉCHARGER LA CHARTE D'ACCESSIBILITÉ PDF

Contenu & SEO Contenu du site & référencement

Source(s) :

Contenu du site
  • Structuration et hiérarchisation du contenu (titres, contenu textuel, visuels)
  • Vérification de la grammaire et de l'orthographe
  • Existence d'un favicon
  • Respect du droit d'auteur, présence de la license de redistribution du contenu
Seo
  • Le site a été audité et corrigé via Woorank et Sitechecker
  • Les meta comportent les données appropriées pour l'affichage optimal des pages
  • Unicité et pertinence des titres et des descriptions pour chacune des pages
  • Cohérence de la structure Hn
  • Existence d'une page 404
  • Les redirections 301 ont été testées
  • Génération d'un sitemap XML

Structure sémantique Validation du HTML, CSS & JS

Source(s) :

Structure du site
  • Validation de la sémantique du HTML avec Validator W3C
  • Vérification de la compatibilité des class suivant les navigateurs avec Can I use
  • Validation du CSS avec CSS Lint
  • Les class CSS ont été préfixées avec Shouldiprefix
  • Aucune erreur détectée dans les scripts JS
  • Tous les liens internes et externes ont été testés et vérifiés avec Link Checker

Fonctionnalités Formulaires, etc.

Source(s) :

Formulaire(s)
  • Le formulaire a été testé et l'envoi du message fonctionne
  • Le formulaire fonctionne lorsque le JavaScript est désactivé
  • Les champs obligatoires ont été testés
  • L'internaute est informé de la réussite ou de l'échec de l'envoi du message
  • En cas d'échec de l'envoi, l'internaute est informé des champs qu'il doit corrigé

Rendu du site Matériels, OS et navigateurs utilisés

Source(s) :

DESKTOP : Asus Zenbook (1920px x 1080px) // OS Solus (Linux) & Windows 11
  • Chrome
  • Firefox
  • Edge
  • IE 11
DESKTOP : Lenovo All-in-one (1600px x 900px) // OS Windows 10
  • Chrome
  • IE 11
DESKTOP : Macbook Air (1366px × 768px) // OS Sierra
  • Chrome
  • Safari
  • Firefox
TABLETTE : Huawei M5 Lite (960px x 600px) // OS Android 10
  • Chrome
  • Firefox
MOBILE : Iphone XR (375px × 812px) // OS iOS 14
  • Chrome
  • Safari
MOBILE : Samsung (360px × 780px) // OS Android 11
  • Chrome
  • Firefox

Performance & sécurité Optimisation et sécurisation des ressources

Source(s) :

Performance
  • Le site a été testé et optimisé via GTmetrix, Lighthouse et Dareboost
  • Les images bitmap et svg ont été optimisées via Compressor et Nano
  • Les fichiers CSS et JS sont minifiés via Minify
  • Seuls les caractères et graisses utilisés dans ce site sont installés
Sécurité
  • Le nom de domaine est fonctionnel
  • Vérification de la conformité du protocole HTTPS et la validité du certificat SSL via SSL Labs
  • Les dossiers et fichiers sensibles sont sécurisés et non accessibles aux moteurs de recherche
  • Le site fait appel à des technologies open-source et interopérables
  • Maîtrise des partis tiers : les fichiers JS, CSS, webfonts sont appelés en local
  • Prévention des tentatives d'attaques de type XSS et clickjacking
  • Désactivation du MIME-Type sniffing
  • Configuration et validation du bon usage des en-têtes HTTP via Security Headers

Accessibilité web Handicap, inclusivité & diversité

Source(s) :

Outils d'audits WCAG
  • Vérification de la conformité WCAG 2.1 avec HTML CodeSniffer
  • Evaluation automatisée de l'accessibilité web avec WAVE
  • Audit du niveau d’accessibilité d’un site avec Tanaguru Engine
Technologies d’assistance testées
  • JAWS 2019 sous environnement Windows 10 - Firefox 78.0.2
  • NVDA 2020.2 sous environnement Windows 10 - Chrome 84
  • Voice Over sous environnement Mac OS Sierra - Safari 13
  • Voice Over sous environnement iOS 13 - Safari 13
Erreur(s) détectée(s) : correctif(s) envisagé(s)
  • Désactivation des options d'accessibilité lors du rechargement de page : mise en place d'un cookie
  • Disparition des images lors de la désactivation du JS : correction en cours

Éco-conception Optimisation de l'empreinte écologique du site

Source(s) :

Graphisme
  • Opter pour un design simple, épuré et responsive
  • Privilégier les polices standards
Côté client
  • Privilégier les pages statiques
  • Optimiser le poids des ressources (polices, images, pdfs)
  • Factoriser les déclarations CSS et JS
Côté serveur
  • Les scripts et les CSS sont minifiés
  • L'hébergeur du site affiche sa politique Green IT
  • Mise en cache des données couramment usitées
Print
  • Le site propose une CSS @print
  • Le contenu de chaque page est imprimable sans blocs de navigation
  • Impressions effectuées en N&B sans aplat de couleur
  • Polices économes en consommation d'encre
  • les pdfs sont disponibles en basse résolution