Accessibilité en motion design : guide WCAG 2026 (animations, flashs, sous-titres)
Une animation peut éblouir, au sens propre. Pour certaines personnes, un flash rapide déclenche une crise ; pour d'autres, un mouvement de fond donne la nausée ; pour beaucoup, une vidéo sans sous-titres est muette. L'accessibilité n'est pas un frein à la création : c'est la garantie que le film atteint tout son public.

Le cadre : les WCAG 2.2
Les Règles pour l'accessibilité des contenus web (WCAG), publiées par le W3C, sont la référence internationale ; leur version 2.2 est la recommandation en vigueur (W3C, WCAG 2.2). Une version 3 est en préparation, mais elle n'est pas encore une norme (W3C, présentation des WCAG 3). En Europe, la directive (UE) 2019/882, dite European Accessibility Act, fixe des exigences d'accessibilité pour certains produits et services, dont le commerce en ligne et l'accès aux services de médias audiovisuels (Commission européenne).
Règle 1 : pas plus de trois flashs par seconde
Le critère 2.3.1 demande qu'un contenu ne flashe pas plus de trois fois par seconde, ou que les flashs restent sous les seuils définis (W3C, critère 2.3.1). En motion design, les transitions stroboscopiques, les flashs blancs rythmés sur la musique ou les clignotements rapides sont les premiers suspects. C'est le seul critère dont le non-respect peut causer un danger physique.
Règle 2 : pouvoir mettre en pause
Tout contenu qui bouge, défile ou clignote, démarre automatiquement, dure plus de cinq secondes et s'affiche en même temps que d'autres contenus doit pouvoir être mis en pause, arrêté ou masqué (W3C, critère 2.2.2). Une vidéo de fond en boucle ou un bandeau qui défile sur un site sont directement concernés.

Règle 3 : respecter la préférence « réduire les animations »
Les systèmes d'exploitation permettent de demander moins d'animations. Le web y accède via la requête média prefers-reduced-motion (MDN, prefers-reduced-motion), et le critère 2.3.3 recommande de pouvoir désactiver les animations déclenchées par une interaction (niveau AAA) (W3C, critère 2.3.3). Concrètement : remplacer les parallaxes, zooms et défilements par des fondus simples quand la préférence est active.
Règle 4 : sous-titrer
Les vidéos préenregistrées avec du son doivent proposer des sous-titres (W3C, critère 1.2.2). C'est aussi un enjeu d'audience : beaucoup de vidéos sont regardées sans le son, sur les réseaux sociaux comme dans les transports. Des sous-titres soignés, bien placés dans les zones de sécurité, font partie de la composition.
Règle 5 : un texte lisible
Le texte affiché sur une animation doit respecter un contraste suffisant, au moins 4,5:1 pour le texte courant au niveau AA (W3C, critère 1.4.3), et rester assez longtemps à l'écran pour être lu. Voir contraste et équilibre visuel et typographie animée.

Ma check-list avant livraison
Aucun flash au-delà de trois par seconde. Une possibilité de pause pour toute animation longue en boucle sur le web. Une version réduite des animations quand l'utilisateur le demande. Des sous-titres pour toute vidéo parlée. Un contraste vérifié pour chaque texte. Ces règles se prévoient dès la conception : elles ne coûtent presque rien au départ, et beaucoup une fois le film terminé.
Questions fréquentes
Combien de flashs par seconde sont autorisés en vidéo ?
Pas plus de trois par seconde, ou des flashs sous les seuils définis, selon le critère 2.3.1 des WCAG 2.2.
Qu'est-ce que prefers-reduced-motion ?
Une requête média qui détecte la préférence « réduire les animations » du système ; on y remplace parallaxes et zooms par des fondus simples.
Une vidéo de fond doit-elle pouvoir être mise en pause ?
Oui, si elle démarre seule, dure plus de cinq secondes et s'affiche avec d'autres contenus (critère 2.2.2).
Les prompts de cet article
Les images et le film de cet article sont générés à partir des prompts ci-dessous, en Flux pour les images et en MiniMax Hailuo pour la vidéo. Copiez-les, adaptez-les à votre marque.
- 01W3C, WCAG 2.2[ www.w3.org ]
- 02W3C, présentation des WCAG 3[ www.w3.org ]
- 03W3C, critère 2.3.1 Trois flashs[ www.w3.org ]
- 04W3C, critère 2.2.2 Mettre en pause, arrêter, masquer[ www.w3.org ]
- 05W3C, critère 2.3.3 Animations déclenchées par une interaction[ www.w3.org ]
- 06W3C, critère 1.2.2 Sous-titres[ www.w3.org ]
- 07W3C, critère 1.4.3 Contraste[ www.w3.org ]
- 08MDN, prefers-reduced-motion[ developer.mozilla.org ]
- 09Commission européenne, European Accessibility Act[ commission.europa.eu ]
Vous cherchez un directeur artistique et motion designer de confiance pour votre projet ?