Comparaison comportementale
Fil d’Ariane vs Pagination
Différence décisive
Le Fil d’Ariane remonte une hiérarchie de pages parentes ; la Pagination se déplace latéralement entre des tranches sœurs d’une même collection.
Critères de choix, liens et sources
- Fil d’ArianeChoisis Fil d’Ariane si la page courante a des parents vers lesquels l’utilisateur peut vouloir revenir.Ouvrir la fiche Fil d’Ariane
- PaginationChoisis Pagination si une longue liste ou un ensemble de résultats est découpé en pages stables et partageables.Ouvrir la fiche Pagination
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 ?
Fil d’Ariane
Contexte commun aux essais
Fil d’Ariane
Mission
Fil d’Ariane
Focalise l’ancêtre Réglages, active-le et vérifie que sa destination remplace l’emplacement actuel Facturation.
É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
- Facturation, l’emplacement actuel, est exposé séparément des liens ancêtres.
- Cas limite
- Les longs libellés traduits reviennent à la ligne ou se condensent sans transformer les séparateurs en contrôles ni perdre les noms accessibles.
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é.
Ce que cet essai montre
Le fil d’Ariane expose l’ascendance de la page courante ; la pagination parcourt des pages sœurs découpées par quantité, tandis que l’indicateur d’étapes suit des étapes métier.
Lequel convient à ton besoin ?
Fil d’Ariane
Les pages appartiennent à une hiérarchie de plusieurs niveaux
Pagination
Des résultats ou collections ont besoin de pages stables et partageables
Différence et sources
Le fil d’Ariane expose l’ascendance de la page courante ; la pagination parcourt des pages sœurs découpées par quantité, tandis que l’indicateur d’étapes suit 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.
Fil
La séquence ordonnée qui communique la hiérarchie environnante.
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
Fil d’Ariane
Les pages appartiennent à une hiérarchie de plusieurs niveaux
Pagination
Des résultats ou collections ont besoin de pages stables et partageables
- Interactivité
Fil d’Ariane
Les ancêtres sont des liens ; la page actuelle est identifiée et généralement en texte simple.
Pagination
Utilise de vrais liens, expose la page actuelle et peut condenser les plages éloignées avec des ellipses non interactives.
- Rôle accessible
Fil d’Ariane
nav[aria-label] > ol > li > a[aria-current=page]
Pagination
nav[aria-label] > ul > li > a[aria-current=page]
Neuf dimensions
- Déclenchement
Fil d’Ariane
Activer le lien nommé d’un ancêtre remonte dans la hiérarchie actuelle.
Pagination
Activer un lien de page, Précédent ou Suivant charge une autre tranche du même ensemble de résultats.
- Modalité
Fil d’Ariane
Navigation non modale ; la page actuelle reste entièrement disponible.
Pagination
Navigation non modale entre des emplacements de document ou des URL de résultats.
- Positionnement
Fil d’Ariane
Un fil compact avant le titre principal, ordonné de la racine à la page actuelle.
Pagination
Près de la collection paginée, généralement après sa page actuelle de résultats.
- Interactivité
Fil d’Ariane
Les ancêtres sont des liens ; la page actuelle est identifiée et généralement en texte simple.
Pagination
Utilise de vrais liens, expose la page actuelle et peut condenser les plages éloignées avec des ellipses non interactives.
- Focus
Fil d’Ariane
Le focus visible reste sur chaque lien ancêtre jusqu’à la navigation ; la page actuelle en texte simple n’ajoute pas d’arrêt Tab.
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.
- Fermeture
Fil d’Ariane
Le fil d’Ariane est une navigation persistante et ne se ferme pas.
Pagination
La pagination est une navigation persistante et ne se ferme pas.
- Rôle accessible
Fil d’Ariane
nav[aria-label] > ol > li > a[aria-current=page]
Pagination
nav[aria-label] > ul > li > a[aria-current=page]
- Cas d’usage
Fil d’Ariane
Les pages appartiennent à une hiérarchie de plusieurs niveaux
Pagination
Des résultats ou collections ont besoin de pages stables et partageables
- Comportement mobile
Fil d’Ariane
Conserver la position actuelle et l’ancêtre le plus proche sans faire dépendre la hiérarchie essentielle d’un défilement horizontal.
Pagination
Prioriser Précédent et Suivant, garder des cibles confortables et réduire le nombre de pages visibles plutôt que leur taille.
| Dimension | Fil d’ArianeBreadcrumbs | PaginationPagination |
|---|---|---|
| Déclenchement | Activer le lien nommé d’un ancêtre remonte dans la hiérarchie actuelle. | Activer un lien de page, Précédent ou Suivant charge une autre tranche du même ensemble de résultats. |
| Modalité | Navigation non modale ; la page actuelle reste entièrement disponible. | Navigation non modale entre des emplacements de document ou des URL de résultats. |
| Positionnement | Un fil compact avant le titre principal, ordonné de la racine à la page actuelle. | Près de la collection paginée, généralement après sa page actuelle de résultats. |
| Interactivité | Les ancêtres sont des liens ; la page actuelle est identifiée et généralement en texte simple. | Utilise de vrais liens, expose la page actuelle et peut condenser les plages éloignées avec des ellipses non interactives. |
| Focus | Le focus visible reste sur chaque lien ancêtre jusqu’à la navigation ; la page actuelle en texte simple n’ajoute pas d’arrêt Tab. | 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. |
| Fermeture | Le fil d’Ariane est une navigation persistante et ne se ferme pas. | La pagination est une navigation persistante et ne se ferme pas. |
| Rôle accessible | nav[aria-label] > ol > li > a[aria-current=page] | nav[aria-label] > ul > li > a[aria-current=page] |
| Cas d’usage | Les pages appartiennent à une hiérarchie de plusieurs niveaux | Des résultats ou collections ont besoin de pages stables et partageables |
| Comportement mobile | Conserver la position actuelle et l’ancêtre le plus proche sans faire dépendre la hiérarchie essentielle d’un défilement horizontal. | Prioriser Précédent et Suivant, garder des cibles confortables et réduire le nombre de pages visibles plutôt que leur taille. |