Le scroll infini est une technique qui permet aux utilisateurs de scroller très longtemps sur un fil d’actualité comme sur Twitter, Facebook.
Cette technique implique d’injecter du nouveau contenu de façon récurrente quand l’utilisateur scroll.
Ce n’est pas pour autant une solution efficace pour tous les sites web, il faut tenir compte des objectifs de votre produit pour justifier l’usage de cette fonctionnalité.
5 règles d’or du scroll infini :
Lorsque vous gardez votre barre de navigation visible, vous créez une meilleure expérience de navigation pour les utilisateurs. En effet, si cette barre de navigation est hors de portée, les utilisateurs devront scroller jusqu’en bas lorsqu’ils arrivent au bout de la liste.
Voici un conseil pour le mobile : un écran mobile étant plus étroit, la barre de navigation peut prendre une large portion de l’écran. Si l’écran est dédié au fil d’actualité (scroll), la barre de navigation peut être cachée au scroll et apparaître lorsque l’utilisateur commence à tirer vers le bas pour remonter dans le fil d’actualité.
Mode Desktop
Version mobile
L’infinite scroll empêche l’utilisateur à accéder au footer, il s’agit d’un vrai challenge.
Les items continuent de charger pendant que l’utilisateur descend sur la page. Ce dernier verra le footer pendant 1 à 2 secondes avant de découvrir de nouveaux contenus.
Si votre site/application propose un footer avec des informations importantes, nous vous recommandons d’utiliser le “mode chargement” comme évoqué plus haut. Le nouveau contenu. Le nouveau contenu n'apparaîtra pas tant que l’utilisateur ne clique pas sur “charger plus de contenus”, ceci permet aux utilisateurs de prendre une décision plutôt que de les pré-destiné à un choix (cf le nudge).
Le grand challenge du scroll infini est le positionnement du scroll, en effet, il ne s’agit pas d’un état. Si l’utilisateur suit le lien depuis la liste et clique ensuite sur le bouton retour, il s’attend à retourner sur la page originale. Lorsque la position de l’utilisateur sur le fil n’est pas traqué, le navigateur relié au bouton de retour va générer un reset de la position du scroll vers le début de la page. Ce n’est pas surprenant que l’utilisateur soit frustré et quitte l’application car la gestion du fil d’actualité n’a pas été optimisée.
bouton de retour de Safari
Faites en sorte que vous utilisateurs se retrouve dans le parcours utilisateur et ce même après avoir cliqué sur le bouton retour. Une fois qu’un utilisateur a visité un item particulier du fil d’actualité, il doit être en mesure de retourner sur ce dernier et d’être redirigé à l’endroit où il s’était arrêté.
L’un des gros inconvénients du scroll infini est l’impossibilité d’ajouter des éléments en favoris.
Lorsque de nouveaux contenus chargent, les utilisateurs ont besoin d’un visuel clair qui leur indique que cette action est cours. Gardez vos utilisateurs informé en utilisant un indicateur progressif :
Loader de Linkedin
Conclusion :
Lorsque le scroll infini est bien implémenté, il permet de créer une expérience utilisateur fluide et sans frictions.
Source : https://addyosmani.com/blog/infinite-scroll-without-layout-shifts/