Comparaison comportementale
Pagination vs Indicateur d’étapes
Différence décisive
La Pagination parcourt des pages de contenu sœurs dans n’importe quel ordre ; l’Indicateur d’étapes suit des étapes ordonnées d’un processus avec une position courante.
Critères de choix, liens et sources
- PaginationChoisis Pagination si les pages sont des tranches équivalentes d’une collection et qu’aucune ne doit être terminée avant une autre.Ouvrir la fiche Pagination
- Indicateur d’étapesChoisis Indicateur d’étapes si un processus linéaire comporte au moins trois étapes utiles que l’utilisateur accomplit dans l’ordre.Ouvrir la fiche Indicateur d’étapes
Voir les neuf dimensionsVoir les sources
S’orienter dans un parcours
Essayer
Faut-il situer la page dans une hiérarchie, parcourir des pages de résultats ou montrer l’étape d’un processus ?
Pagination
Contexte commun aux essais
Pagination
Mission
Pagination
Active Suivant, va directement à la page 3 puis reviens avec Précédent en vérifiant l’état de page actuelle.
Enregistrements de la page 1
Étape 1 sur 3
Essayer
Manipule le composant. Le résultat de ton essai apparaît juste au-dessus. Avance à ton rythme.
Comportement et cas limite
- À observer
- La page 1 est actuelle et Précédent est indisponible à la première page.
- Cas limite
- Un total final inconnu omet une fausse destination de dernière page et garde Suivant fidèle à la réalité.
Indicateur d’étapes
Mission
Indicateur d’étapes
Utilise les actions séparées Suivant et Précédent, puis vérifie les états et le titre de l’écran après chaque changement.
- Détails terminée
- Documents actuelle
- Vérification à venir
2 / 3 — Documents
Les segments communiquent l’état ; les boutons séparés pilotent le parcours.
Étape 1 sur 3
Essayer
Manipule le composant. Le résultat de ton essai apparaît juste au-dessus. Avance à ton rythme.
Comportement et cas limite
- À observer
- Documents est l’étape actuelle, Détails est terminée et Vérification est à venir.
- Cas limite
- Revenir à une étape terminée préserve les données et recalcule les états sans rendre les segments décoratifs cliquables.
Ce que cet essai montre
La pagination change la tranche, découpée par quantité, d’une collection ; le fil d’Ariane expose une hiérarchie, tandis que l’indicateur d’étapes représente des étapes métier.
Lequel convient à ton besoin ?
Pagination
Des résultats ou collections ont besoin de pages stables et partageables
Indicateur d’étapes
Un processus linéaire stable comporte au moins trois sections utiles
Différence et sources
La pagination change la tranche, découpée par quantité, d’une collection ; le fil d’Ariane expose une hiérarchie, tandis que l’indicateur d’étapes représente des étapes métier.
Consulter les sourcesParties du spécimen
Sélectionne un repère numéroté sur le schéma, ou utilise la liste ci-dessous, pour afficher son rôle. Le schéma montre l'état représentatif du concept.
Liste de pages
L’ensemble ordonné des destinations de page disponibles et des intervalles masqués.
Décision
Question de famille
Faut-il situer la page dans une hiérarchie, parcourir des pages de résultats ou montrer l’étape d’un processus ?
Trois critères pour choisir
- Cas d’usage
Pagination
Des résultats ou collections ont besoin de pages stables et partageables
Indicateur d’étapes
Un processus linéaire stable comporte au moins trois sections utiles
- Interactivité
Pagination
Utilise de vrais liens, expose la page actuelle et peut condenser les plages éloignées avec des ellipses non interactives.
Indicateur d’étapes
Communique surtout les étapes terminées, actuelle et à venir ; une étape n’est interactive que si la navigation est réellement permise.
- Rôle accessible
Pagination
nav[aria-label] > ul > li > a[aria-current=page]
Indicateur d’étapes
ol > li[aria-current=true] + heading
Neuf dimensions
- Déclenchement
Pagination
Activer un lien de page, Précédent ou Suivant charge une autre tranche du même ensemble de résultats.
Indicateur d’étapes
Le parcours environnant avance ou revient entre des étapes significatives du processus.
- Modalité
Pagination
Navigation non modale entre des emplacements de document ou des URL de résultats.
Indicateur d’étapes
Contexte de progression non modal pour une tâche en plusieurs étapes ; il ne bloque pas l’étape actuelle.
- Positionnement
Pagination
Près de la collection paginée, généralement après sa page actuelle de résultats.
Indicateur d’étapes
Près du titre du parcours, ordonné de la première à la dernière étape.
- Interactivité
Pagination
Utilise de vrais liens, expose la page actuelle et peut condenser les plages éloignées avec des ellipses non interactives.
Indicateur d’étapes
Communique surtout les étapes terminées, actuelle et à venir ; une étape n’est interactive que si la navigation est réellement permise.
- Focus
Pagination
La navigation native suit le navigateur ; une mise à jour sur place déplace le focus vers le titre des résultats ou annonce la nouvelle page de façon cohérente.
Indicateur d’étapes
Après un changement d’étape sur place, focaliser le nouveau titre ou utiliser un équivalent documenté ; ne jamais focaliser un segment décoratif.
- Fermeture
Pagination
La pagination est une navigation persistante et ne se ferme pas.
Indicateur d’étapes
L’indicateur est un contexte persistant du parcours et ne se ferme pas.
- Rôle accessible
Pagination
nav[aria-label] > ul > li > a[aria-current=page]
Indicateur d’étapes
ol > li[aria-current=true] + heading
- Cas d’usage
Pagination
Des résultats ou collections ont besoin de pages stables et partageables
Indicateur d’étapes
Un processus linéaire stable comporte au moins trois sections utiles
- Comportement mobile
Pagination
Prioriser Précédent et Suivant, garder des cibles confortables et réduire le nombre de pages visibles plutôt que leur taille.
Indicateur d’étapes
Conserver un titre concis « étape X sur Y » et masquer les libellés secondaires avant de rendre l’état illisible.
| Dimension | PaginationPagination | Indicateur d’étapesStepper |
|---|---|---|
| Déclenchement | Activer un lien de page, Précédent ou Suivant charge une autre tranche du même ensemble de résultats. | Le parcours environnant avance ou revient entre des étapes significatives du processus. |
| Modalité | Navigation non modale entre des emplacements de document ou des URL de résultats. | Contexte de progression non modal pour une tâche en plusieurs étapes ; il ne bloque pas l’étape actuelle. |
| Positionnement | Près de la collection paginée, généralement après sa page actuelle de résultats. | Près du titre du parcours, ordonné de la première à la dernière étape. |
| Interactivité | Utilise de vrais liens, expose la page actuelle et peut condenser les plages éloignées avec des ellipses non interactives. | Communique surtout les étapes terminées, actuelle et à venir ; une étape n’est interactive que si la navigation est réellement permise. |
| Focus | La navigation native suit le navigateur ; une mise à jour sur place déplace le focus vers le titre des résultats ou annonce la nouvelle page de façon cohérente. | Après un changement d’étape sur place, focaliser le nouveau titre ou utiliser un équivalent documenté ; ne jamais focaliser un segment décoratif. |
| Fermeture | La pagination est une navigation persistante et ne se ferme pas. | L’indicateur est un contexte persistant du parcours et ne se ferme pas. |
| Rôle accessible | nav[aria-label] > ul > li > a[aria-current=page] | ol > li[aria-current=true] + heading |
| Cas d’usage | Des résultats ou collections ont besoin de pages stables et partageables | Un processus linéaire stable comporte au moins trois sections utiles |
| Comportement mobile | Prioriser Précédent et Suivant, garder des cibles confortables et réduire le nombre de pages visibles plutôt que leur taille. | Conserver un titre concis « étape X sur Y » et masquer les libellés secondaires avant de rendre l’état illisible. |