Résumé

  • Le premier projet public du W3C, en octobre 2022, décrivait des chronologies de progression du défilement et de visibilité d’un élément capables de piloter une animation par la position plutôt que par les secondes écoulées.
  • Les versions de 2023, désormais intitulées Scroll-driven Animations, ont précisé ScrollTimeline, ViewTimeline et animation-timeline, deux manières de faire dépendre le mouvement du trajet du lecteur.

Un article illustré présente une carte qui se remplit à mesure que l’on descend dans son explication. La première lecture fonctionne : le lecteur arrive, la carte s’anime. Puis il remonte pour vérifier une frontière et découvre un numéro déjà fini. Une animation réglée sur trois secondes ne connaît ni son hésitation ni son retour. L’article est un espace que l’on parcourt dans les deux sens ; l’horloge, elle, ne sait aller qu’en avant. Un mauvais chef d’orchestre pour une lecture qui se commande avec le doigt.

Le premier projet public du W3C du 25 octobre 2022 portait le nom Scroll-linked Animations. Il distinguait deux mesures. La chronologie de progression du défilement situe un conteneur entre son début et sa fin, de 0 à 100 %. La chronologie de progression de la vue suit un élément lorsqu’il entre dans la zone visible, la traverse et en sort. L’une mesure le parcours d’un couloir ; l’autre l’apparition d’un tableau accroché au mur.

Cette différence permet de choisir le bon métronome. Une ligne de progression de lecture regarde l’ensemble du document. Une photographie explicative placée au milieu d’une longue page regarde son propre passage dans la fenêtre. En liant les deux à un simple compte à rebours, le site les condamne à jouer sans écouter la lectrice. En les liant à la position, il peut rendre le mouvement réversible : on descend, l’image avance ; on remonte, elle revient. La lecture reprend la main sur la mise en scène.

Le projet de travail du 8 décembre 2022 détaillait les outils CSS, dont scroll() et les chronologies nommées, ainsi que les propriétés liées à la vue. Le navigateur calcule la progression à partir du défilement ou de la visibilité. Le site choisit l’effet, l’élément à suivre et la portion du parcours qui compte. Un conteneur sans dépassement à faire défiler peut fournir une chronologie inactive : il faut une piste pour conduire le train. La spécification ne transforme pas magiquement n’importe quel bloc en promenade.

Le projet du 28 avril 2023 parlait de Scroll-driven Animations. Le nouveau titre éclaire l’ambition : le défilement dirige la progression, au lieu de simplement déclencher un petit feu d’artifice. CSS peut attacher un effet à une chronologie ; les interfaces Web Animations peuvent aussi exprimer le lien. La mécanique commune est une mesure de position. Ce qui s’anime et ce que cette animation raconte restent des décisions du site.

Le texte du 6 juin 2023 précise ScrollTimeline et ViewTimeline, ainsi que leur raccordement par animation-timeline. Leur progression occupe une plage finie de déplacement. Une animation classique se demande combien de secondes elle dure ; celle-ci se demande sur quel trajet elle se déroule. L’auteur peut faire apparaître une légende quand son schéma entre dans la vue ou remplir un repère tout au long de l’article. Le lecteur contrôle la vitesse en se déplaçant, et même le sens en revenant.

L’historique des publications du W3C place le premier texte public en octobre 2022 et les révisions publiées jusqu’en juin 2023. Le problème éditorial dépasse pourtant la syntaxe. Une carte qui se dévoile au rythme d’une démonstration aide à comprendre. Dix titres qui sautillent parce que la barre bouge transforment l’article en fête foraine. Le navigateur connaît la position du lecteur ; il ignore si chaque mouvement mérite de se produire. La barre de défilement peut diriger l’orchestre, mais l’éditeur choisit la partition.

Quand le dispositif fonctionne, revenir sur un passage redevient aussi naturel que le lire une première fois. La courbe se remet à la bonne étape ; le schéma attend que la lectrice avance. L’horloge peut garder les heures. La page a trouvé une mesure plus fidèle à la façon dont on lit.