Bonnes pratiques

Bandeau cookies accessible : le consentement RGPD doit pouvoir être refusé

Un bandeau cookies non accessible n'est pas qu'un défaut d'accessibilité : il viole le RGPD en rendant le consentement impossible à tous. Entre l'European Accessibility Act et les obligations de consentement écrit, votre bandeau doit fonctionner au clavier, au zoom et dans les contrastes minimaux. Découvrez comment l'évaluer en quelques minutes et les sept points clés.

La réponse courte

Un bandeau cookies inaccessible crée une double non-conformité : le RGPD invalide tout consentement que l'utilisateur ne peut pas exprimer (impossible de refuser au clavier, contraste insuffisant, bouton sans étiquette), et l'EAA impose l'accessibilité de tous les éléments d'interface. Les sept vérifications minimales : focus visible à l'ouverture, navigation clavier complète, contrastes 4,5:1, noms accessibles sur les boutons, refus aussi facile que l'acceptation, absence de pièges de focus, lisibilité au zoom 200 pour cent.

Pourquoi un bandeau cookies non accessible casse le RGPD

Le RGPD demande un consentement explicite et libre. Or, le consentement n'est libre que si le refus est aussi facile que l'acceptation, et n'est accessible que si chacun peut l'exprimer : clavier, lecteur d'écran, déficience visuelle, tremblements moteurs. Si le bouton « Refuser » est absent du flux clavier, masqué sous 50 pixels de contenu clickable, nommé en vide (aria-label vide ou absent) ou en contraste 2:1 sur fond blanc, l'utilisateur en situation de handicap ne peut techniquement pas le refuser : le consentement que votre site collecte n'est donc pas juridiquement valide.

La CNIL, depuis ses orientations 2021 et confirmées en 2023, considère que tout obstacle à l'expression du choix (consentement ou refus) rend ce choix non conforme. L'accessibilité n'est plus optionnelle : c'est une prérequis technique du RGPD lui-même.

La couche de conformité supplémentaire : l'European Accessibility Act

L'EAA, en application le 28 juin 2025, impose à tous les sites et applications web en Europe l'accessibilité selon la norme WCAG 2.1 niveau AA. Cela couvre aussi les bandeaux cookies, qui sont les premiers éléments rendus sur la page : c'est donc la première conformité EAA que votre site affiche au visiteur. Si cette première couche échoue, la CNIL et les autorités d'accessibilité auront un signal immédiat de négligence.

La combinaison est implacable : un bandeau inaccessible crée une charge de non-conformité simultanée sur deux fronts (RGPD et EAA). Les défauts identifiés d'abord (contraste, navigation clavier, labellisation) seront remontés à la fois comme violations du consentement et comme violations de l'EAA.

Les sept points à vérifier sur votre bandeau cookies

1. Focus visible à l'ouverture

Quand le bandeau s'affiche, le focus du clavier doit être présent et visible sur un élément du bandeau (le plus souvent le premier bouton ou un fermeture). Trop de sites affichent le bandeau mais laissent le focus sur l'arrière-plan : l'utilisateur au clavier ne sait pas où agir.

2. Navigation clavier complète

Tabulation (Tab) doit parcourir tous les boutons du bandeau dans un ordre logique (de gauche à droite, ou de haut en bas), et Entrée doit activer le bouton en focus. Les champs de saisie et les liens internes au bandeau doivent aussi être accessibles. Entrée (ou Espace sur les boutons) doit fonctionner.

3. Contraste de couleur suffisant

Texte sur fond : minimum 4,5:1 pour le normal, 3:1 pour les gros caractères (18pt et plus gras). Bordures et éléments graphiques : 3:1. Un bandeau blanc avec du texte gris clair échoue souvent ce test. Les boutons semi-transparents sur fond blanc échouent aussi.

4. Boutons nommés clairement

