Sliced Text

Le texte tressaute avec des tranches décalées et des séparations de couleur rouge et cyan, comme un signal brouillé.

Ajoute un effet de survol « Glitch Text » (aussi appelé text glitch ou RGB split glitch) sur [où].
Tant que le pointeur survole le texte, il doit tressauter par à-coups vifs et secs : de fines tranches horizontales sautent de côté et deux copies colorées se séparent comme un signal brouillé, puis tout se remet en place quand le pointeur s’en va.
Ne garde le vrai texte qu’une seule fois dans le document pour que les lecteurs d’écran ne lisent pas les copies, et affiche le même effet au focus clavier.

De grandes lignes de texte glissent horizontalement pendant que la page défile verticalement.

Ajoute un « Text Marquee on Scroll » (aussi appelé scroll text marquee ou scroll velocity text) sur [où].
De grandes lignes de texte doivent glisser latéralement quand la page défile vers le bas, une ligne sur deux dans le sens opposé, puis revenir quand on remonte.
Lie le mouvement à la position de défilement, empêche les longues lignes de créer une barre de défilement horizontale, et garde-les immobiles si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Les lettres d’un titre se mélangent ou bougent l’une après l’autre à mesure que l’utilisateur fait défiler les sections.

Ajoute « Scrolling Letters » (aussi appelé on-scroll letter animations) sur [où].
À mesure que l’utilisateur fait défiler les sections, les lettres du titre doivent rouler vers leur caractère suivant l’une après l’autre de gauche à droite, liées directement à la position de défilement.
En remontant, elles doivent revenir en arrière, et les lecteurs d’écran doivent recevoir le titre actuel comme du texte normal.

Le texte est disposé autour d’un cercle qui tourne en continu.

Ajoute « Spinning Text » (aussi appelé circular text ou text on circle) sur [où].
Les lettres doivent être réparties uniformément autour d’un cercle qui tourne lentement et régulièrement, sans saut quand la boucle recommence.
Donne le texte une seule fois aux lecteurs d’écran comme du texte normal, et arrête la rotation si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Un titre est découpé en caractères, mots ou lignes qui s’animent l’un après l’autre avec un léger décalage.

Ajoute une entrée « Split Text Stagger » (aussi appelée letter stagger ou staggered text reveal) sur [où].
Découpe le titre en lettres qui montent et apparaissent en fondu l’une après l’autre avec un court délai entre elles, rapide et fluide, sans rebond.
Joue-la une seule fois quand le titre apparaît à l’écran, fais en sorte que les lecteurs d’écran le lisent comme un seul mot, et affiche-le sans mouvement si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Les caractères défilent comme sur un tableau des départs d’aéroport jusqu’à s’arrêter sur la lettre voulue.

Ajoute un afficheur à palettes (Split-Flap Text) sur [où] : aussi appelé text flipping board ou flip board.
Chaque case de caractère doit défiler rapidement dans l’alphabet jusqu’à s’arrêter sur sa lettre cible, les cases se fixant l’une après l’autre de gauche à droite.
Lance-le une fois à chaque fois que le texte apparaît ou change, n’annonce que le texte final aux lecteurs d’écran, et affiche le texte final sans défilement si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).