Le WordPress d'aujourd'hui, décodé pour les développeurs

Éditeur de site (FSE)

Éditeur de site pour collectivité : RGAA 4.1 sur les templates d’archives

Une liste de contrôle RGAA 4.1 ciblée sur les templates d'archives et de taxonomie du Site Editor, pour un site public.

Par WordPress Développement • 18 mai 2023 • 4 min de lecture • Aucun commentaire
Éditeur de site pour collectivité : RGAA 4.1 sur les templates d'archives

« Chaque page doit être accessible aux personnes en situation de handicap », rappelle le référentiel RGAA dans son critère fondateur. Sur un site de collectivité territoriale construit en éditeur de site, cette exigence se traduit concrètement sur des écrans souvent négligés lors des audits : les templates d’archives et de taxonomie, qui listent délibérations, actualités municipales ou pages thématiques.

Ce billet propose une liste de contrôle ciblée sur ces templates précis du Site Editor, sans prétendre couvrir l’ensemble du RGAA 4.1 ni ses obligations légales détaillées, qui relèvent d’un audit complet mené par un expert accessibilité. L’objectif est de donner un point de départ concret pour un développeur qui prépare la livraison de ces gabarits.

Titre de page et hiérarchie des titres

Le template archive.html généré par défaut par de nombreux thèmes blocs place le titre d’archive dans un bloc core/query-title, mais son niveau de titre (h1, h2…) dépend des réglages du bloc et peut entrer en conflit avec le titre du site déjà présent dans l’en-tête.

  • Vérifier qu’un seul h1 existe par page, correspondant au titre de l’archive et non au titre du site.
  • S’assurer que la hiérarchie des titres à l’intérieur de chaque carte d’article du core/query reste cohérente : un titre d’article ne doit jamais sauter de niveau par rapport au titre de la page.
  • Contrôler le template taxonomy.html séparément : le titre de taxonomie doit annoncer explicitement le nom de la catégorie ou du terme affiché, pas un intitulé générique.

Le référentiel RGAA impose qu’un élément recevant le focus clavier soit visuellement identifiable. Sur les templates d’archives, deux zones sont particulièrement sujettes à oubli : la pagination générée par le bloc core/query-pagination et les filtres de taxonomie ajoutés via un bloc de navigation.

L'essentiel à retenir : Contraste et focus visibles vérifiés bloc par bloc ; Pagination et fil d'ariane rendus lisibles au clavier ; Titres de page dynamiques cohérents par type d'archive

Le style de focus par défaut de nombreux thèmes blocs se limite à une légère variation de couleur de fond, insuffisante pour respecter le critère de contraste minimal du RGAA. Un ajout dans theme.json, ciblant les liens de pagination, corrige ce point sans complexifier le CSS du thème.

.wp-block-query-pagination a:focus-visible {
    outline: 3px solid #1a1a1a;
    outline-offset: 2px;
}

Contraste des textes secondaires

Les métadonnées d’article — date de publication, catégorie, auteur — sont souvent stylées en gris clair sur fond blanc pour marquer une hiérarchie visuelle, au détriment du contraste. Le RGAA impose un rapport de contraste minimal de 4,5:1 pour le texte normal, un seuil que beaucoup de palettes de thème.json échouent à respecter sur ces éléments secondaires.

  1. Extraire les couleurs utilisées pour les métadonnées dans theme.json et calculer leur rapport de contraste avec l’outil de vérification approprié.
  2. Ajuster la teinte plutôt que la taille de police, qui n’a pas d’effet sur la conformité au critère de contraste.
  3. Vérifier également les liens de catégorie affichés sur fond coloré dans le pattern d’en-tête d’archive : un contraste correct en isolation ne garantit pas un contraste correct une fois le lien coloré posé sur son fond réel.

Alternatives textuelles et images à la une

Le bloc core/post-featured-image, omniprésent dans les cartes d’archive, hérite normalement du texte alternatif renseigné sur le fichier média. Un contrôle systématique reste nécessaire : sur ce site, plus d’un tiers des images à la une importées lors de la migration de contenu n’avaient aucun texte alternatif renseigné, un défaut invisible tant qu’on ne teste pas au lecteur d’écran.

Un audit RGAA qui s’arrête à la page d’accueil manque presque toujours les pages qui reçoivent le plus de trafic réel : les archives et les résultats de recherche.

Liste de contrôle récapitulative

  • Un seul h1 par template d’archive et de taxonomie, hiérarchie de titres cohérente dans les cartes d’articles.
  • Focus visible avec contraste suffisant sur la pagination et les filtres de navigation.
  • Contraste 4,5:1 minimum vérifié sur les métadonnées et les liens de catégorie sur fond coloré.
  • Texte alternatif présent et pertinent sur chaque image à la une affichée en carte.
  • Titre de document (balise title) distinct pour chaque page de taxonomie, reflétant le terme affiché.

Cette liste ne remplace pas un audit RGAA complet mené selon la méthodologie officielle, mais elle couvre les points les plus fréquemment oubliés sur ces templates spécifiques, avant transmission à un auditeur accessibilité pour validation finale.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Partager :

À propos de l'auteur

WordPress Développement

Développeur WordPress, passionné par Elementor, le FSE et l’automatisation par IA.

Voir tous ses articles

Dans la même veine

À lire aussi