Aller au contenu principal

Accessibilité RGAA avec PrestaShop : le guide complet

PrestaShop est la plateforme e-commerce open source la plus utilisée en France, avec près de 300 000 boutiques actives. Son architecture modulaire facilite la personnalisation mais complique l'accessibilité : chaque module et thème peut introduire ses propres problèmes. Ce guide couvre les pièges les plus fréquents sur les boutiques PrestaShop et les bonnes pratiques pour un tunnel de conversion accessible, de la fiche produit jusqu'au paiement, en conformité RGAA 4.1.

PrestaShop, leader e-commerce en France

PrestaShop est né en France en 2007 et reste largement utilisé par les PME françaises, notamment via l'hébergement 1&1, OVH et Ionos. La version 8.x a introduit des améliorations d'accessibilité dans le back-office, mais le front reste très dépendant du thème choisi. La directive européenne sur l'accessibilité (EAA 2025) impose aux e-commerçants de mise en conformité RGAA ou EN 301 549.

300k+

Boutiques PrestaShop en France

30%+

Part de marché e-commerce FR

5000+

Modules sur le marketplace

En Bref : L'essentiel à retenir

  • Framework : PrestaShop nécessite une attention particulière à la sémantique HTML.
  • Point Critique : Gestion du focus lors de la navigation dynamique.
  • Outil Recommandé : PrestaShop Classic Theme.
  • Critères RGAA clés : 1.1, 3.1, 7.3.

Comment auditer un site PrestaShop en 5 étapes

Suivez ce guide étape par étape pour réaliser un audit RGAA complet de votre application PrestaShop.

1

Scanner la boutique

Lancez RGAA Checker sur la page d'accueil, une fiche produit et la page de panier pour couvrir les gabarits principaux.

2

Auditer le thème

Vérifiez la structure HTML générée par votre thème (Classic, Warehouse, etc.) : hiérarchie des titres, landmarks, focus visible.

3

Tester le tunnel d'achat

Parcourez tout le checkout au clavier, du panier à la confirmation de commande, sans utiliser la souris.

4

Contrôler les modules actifs

Chaque module installé (popup, chat, filtres à facettes) doit être testé séparément. Désactivez ceux qui bloquent l'accessibilité.

5

Vérifier avec un lecteur d'écran

NVDA ou VoiceOver sur la fiche produit pour valider l'annonce du prix, des variantes et du bouton d'ajout au panier.

Erreurs Fréquentes avec PrestaShop

Thème Classic non audité a11y

Le thème Classic fourni par défaut contient plusieurs problèmes d'accessibilité : menu déroulant clavier incomplet, focus masqué sur certains liens, sélecteur de quantité sans label.

À éviter
<div class="qty-input" onclick="increment()">+</div>
Bonne pratique
<button type="button" aria-label="Augmenter la quantité">+</button>

Filtres à facettes sans annonce

Le module Faceted Search met à jour la liste de produits sans annoncer le changement aux lecteurs d'écran. L'utilisateur ne sait pas combien de résultats restent.

À éviter
<div id="product-list">...</div>
Bonne pratique
<div id="product-list" aria-live="polite" aria-atomic="false">...</div>

Images produits sans alt descriptif

Par défaut, PrestaShop utilise le nom du produit comme alt. Pour les visuels multiples (packshot, détail, contexte), tous les alt sont identiques, ce qui n'apporte aucune information supplémentaire.

Pastilles couleur sans texte

Les variantes de couleur sont souvent affichées comme carrés colorés sans label texte, ce qui bloque les lecteurs d'écran et viole le critère RGAA 3.1.

À éviter
<a class="color" style="background:red"></a>
Bonne pratique
<a class="color" style="background:red" aria-label="Rouge"><span class="sr-only">Rouge</span></a>

Popups de cookies non accessibles

Beaucoup de modules RGPD PrestaShop bloquent le focus sous la bannière sans la piéger, ou masquent le contenu derrière sans aria-hidden. L'utilisateur clavier se retrouve coincé.

Back-office contraste insuffisant

Le back-office PrestaShop utilise du texte gris clair sur fond blanc dans de nombreuses zones, en-dessous du ratio 4.5:1 requis par le critère 3.2 RGAA.

Packages à éviter

Ces packages sont connus pour causer des problèmes d'accessibilité. Évitez-les ou configurez-les correctement.

