EAA 2025 pour l'e-commerce français : ce que vous devez faire avant votre prochain audit
L'European Accessibility Act (EAA) est entré en vigueur le 28 juin 2025. Il n'arrive pas — il est déjà là. Les entreprises B2C françaises sont désormais soumises à des obligations d'accessibilité contraignantes, et les contrôles ont commencé.
Si vous gérez un site e-commerce, une plateforme fintech ou tout produit numérique destiné aux consommateurs en France, cet article vous explique exactement qui est concerné, ce que la loi exige techniquement, pourquoi la correction a posteriori est coûteuse, et ce que vos développeurs doivent faire aujourd'hui.
1. Qui est concerné par l'EAA en France ?
L'EAA (Directive UE 2019/882) a été transposée en droit français et s'applique à toutes les entreprises du secteur privé fournissant des produits ou services numériques aux consommateurs — avec une exception : les micro-entreprises définies comme ayant moins de 10 salariés ET un chiffre d'affaires annuel inférieur à 2 millions d'euros. Les deux conditions doivent être réunies pour bénéficier de l'exemption. Dépasser l'un des deux seuils suffit à être assujetti.
Secteurs directement concernés en France :
- E-commerce — fiches produit, tunnel de commande, suivi de livraison, retours, espace client
- Fintech / banque — applications bancaires mobiles, interfaces de paiement, gestion de compte
- Edtech — plateformes de formation en ligne, lecteurs de cours, outils d'évaluation
- Santé numérique — portails patients, applications de télémédecine, gestion des ordonnances
- Transport — systèmes de réservation et billetterie, planificateurs d'itinéraires
Dates clés :
- 28 juin 2025 — EAA pleinement en vigueur pour tous les nouveaux produits et services
- 28 juin 2030 — Échéance pour les services existants couverts par des contrats de longue durée (mais la planification doit commencer maintenant)
L'autorité de transposition française est l'ARCOM (régulateur des communications numériques), appuyée par la DINUM pour les questions relatives au RGAA. Les sanctions pour non-conformité atteignent 7 500 € par infraction et 15 000 € en cas de récidive — par service.
2. Que requiert l'EAA sur le plan technique ?
L'EAA référence la norme technique européenne harmonisée EN 301 549 v3.2.1. En pratique, pour les produits web et mobile, cela signifie :
WCAG 2.2 Niveau AA — La baseline
Les Règles pour l'accessibilité des contenus Web (WCAG) 2.2 au niveau AA constituent la référence technique principale. Elles couvrent quatre principes :
- Perceptible — Le contenu doit être présentable à tous les utilisateurs (texte alternatif, sous-titres, contrastes suffisants, redimensionnement du texte)
- Utilisable — Toutes les fonctionnalités doivent être accessibles via clavier, tactile et technologies d'assistance (gestion du focus, pas de pièges clavier, délais suffisants)
- Compréhensible — Le contenu et le comportement de l'interface doivent être prévisibles (navigation cohérente, messages d'erreur, déclaration de langue)
- Robuste — Le contenu doit être compatible avec les technologies d'assistance actuelles et futures (ARIA valide, HTML sémantique)
RGAA 4.1.2 — La transposition nationale française
En France, la référence nationale d'accessibilité est le RGAA 4.1.2 (Référentiel Général d'Amélioration de l'Accessibilité), maintenu par la DINUM. Il s'aligne sur WCAG 2.2 AA avec des orientations spécifiques à la France réparties en 13 thématiques et 106 critères :
- Images (alternatives textuelles, décoratives vs. informatives)
- Cadres (titres des iframes)
- Couleurs (ratios de contraste)
- Multimédia (sous-titres, audiodescriptions)
- Tableaux (structure des tableaux de données)
- Liens (intitulés descriptifs)
- Scripts (patterns ARIA pour composants interactifs)
- Éléments obligatoires (titre de page, attribut lang)
- Structuration de l'information (titres, listes)
- Présentation (CSS, visibilité du focus)
- Formulaires (étiquettes, gestion des erreurs)
- Navigation (liens d'évitement, menus cohérents)
- Consultation (pas de lecture automatique, lisibilité)
Applications mobiles : RAAM 1.0
Pour les applications iOS et Android natives, la France utilise le RAAM 1.0 (Référentiel d'Évaluation de l'Accessibilité des Applications Mobiles), publié par la DINUM. Il applique les mêmes principes que le RGAA mais pour les contrôles natifs, les gestes et les API d'accessibilité de la plateforme.
Composants e-commerce qui échouent fréquemment aux audits
Sur la base des résultats récurrents d'audits dans l'e-commerce français :
| Composant | Défaut courant | Critère WCAG |
|---|---|---|
| Images produit | Texte alternatif absent ou générique | 1.1.1 |
| Bouton "Ajouter au panier" | Pas de nom accessible si icône seule | 4.1.2 |
| Affichage du prix | Indication de remise uniquement par couleur | 1.4.1 |
| Champs du formulaire de commande | Étiquettes non associées | 1.3.1 |
| Indicateur d'étapes | Non annoncé aux lecteurs d'écran | 4.1.3 |
| Fenêtres modales | Focus non piégé ou non restauré | 2.1.2 |
| Messages d'erreur | Non liés aux champs de formulaire | 3.3.1 |
| Filtres produits | Menus déroulants non accessibles au clavier | 2.1.1 |
3. Le problème du rattrapage : pourquoi construire accessible dès le départ coûte 10x moins
L'un des enseignements les plus constants des audits d'accessibilité e-commerce est que les problèmes d'accessibilité sont nettement moins chers à prévenir qu'à corriger. La raison est architecturale : l'accessibilité n'est pas une couche de fonctionnalités que l'on ajoute par-dessus — elle est intégrée dans la structure sémantique des composants, les patterns ARIA qu'ils implémentent, et le modèle d'interaction clavier qu'ils suivent.
Le coût réel du rattrapage
Coûts d'audit d'accessibilité externe en France :
- Petit site e-commerce (< 20 pages, flux simple) : 3 000 € – 8 000 €
- Plateforme de taille moyenne (panier, tunnel, compte, filtres) : 8 000 € – 15 000 €
- Grande marketplace ou SPA complexe : 15 000 € – 25 000 € et plus
Et ce n'est que l'audit. La remédiation est séparée — et plus coûteuse.
Pourquoi la remédiation est si coûteuse :
- Refonte de composants — Les composants inaccessibles (menus déroulants, sélecteurs de date, modales, onglets) doivent souvent être reconstruits de zéro, pas simplement patchés. Un menu déroulant personnalisé inaccessible nécessite une réécriture complète avec les rôles ARIA appropriés, la gestion du clavier et du focus.
2. Risque de régression — Modifier les composants existants casse les tests en aval, les hypothèses CSS et les flux produit. Chaque correction nécessite un cycle QA.
3. Lacune de documentation — Les composants rétrofités sont rarement accompagnés de documentation d'audit. Après correction, votre équipe doit encore rédiger le tableau de conformité RGAA 4.1.2 pour chaque composant.
4. Nouvel audit — Après remédiation, vous avez besoin d'un second audit pour confirmer les corrections. Deux audits à 8 000–15 000 € chacun représente un poste budgétaire significatif.
Le risque juridique d'attendre
Sous l'EAA, la non-conformité après le 28 juin 2025 expose votre entreprise à :
- Sanctions financières — jusqu'à 7 500 € par infraction, 15 000 € en cas de récidive
- Injonctions — les régulateurs peuvent vous obliger à suspendre ou modifier le service
- Dommage réputationnel — les associations de défense des droits en France publient des listes de services non conformes
- Exclusion commerciale — les grands clients du secteur public exigent de plus en plus la conformité accessibilité de leurs fournisseurs
4. Checklist développeur : 10 points à vérifier dès maintenant
Les 10 vérifications suivantes couvrent les critères les plus fréquemment échoués dans les audits d'accessibilité e-commerce français. Ce sont des vérifications concrètes, au niveau composant, que vos développeurs peuvent effectuer aujourd'hui.
Chaque champ de formulaire a une étiquette associée programmatiquement
Utilisez <label for="fieldId"> ou aria-labelledby. Le texte placeholder seul ne suffit pas. Vérifiez : inspectez le champ dans les DevTools, cherchez aria-labelledby ou htmlFor pointant vers l'étiquette.
WCAG 1.3.1 / RGAA 11.1Les messages d'erreur sont liés à leur champ via aria-describedby
Le texte d'erreur doit être associé programmatiquement : <span id="email-error">...</span> avec aria-describedby="email-error" sur l'input. Les lecteurs d'écran doivent annoncer l'erreur lors de la prise de focus.
WCAG 3.3.1 / RGAA 11.11La couleur n'est jamais le seul moyen de transmettre une information
Une bordure rouge seule n'est pas un indicateur d'erreur — combinez-la avec du texte ou une icône. Les prix barrés affichés uniquement en rouge échouent ce critère. Ajoutez aria-label="Prix remisé" ou du texte visible.
WCAG 1.4.1 / RGAA 3.1Ratio de contraste du texte ≥ 4,5:1 (normal), ≥ 3:1 (grand texte)
Utilisez le Colour Contrast Analyser ou les DevTools du navigateur. Le texte gris clair sur blanc est une erreur courante. Le grand texte (≥ 18pt ou 14pt gras) bénéficie du ratio 3:1.
WCAG 1.4.3 / RGAA 3.2Tous les éléments interactifs sont accessibles au clavier
Parcourez l'intégralité de votre tunnel de commande uniquement au clavier. Chaque bouton, lien, menu déroulant et filtre doit être atteignable et activable. Les composants personnalisés doivent implémenter des gestionnaires d'événements clavier.
WCAG 2.1.1 / RGAA 7.1Le focus est toujours visible — jamais outline:none sans remplacement
Recherchez dans votre CSS outline: none ou outline: 0. Si présent, vérifiez qu'un remplacement de focus visible existe (box-shadow, changement d'arrière-plan, bordure). WCAG 2.4.11 (nouveau en 2.2) exige que le focus ne soit pas entièrement masqué.
WCAG 2.4.7 / 2.4.11 / RGAA 10.7Les fenêtres modales piègent le focus et le restaurent à la fermeture
Quand une modale s'ouvre, Tab ne doit circuler qu'à l'intérieur de la modale. À la fermeture, le focus doit revenir à l'élément déclencheur. Utilisez aria-modal="true" et gérez le focus programmatiquement.
WCAG 2.1.2 / RGAA 7.1Toutes les images produit ont un texte alternatif descriptif
alt="produit" ou alt="image" échoue ce critère. Rédigez un texte descriptif : alt="Manteau caban en laine marine, double boutonnage, taille M". Les images décoratives utilisent alt="".
WCAG 1.1.1 / RGAA 1.1Les changements d'état dynamiques sont annoncés via ARIA live regions
Ajouter un article au panier, appliquer un filtre ou afficher un toast de succès doit être annoncé. Utilisez role="status" pour les mises à jour non urgentes, role="alert" pour les erreurs. aria-live="polite" pour les mises à jour du compteur panier.
WCAG 4.1.3 / RGAA 7.5La page a un <title> unique et descriptif et l'attribut lang correct
Chaque page a besoin d'un <title> unique (pas seulement "Boutique" — "Paiement — Votre Marque"). L'élément <html> a besoin de lang="fr" (ou en, etc.). Vérifiez que chaque route de votre SPA met à jour le titre du document.
WCAG 2.4.2 / 3.1.1 / RGAA 8.35. Comment Konform vous aide à livrer un e-commerce conforme
Konform fournit des composants React conçus pour être conformes à WCAG 2.2 AA et RGAA 4.1.2 dès le premier jour. Chaque composant est livré avec :
Documentation d'audit RGAA 4.1.2 par composant — Un tableau de conformité structuré listant chaque critère RGAA applicable, son statut (conforme, non applicable) et le détail d'implémentation qui le satisfait. Quand votre auditeur demande "comment cette modale gère-t-elle le focus ?", la réponse est déjà rédigée.
HTML sémantique et patterns ARIA corrects — Les composants utilisent les bons éléments HTML et rôles ARIA. Pas de div-soupe. Pas de hacks aria-label sur des éléments non interactifs. Pas de pièges clavier.
Modèles d'interaction clavier — Chaque composant interactif (menus déroulants, modales, onglets, sélecteurs de date, combobox) implémente les patterns ARIA Authoring Practices Guide pour la navigation clavier.
Conformité des contrastes de couleur par défaut — Tous les tokens de couleur intégrés respectent le ratio 4,5:1 pour le texte normal et 3:1 pour le grand texte et les composants UI.
Gestion du focus — Le piégeage du focus dans les modales, la restauration du focus à la fermeture et les indicateurs de focus visibles sont intégrés — pas laissés à la charge du développeur consommateur.
Ce que cela signifie pour votre prochain audit
Quand votre équipe utilise les composants Konform, la documentation de conformité par critère est déjà faite. Votre processus d'audit passe de "prouver que chaque composant est accessible" à "vérifier l'intégration et la structure au niveau page" — ce qui est nettement plus rapide et moins coûteux.
Un audit qui coûterait 10 000–15 000 € pour un site construit sur des composants ad hoc peut être réduit significativement lorsque la couche composant dispose déjà d'une conformité documentée. Votre auditeur valide la documentation, vérifie l'intégration, et signe.
Commencez à livrer des composants conformes aujourd'hui
Konform vous donne des composants React avec une documentation d'audit WCAG 2.2 AA et RGAA 4.1.2 intégrée. Arrêtez le rattrapage. Commencez conforme.
Articles associés
Ressources de conformité pour les équipes e-commerce françaises
checklist EAA 2025 pour développeurs
Transformez le règlement en tâches d'implémentation composant et parcours utilisateur.
guide d'audit RGAA 4 pour les équipes produit
Comprenez comment vos corrections e-commerce seront testées pendant un audit français formel.
modèle de déclaration d'accessibilité RGAA et guide de publication
Préparez la déclaration et la documentation publique attendues après la remédiation.
comparatif Konform vs AlignUI pour la conformité EAA 2025
Comparez une bibliothèque orientée design à un système de composants conçu pour la preuve de conformité.
outils RGAA gratuits et vérificateur de contraste
Commencez votre plan de remédiation avec la checklist RGAA gratuite et les contrôles de contraste.