Problèmes de pagination

Un des problèmes en termes d'user experience que je rencontre très souvent est celui de la pagination, ce sera donc le thème de cet article. En effet, je pense que l'utilisateur ne doit pas réfléchir sur quel lien cliquer lorsqu'il veut se balader sur un site, ça doit résulter d'un automatisme et d'une certaine évidence. Tout est une question de chronologie dans mon opinion, je vous propose d'étudier différents cas.

Pratique courante du précédent / suivant

Aujourd'hui la plupart des sites que je visite adoptent la pratique de « page suivante » et « page précédente ». Cependant il m'arrive parfois d'être confuse parce que les pratiques diffèrent selon les sites, si bien que je ne sais pas quoi penser parfois.

Précédent pour des pages plus anciennes

C'est probablement la forme de pagination la plus utilisée. Un exemple est le site de Trent Walton :

Ici, le lien Prev pour précédent renvoit à une page plus ancienne, dont les articles ont été écrits précédemment. Cela parait évident quand on arrive sur la première page parce qu'il est impossible de cliquer sur le bouton Next pour suivant. Mais ça l'est beaucoup moins si on est parachuté sur la 3è page. De plus, ce n'est pas le mot en lui-même qui nous fait comprendre le système mais le fait qu'un lien soit impossible à cliquer.

À première vue, on pourrait se dire que si tout le monde suit cette convention, mon article est sans intérêt car tout coule de source. Et bien non, certains sites pratiquent l'inverse.

Précédent pour les pages à numéro inférieur

Une autre utilisation du système précédent/suivant est celle choisie par Metalab :

Dans l'exemple cité juste avant, le lien précédent renvoyait à la page 2, alors qu'ici, c'est le bouton suivant (next) qui renvoit à la page numéro 2. Ici, je suppose que le choix vient de la lecture d'un livre de langue latine, où vous allez à la page suivante qui se trouve à droite.

Problèmes soulevés par ces pratiques

Le mot précédent ou suivant ici peut avoir plusieurs sens qui sont chacun valables mais qui ne sont pas universels. C'est pourquoi je pense qu'il est intéressant d'introduire la notion de temporalité afin de faciliter la navigation.

La solution du ancien / récent

Intérêt

Pourquoi ne pense-t-on pas automatiquement à la solution la plus évidente qui puisse exister pour des pages ordonnées chronologiquement ? Il s'agit bien sûr d'un système plus récent et plus ancien, ou respectivement newer et older. Il faut noter que dans la tête de l'utilisateur, ce qui se passe est très simple: je veux accéder aux nouveaux articles ou alors voir les anciens articles. C'est cette notion de temporalité qui donne la direction que nous devrions suivre. En utilisant le vocabulaire approprié, il lui suffira simplement de lire et ce sera évident pour lui.

À gauche ou à droite ?

Je pense qu'une fois qu'on utilise les mots appropriés, le positionnement des liens est de second intérêt, mais on peut toujours s'y intéresser.

Cas1: anciens à droite

Cet ordre suit la pagination des pages. C'est à dire qu'il faut se représenter les pages, 1, puis 2, etc. jusqu'à la dernière et nième page.
Il est pratique de l'utiliser si vous voulez ajouter un système de navigation où l'utilisateur peut cliquer sur un numéro de page. De plus il a l'avantage de se présenter comme un livre qu'on feuillette (sujet à débat, il faut en effet noter que toutes les lectures ne se font pas de gauche à droite, comme pour l'arabe).

Voici un exemple avec le site de Webdesign Friday:

Cas 2: ancien à gauche

Je vais ici utiliser l'exemple du site de Kirby, qui d'ailleurs offre un très bon CMS sans base de données dont je vous ai parlé ici :

Ici, le principe est celui de la frise chronologique, les événements les plus anciens se situant à gauche, et les plus récents à droite :

Il est en soit logique, par contre il commence à poser problème dès que l'on ajoute une pagination à numéros. En effet, si l'on affiche les pages 1, 2, ... i ... n, alors il faut positionner le lien plus ancien à droite.

Originalité

Il est aussi possible de faire dans l'originalité et de ne pas employer les mots anciens ou récents, Thibault Ninove le montre bien :

Ici, l'utilisation des années 1990 et 2020 introduit la notion de temporalité de façon différente. De plus les années sont prises dans deux millénaires différents, ce qui rend la navigation encore plus évidente.

Conclusion

Certains me diront probablement que j'ai fait tout un article pour ne dire que cela, mais je pense que chaque détail compte et il est donc important d'être concis et logique afin d'offrir des solutions de facilité à ceux qui vont liront. Je pense que cet article montre clairement que la solution de pagination la plus évidente est celle où la notion de temporalité (je sais, c'est la 4è fois que je le dis) est introduite.

Enfin, j'ai une petite remarque pour ouvrir sur un autre sujet sur lequel je me pose beaucoup de questions: Faut-il inverser la numérotation des pages ? Je n'ai pas vu de site le faire, mais je me demande si ça ne serait pas plus logique. Le fait de numéroter la page la plus récente en 1ère position est aussi très logique car c'est le point de départ de lecture d'un blog pour un nouvel arrivant. Mais si on aborde cela dans l'autre sens, on peut se dire que la première page d'un blog devrait peut-être celle que l'on a écrite en premier. De plus, ça pourrait introduire cette notion de permanence. C'est pratique si on veut mettre un marque page sur une page sur laquelle on s'est arrêté, ou alors renvoyer à une page autour de laquelle des articles intéressants se trouvent.