UserWay / AccessiBe

Overlays qui simulent l'accessibilité sans la corriger, déconseillés par la communauté a11y

Alternative : Corriger le thème à la source

Modules de carrousel auto-play

Carrousels sans pause qui tournent automatiquement, non conformes RGAA 13.8

Alternative : Carrousel statique ou avec bouton pause

Popups newsletter agressives

Nombreux modules n'ont pas de bouton de fermeture clavier ni aria-modal

Alternative : Popup codée en HTML natif avec focus trap

Bonnes Pratiques PrestaShop

Choisir un thème audité

Privilégiez les thèmes officiels récents (Classic 8.x mis à jour, Hummingbird) ou faites auditer un thème premium avant l'achat. Demandez la déclaration de conformité RGAA.

Personnaliser le fichier header.tpl

Ajoutez un skip link « Aller au contenu principal » dans header.tpl et les landmarks HTML5 (<main>, <nav>, <footer>) dans les templates parents.

Étiqueter les champs de paiement

Le formulaire de checkout doit avoir des <label for> explicites sur tous les champs. Ne vous fiez pas aux placeholders qui disparaissent au focus.

Activer le mode debug HTML

Lancez PrestaShop en mode dev et inspectez le HTML généré. Retirez les <div> inutiles ajoutés par les hooks de modules mal codés.

Traduire les attributs aria

Les aria-label doivent être traduits dans toutes les langues actives. Utilisez {l s='Fermer' d='Shop.Theme.Actions'} plutôt que du texte en dur.

Critères RGAA clés pour PrestaShop

Ces critères du référentiel RGAA sont particulièrement importants pour les sites PrestaShop.

1.1

Alternatives textuelles

Chaque image produit doit avoir un alt contextualisé, pas uniquement le nom du produit

3.1

Information par la couleur

Variantes de couleur accompagnées d'un texte, pastilles non suffisantes seules

7.3

Scripts accessibles

Filtres à facettes, quantité, ajout panier utilisables au clavier

11.1

Étiquetage des champs

Formulaires de checkout, création de compte et adresse avec labels explicites

11.10

Contrôle de saisie

Validation accessible sur les champs TVA, code postal et CVV

13.3

Versions accessibles

Factures PDF téléchargées depuis le compte client doivent être accessibles

Checklist accessibilité PrestaShop

Vérifiez ces points essentiels avant de mettre votre site PrestaShop en production.

  • Thème PrestaShop 8.x à jour ou audité RGAA
  • Skip link présent dans header.tpl
  • Landmarks HTML5 (main, nav, footer) dans les templates
  • Alt text uniques pour chaque visuel produit
  • Variantes de couleur avec label texte
  • Tunnel de commande testable au clavier
  • Filtres à facettes avec annonces aria-live
  • Popup RGPD avec focus trap correct
  • Contraste texte/fond conforme partout
  • Modules installés individuellement testés

Questions Fréquentes sur PrestaShop et l'accessibilité

PrestaShop est-il accessible par défaut ?

Le cœur de PrestaShop respecte partiellement les critères RGAA, mais le thème Classic et la plupart des modules tiers ne sont pas audités. La conformité complète demande un travail de personnalisation sur les templates Smarty et le choix attentif des modules.

Comment rendre une boutique PrestaShop conforme RGAA ?

Auditez d'abord votre thème et vos modules avec RGAA Checker, corrigez les templates problématiques, ajoutez les landmarks et skip links, puis rédigez une déclaration d'accessibilité conforme. Prévoyez 3 à 6 mois pour une mise en conformité complète.

Quels modules PrestaShop d'accessibilité installer ?

Évitez les modules « overlay » qui promettent la conformité magique, car ils sont inefficaces. Privilégiez des modules spécifiques : Sa11y pour les rédacteurs, module de skip link, modules de focus visible. La plupart des corrections se font au niveau du thème.

Le back-office PrestaShop est-il accessible ?

Le back-office a été amélioré en version 8.x mais reste partiellement accessible. Si vos employés utilisent des technologies d'assistance, testez leur parcours de création produit et envisagez des formations dédiées.

Auditez votre site PrestaShop gratuitement

Vérifiez si votre application respecte les 106 critères RGAA en moins de 30 secondes.

Lancer un audit RGAA gratuit