La loi européenne sur l’accessibilité (EAA) est entrée pleinement en vigueur le 28 juin 2025, imposant de nouvelles exigences en matière d’accessibilité des sites web. Pour les entreprises qui exercent des activités dans l’UE ou qui travaillent avec des clients européens, il est essentiel d’améliorer l’accessibilité et de s’aligner sur ces nouvelles normes. Accessibility Widget de iubenda facilite l’accessibilité de votre site web comme jamais auparavant.
Le nouveau Accessibility Widget de iubenda a recours à des réglages pilotés par l’IA pour rendre automatiquement votre site web plus accessible aux utilisateurs souffrant de divers handicaps. Cette solution prend en charge une série de fonctions d’accessibilité, ce qui facilite la navigation et l’interaction des utilisateurs avec votre site.
Qu’est-ce que l’Accessibility Widget de iubenda ?
L’Accessibility Widget de iubenda est un widget entièrement automatisé visant à améliorer l’accessibilité de votre site web. Il adapte votre site web en temps réel pour répondre aux besoins des personnes en situation de handicap, avec des profils d’accessibilité, le redimensionnement du texte, des modes à fort contraste, des polices plus lisibles, etc. Les principales fonctionnalités sont les suivantes :
- 🎧 Texte alternatif IA et structure de la page : Ajoute un texte alternatif aux images et détecte les titres et les repères de navigation au fil de la visite, ce qui aide les personnes qui utilisent un lecteur d’écran.
- 🔳 Contraste et redimensionnement du texte : Permet aux utilisateurs d’ajuster le contraste et la taille des caractères en fonction de leurs besoins.
- ⌨️ Raccourcis clavier : Les visiteurs appuient sur Alt+0 pour ouvrir ou fermer le panneau, et sur Alt+9 pour suspendre ou rétablir les ajustements.
- 🌀 Contrôle du contenu dynamique : Permet aux utilisateurs souffrant d’épilepsie ou d’autres maladies d’arrêter les animations ou le contenu dynamique qui pourraient être dangereux.
Grâce à un processus d’installation simple, vous pouvez commencer tout de suite sans avoir à modifier le code de votre site web.
Étape 1 : Activation de l’Accessibility Widget
- Accédez au tableau de bord iubenda : Depuis votre tableau de bord iubenda, recherchez la mosaïque Accessibility Widget sous vos produits disponibles.
- Activez le widget : Cliquez sur le bouton Activer pour commencer à utiliser l’Accessibility Widget.
Étape 2 : Personnalisation de l’Accessibility Widget
Une fois l’Accessibility Widget activé, vous pouvez l’adapter à l’apparence de votre site web grâce au configurateur de l’Accessibility Widget. Cet outil est disponible aussi bien avec les nouveaux plans tarifaires qu’avec les anciens plans.
- Accédez à votre tableau de bord iubenda.
- Recherchez la mosaïque Accessibility Widget.
- Cliquez sur le bouton Paramètres pour ouvrir le configurateur.
Voici à quoi ressemble le configurateur :
Dans le configurateur, vous trouverez plusieurs options pour personnaliser le widget :
- Position du bouton d’ouverture : Choisissez où le bouton du widget apparaît à l’écran : en haut à gauche, en bas à gauche, en bas à droite ou en haut à droite
👉 Le panneau principal du widget s’ouvre toujours depuis le bas de l’écran.
- Couleurs du panneau : Choisissez une couleur principale pour le panneau, assortie au design de votre site. Avec le plan Standard, vous pouvez aussi choisir une couleur secondaire pour les éléments sélectionnés. Si vous ne le faites pas, le widget utilise la couleur principale. Un avertissement s’affiche si le contraste est trop faible, mais vous pouvez quand même enregistrer.
- Apparence du bouton d’ouverture : Ajustez la couleur de l’icône et la couleur d’arrière-plan du bouton d’ouverture.
- Langue par défaut : Le widget affiche son panneau dans la langue de chaque page. Si la langue d’une page n’est pas indiquée ou n’est pas disponible, il utilise la langue que vous définissez ici.
💡 Le panneau du widget ne renvoie pas vers une déclaration d’accessibilité. Si vous en avez une, ajoutez un lien dans le pied de page de votre site pour que les visiteurs la trouvent sur chaque page. Besoin d’en rédiger une ? Consultez notre guide sur la déclaration d’accessibilité.
💡 Toutes les modifications effectuées dans le configurateur s’appliquent automatiquement à votre Accessibility Widget, même s’il est déjà intégré à votre site web.
Étape 3 : Installation de l’Accessibility Widget sur votre site web
Une fois le widget activé, intégrez-le à votre site.
-
Intégration du widget : Copiez le code fourni pour le widget d’accessibilité et collez-le au tout début de la section « head » de votre site web (juste après la balise
<head>) pour installer le widget. - Vérifiez la fonctionnalité du widget : Après l’intégration, actualisez votre site web pour vous assurer de la visibilité et de la fonctionnalité du widget. Vous devriez maintenant voir une petite icône d’accessibilité :
Comment cela fonctionne-t-il pour les utilisateurs finaux ?
Une fois que l’Accessibility Widget est intégré et activé sur votre site web, les utilisateurs finaux pourront interagir avec lui pour personnaliser leur expérience de navigation. Lorsque les utilisateurs modifient leurs paramètres à l’aide du widget, des modifications en temps réel sont apportées à la mise en page du site web, ce qui garantit l’optimisation instantanée du contenu en fonction des préférences sélectionnées. Voici comment le widget se comporte et les fonctionnalités qu’il propose :
- Apparence du widget : Le widget d’accessibilité se présente sous la forme d’une petite icône. Lorsque l’utilisateur clique dessus, un menu d’options d’accessibilité s’ouvre, ce qui permet d’ajuster la mise en page du site web de manière intuitive.
- Préférences utilisateur : Le widget permet aux utilisateurs de sélectionner leurs préférences en matière d’accessibilité, telles que :
- Taille du texte : Les utilisateurs peuvent modifier la taille du texte pour une meilleure lisibilité.
- Réglages du contraste : Ajustez le contraste pour rendre le contenu plus visible, en particulier pour les personnes souffrant de déficiences visuelles.
- Polices lisibles : Les visiteurs peuvent passer à des polices conçues pour faciliter la lecture, comme Atkinson Hyperlegible et OpenDyslexic.
- Profils (plan Standard) : Des préréglages en un clic pour les profils Basse vision, Épilepsie et crises, Troubles moteurs, Dyslexie, Troubles cognitifs et d’apprentissage, TDAH, Lecteur d’écran et Daltonisme. Ils modifient ce que voit le visiteur, pas le code de votre site.
- Taille et style du texte : Agrandit ou ajuste le texte de manière à le rendre plus lisible sans qu’il soit nécessaire de recharger la page.
- Contraste : Modifie les couleurs de l’arrière-plan et du texte pour améliorer la visibilité des utilisateurs daltoniens ou malvoyants.
- Contrôle du contenu dynamique : Pour les utilisateurs sensibles aux animations ou aux contenus clignotants, le widget leur offre la possibilité de désactiver les animations ou de modifier le comportement des contenus dynamiques. Cette option est particulièrement utile pour les personnes souffrant de maladies telles que l’épilepsie.
- Structure de la page : Un onglet liste les titres, les repères de navigation et les liens de la page, pour que les visiteurs accèdent directement à la partie qui les intéresse. Les visiteurs peuvent aussi appuyer sur Alt+0 pour ouvrir ou fermer le panneau, et sur Alt+9 pour suspendre ou rétablir les ajustements.
- Texte alternatif IA et repères de navigation : Le widget ajoute un texte alternatif aux images et détecte les titres et les repères de navigation au fil de la visite, dans les limites mensuelles de votre plan. Cela aide les personnes qui utilisent des lecteurs d’écran.
- Pratique et accessible : Les paramètres d’accessibilité restent facilement accessibles à tout moment, grâce au widget flottant dans une position fixe sur le site, ce qui permet aux utilisateurs d’apporter des modifications en fonction de leurs besoins.
L’Accessibility Widget de iubenda vous permet d’améliorer l’accessibilité de votre site web et d’offrir une meilleure expérience, plus inclusive, à tous les utilisateurs.