Principes du mouvement pour l’accessibilité

Faites un usage modéré des animations, surtout si elles occupent une grande partie de l’écran.Les animations peuvent désorienter les utilisateurs et même les incommoder. Les animations initiées par l’utilisateur sont mieux perçues pour l’état du système et le retour visuel, ainsi que pour la compréhension des relations spatiales d’un site. L’utilisateur doit pouvoir contrôler lui-même l’expérience à l’écran.


Bases du mouvement

Bases du mouvement

Évitez le détournement du défilement, les effets de parallaxe et les vidéos, les gifs ou l’audio en lecture automatique, sauf si cela ajoute à l’expérience.

L’utilisateur doit avoir la possibilité de désactiver les animations automatiques, et celles-ci ne doivent pas jouer en boucle.

Des contrôles intégrés aux préférences du système d’exploitation permettent de réduire le mouvement sur les appareils et sur les ordinateurs. Si l’utilisateur a activé cette fonction, il faut rendre l’animation statique, tout en conservant le même message, le même sens ou le même effet à l’aide d’une requête multimédia.

L’œil humain perçoit environ 200 images par seconde. Utilisez un taux de rafraîchissement de 30 images par seconde pour que le mouvement soit le plus uniforme que possible.

Les concepteurs et les développeurs doivent s’assurer de respecter l’ensemble de la norme relative aux principes du mouvement.

Évitez le détournement du défilement, les effets de parallaxe et les vidéos, les gifs ou l’audio en lecture automatique, sauf si cela ajoute à l’expérience.

L’utilisateur doit avoir la possibilité de désactiver les animations automatiques, et celles-ci ne doivent pas jouer en boucle.

Des contrôles intégrés aux préférences du système d’exploitation permettent de réduire le mouvement sur les appareils et sur les ordinateurs. Si l’utilisateur a activé cette fonction, il faut rendre l’animation statique, tout en conservant le même message, le même sens ou le même effet à l’aide d’une requête multimédia.

L’œil humain perçoit environ 200 images par seconde. Utilisez un taux de rafraîchissement de 30 images par seconde pour que le mouvement soit le plus uniforme que possible.

Les concepteurs et les développeurs doivent s’assurer de respecter l’ensemble de la norme relative aux principes du mouvement.


Mouvements et rédaction de contenu

Mouvements et rédaction de contenu

Les praticiens du contenu doivent réfléchir au contenu connexe pour les éléments en mouvement ou pour les solutions de rechange à mouvement réduit.

Si l’expérience utilisateur ou un membre de l’équipe de développement décide d’une solution de rechange à mouvement réduit, il faut rédiger et traduire un texte de remplacement ou descriptif.

Si l’élément est en mouvement, du texte de remplacement, des sous-titres ou un texte qui décrit la vidéo  doivent être rédigés et traduits.

Les praticiens du contenu doivent réfléchir au contenu connexe pour les éléments en mouvement ou pour les solutions de rechange à mouvement réduit.

Si l’expérience utilisateur ou un membre de l’équipe de développement décide d’une solution de rechange à mouvement réduit, il faut rédiger et traduire un texte de remplacement ou descriptif.

Si l’élément est en mouvement, du texte de remplacement, des sous-titres ou un texte qui décrit la vidéo  doivent être rédigés et traduits.


Préférences de mouvement dans votre système d’exploitation et votre navigateur

Préférences de mouvement dans votre système d’exploitation et votre navigateur

En tant que développeurs, vous devez savoir comment les navigateurs permettent aux utilisateurs de personnaliser leur expérience. De nombreux systèmes d’exploitation et navigateurs prennent en charge la réduction des mouvements et les restrictions de lecture automatique. Bien d’autres fonctions sont envisagées chaque jour.

Au niveau du système d’exploitation, par exemple sur Mac OSX, il existe des paramètres de réduction des mouvements.

 De nombreux navigateurs prennent en charge la requête de média @prefers-reduced-motion. Vous pouvez l’utiliser pour créer une solution de rechange moins intrusive que l’animation ou la micro-animation. Remplacez le mouvement par une image statique ou par un dégradé léger et élégant.

Ressources :

En tant que développeurs, vous devez savoir comment les navigateurs permettent aux utilisateurs de personnaliser leur expérience. De nombreux systèmes d’exploitation et navigateurs prennent en charge la réduction des mouvements et les restrictions de lecture automatique. Bien d’autres fonctions sont envisagées chaque jour.

Au niveau du système d’exploitation, par exemple sur Mac OSX, il existe des paramètres de réduction des mouvements.

 De nombreux navigateurs prennent en charge la requête de média @prefers-reduced-motion. Vous pouvez l’utiliser pour créer une solution de rechange moins intrusive que l’animation ou la micro-animation. Remplacez le mouvement par une image statique ou par un dégradé léger et élégant.

Ressources :


Explore more

Explore more