Les animations sont un excellent moyen de rendre un site WordPress plus vivant et plus engageant. Avec un simple plugin pour Gutenberg, il est d\u00e9sormais facile d\u2019ajouter des effets visuels \u00e9l\u00e9gants sans \u00e9crire une seule ligne de code.<\/p>\n\n\n\n
Mais attention : mal configur\u00e9es, les animations peuvent nuire \u00e0 l\u2019accessibilit\u00e9 d’un site web<\/strong>. Et un site peu accessible, ce sont non seulement des visiteurs exclus, mais aussi des clients potentiels perdus.<\/p>\n\n\n\n Pour une extension simple, efficace et gratuite, je recommande sans h\u00e9siter le plugin Animations for Blocks<\/strong><\/a>.<\/p>\n\n\n\n Pourquoi ?<\/p>\n\n\n\n En clair : c\u2019est l\u2019extension id\u00e9ale pour ajouter des animations WordPress sur Gutenberg rapidement et proprement<\/strong>.<\/p>\n\n\n\n Pour ceux qui utilisent encore des builders comme Elementor, incompatibles avec les blogs Gutenberg, je vais \u00eatre cash : il est temps de revoir votre politique<\/a>, de remballer vos pr\u00e9jug\u00e9s et de vous tourner vers l’avenir de WordPress avec Gutenberg<\/a>.<\/p>\n\n\n\n Sur les syst\u00e8mes modernes (Windows, macOS, Linux, iOS, Android\u2026), il existe une option d\u2019accessibilit\u00e9 permettant de r\u00e9duire ou supprimer les animations<\/strong>.<\/p>\n\n\n\n Lorsque l’option est activ\u00e9e, le navigateur envoie cette directive CSS :<\/p>\n\n\n\n \ud83d\udc49 Concr\u00e8tement, \u00e7a signifie que ton site doit adapter son comportement<\/strong> et supprimer les animations si l\u2019utilisateur en fait la demande.<\/p>\n\n\n\n Pourquoi c\u2019est important ?<\/p>\n\n\n\n Parce que certaines personnes peuvent subir des d\u00e9sagr\u00e9ments physiques :<\/p>\n\n\n\n Ignorer cette r\u00e8gle, c\u2019est leur faire passer un sale quart d’heure et leur rendre ton site inutilisable.<\/p>\n\n\n\n WordPress est nativement compatible avec cette fonctionnalit\u00e9 la r\u00e9duction de mouvement.<\/p>\n\n\n\n En particulier, le bloc \u00ab\u00a0Banni\u00e8re\u00a0\u00bb qui peut passer en mode \u00ab\u00a0Arri\u00e8re-plan fixe\u00a0\u00bb peut causer cette g\u00eane importante pour les personnes concern\u00e9es, en cr\u00e9ant une discordance entre l’arri\u00e8re plan et le texte en surimpression. Lorsque l’option d’accessibilit\u00e9 de l’utilisateur est active, l’arri\u00e8re-plan n’est plus fixe, il d\u00e9file uniform\u00e9ment avec le reste du texte.<\/p>\n\n\n\n Mais de nombreux plugins WordPress ne suivent pas encore la directive.<\/p>\n\n\n\n Alors comment peut-on obtenir le meilleur des deux mondes, en ayant de belles animations, mais qui soient d\u00e9sactiv\u00e9es pour les personnes ne les supportant pas ?<\/p>\n\n\n\n Depuis sa cr\u00e9ation, le plugin Animations for Blocks ne respectait pas cette directive d\u2019accessibilit\u00e9. Les animations continuaient \u00e0 s\u2019afficher, m\u00eame si l\u2019utilisateur avait demand\u00e9 leur suppression.<\/p>\n\n\n\n Mais c’\u00e9tait sans compter sur LRob ! J’ai rep\u00e9r\u00e9 le probl\u00e8me, et j\u2019ai contact\u00e9 le d\u00e9veloppeur pour lui proposer une correction. Sa r\u00e9ponse ?<\/p>\n\n\n\n \u201cC\u2019est un point justifi\u00e9, merci ! Depuis la version 1.2.3, Animations for Blocks est parfaitement conforme aux standards d\u2019accessibilit\u00e9<\/strong>.<\/p>\n\n\n\n C\u2019est tout l\u2019avantage d\u2019utiliser un plugin soutenu par la communaut\u00e9 WordPress : r\u00e9actif, \u00e0 l\u2019\u00e9coute, et en constante am\u00e9lioration.<\/p>\n\n\n\n Certains recommandent d’aller encore plus loin avec une fonction \u00ab\u00a0opt-out\u00a0\u00bb pour les personnes utilisant un ordinateur public. Une option qui n’est pas encore disponible mais doit pouvoir se d\u00e9velopper sur-mesure si besoin.<\/p>\n\n\n\n \ud83d\udc49 Tu veux un site WordPress performant, anim\u00e9 et accessible ?<\/p>\n\n\n\n Alors confie ton h\u00e9bergement et maintenance \u00e0 un sp\u00e9cialiste WordPress impliqu\u00e9 dans l\u2019accessibilit\u00e9<\/strong>.<\/p>\n\n\n\nQuel plugin utiliser pour animer ses blocs Gutenberg ?<\/h2>\n\n\n\n
\n
Attention : les animations nuisent \u00e0 l\u2019accessibilit\u00e9<\/h2>\n\n\n\n
prefers-reduced-motion: reduce<\/code><\/pre>\n\n\n\n\n
WordPress est-il compatible avec la r\u00e9duction de mouvement ?<\/h2>\n\n\n\n
Bonne nouvelle : Animations for Blocks est d\u00e9sormais compliant \u2705<\/h2>\n\n\n\n
\n
Ajout\u00e9 dans la version 1.2.3.\u201d<\/p>\nSka-Dev – Forum WordPress.org<\/a><\/cite><\/blockquote>\n\n\n\nEn r\u00e9sum\u00e9 :<\/h2>\n\n\n\n
\n
prefers-reduced-motion<\/code>. Si ce n’est pas le cas, pr\u00e9viens les d\u00e9veloppeurs ou change d’extension.<\/li>\n\n\n\n