Chaque bouton doit avoir un libellé visible ET un nom accessible (attribut aria-label si le libellé est un icône, ou le texte visible du bouton). Un bouton avec juste un icône « X » pour fermer doit avoir aria-label=« Fermer » ou une alternative équivalente. Les lecteurs d'écran doivent lire « Accepter tous les cookies », pas « Bouton ».

5. Refus aussi accessible que l'acceptation

RGPD oblige. Le bouton « Refuser » ne doit pas être en plus petite police, sous un lien indirect, ou masqué derrière un clic de précision. Si « Accepter » est au clavier, « Refuser » doit aussi l'être, et clairement visible. Aucun poids ou couleur différente ne doit créer de hiérarchie fausse.

6. Pas de pièges de focus

Focus trap : quand vous appuyez sur Tab à la fin du bandeau, le focus ne doit pas vous ramener au début indéfiniment, ni vous bloquer dehors du bandeau alors que le bandeau est encore visible. Le focus doit pouvoir sortir après avoir pris une action (accepter, refuser, fermer).

7. Lisibilité au zoom 200 pour cent

À zoom 200 pour cent dans le navigateur, le texte du bandeau doit rester lisible et les boutons accessibles au pointeur. Aucun débordement invisible, aucun chevauchement de texte. Un utilisateur malvoyant qui zoome ne doit pas perdre la possibilité de refuser.

Comment tester votre bandeau en une minute

Au clavier : ouvrez votre site, fermez la souris. Appuyez sur Tab : le focus doit apparaître sur le bandeau. Continuez à tabulation, parcourez les boutons, appuyez sur Entrée. Essayez de refuser, puis accepter. Si vous ne pouvez pas toucher « Refuser » au clavier, votre bandeau échoue.

Au contraste : capturez une photo du bandeau, collez-la dans un outil de contraste en ligne (WebAIM Contrast Checker, Accessible Colors), vérifiez que le texte et les boutons atteignent 4,5:1 minimum. Si le résultat est rouge, corrigez.

Au zoom : appuyez sur Ctrl++ trois fois (zoom 200 pour cent). Le bandeau doit rester complet, lisible, et les boutons doivent tous être cliquables sans scroll horizontal.

À la lecteur d'écran : si vous utilisez un navigateur avec NVDA (Windows, gratuit) ou VoiceOver (Mac), activez-le et écoutez ce qu'il lit. Les boutons doivent être nommés de manière explicite (« Accepter tous les cookies » et non « Bouton »). Les sections doivent avoir une structure logique.

Conformité plus loin : tests manuels et gouvernance

Ces sept points couvrent les défauts automatisables (contraste, labellisation, navigation clavier, focus). Mais l'accessibilité complète du bandeau exige aussi des tests manuels : un développeur ou un auditeur doit vérifier que la logique du focus répond aux expectations (pas de pièges masqués), que les champs de personnalisation (si présents) sont navigables au clavier, et que le bandeau ne cache pas d'autres éléments critiques quand il s'affiche.

Pensez aussi à la gouvernance : la plupart des CMP (gestionnaires de consentement sur le marché) posent par défaut des défauts d'accessibilité. Avant d'en choisir un, vérifiez sa documentation sur l'EAA et le RGPD, testez son bandeau en préprod avec les sept points ci-dessus, et si possible réclamez des corrections avant la mise en ligne. Inclaria permet de scanner votre site en quelques secondes ; le bandeau cookies est souvent le premier élément de l'audit d'accessibilité, classé comme bloquant car il conditionne l'accès à tout le reste.

Mise à jour : tester le bandeau tous les trois à six mois. Chaque changement de CMP, chaque mise à jour de navigateur ou chaque modification du design peut créer une nouvelle non-conformité.

Points clés à retenir

• Un bandeau cookies inaccessible invalide le consentement RGPD et viole l'EAA.
• Les sept vérifications minimales couvrent focus, clavier, contraste, noms, égalité acceptation/refus, pièges, zoom.
• Le test manuel complète le test automatisé : navigabilité clavier réelle, logique du focus, cohérence de la gouvernance du CMP.
• Un bandeau conforme est le premier signal de conformité globale de votre site.