2026-03-08

Démo de sommaire

Un sommaire sticky qui suit les titres actifs pendant le défilement.

Démo de sommaire

Cette expérimentation porte sur le rythme éditorial. Un sommaire doit aider à naviguer sans détourner l'attention de l'article lui-même.

const headings = useHeadingsObserver();
 
return (
  <aside className="sticky top-20">
    {headings.map((heading) => (
      <a key={heading.id} href={heading.href}>
        {heading.label}
      </a>
    ))}
  </aside>
);

L'interaction reste simple : pendant le défilement, la section active se met à jour en douceur et donne à la page une structure plus claire.

Autres expérimentations

Découvrez deux autres expérimentations du lab.