Comparaison comportementale
Barre de progression vs Indicateur d'attente
Différence décisive
La Barre de progression est une barre d’avancement de la tâche et peut rester indéterminée ; l’Indicateur d’attente est un indicateur occupé compact qui signale seulement qu’un travail est en cours.
Critères de choix, liens et sources
- Barre de progressionChoisis Barre de progression si tu connais une valeur fiable, comme des octets envoyés ou des étapes terminées.Ouvrir la fiche Barre de progression
- Indicateur d'attenteChoisis Indicateur d’attente si l’opération est courte et sans valeur d’avancement utile.Ouvrir la fiche Indicateur d'attente
Voir les neuf dimensionsVoir les sources
Attendre et suivre une progression
Essayer
La durée est-elle inconnue, mesurable ou faut-il préserver la forme du contenu ?
Barre de progression
Contexte commun aux essais
Un espace de travail attend la fin d'un contenu ou d'une opération et ne communique que la progression qu'il peut mesurer honnêtement.
Barre de progression
Mission
Barre de progression - Progress bar
Lancer l'envoi, observer une valeur intermédiaire, annuler, relancer et atteindre l'état terminé.
É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
- L'élément de progression étiqueté expose les octets et le pourcentage pendant le transfert.
- Cas limite
- Si le serveur ne fournit plus de valeurs fiables, l'interface passe honnêtement à un état indéterminé au lieu d'inventer l'avancement.
Indicateur d'attente
Mission
Indicateur d'attente - Spinner
Lance l’enregistrement, vérifie qu’une double activation est bloquée, lis l’état d’attente et attends l’état final.
É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
- Le bouton expose Enregistrement, empêche une double requête et montre un indicateur animé redondant.
- Cas limite
- Après un seuil long, l'interface ajoute une explication et une action annuler ou réessayer au lieu de tourner sans fin.
Ce que cet essai montre
Progress bar représente l’avancement d’une tâche et expose une valeur mesurée si elle existe ; Spinner est un indicateur d’attente compact, tandis que Skeleton représente la mise en page finale.
Lequel convient à ton besoin ?
Barre de progression
Envoyer un fichier avec un avancement fiable en octets
Indicateur d'attente
Une courte opération n'a pas de valeur d'avancement utile
Différence et sources
Progress bar représente l’avancement d’une tâche et expose une valeur mesurée si elle existe ; Spinner est un indicateur d’attente compact, tandis que Skeleton représente la mise en page finale.
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.
Libellé
Le texte persistant qui nomme un contrôle ou un champ.
Décision
Question de famille
La durée est-elle inconnue, mesurable ou faut-il préserver la forme du contenu ?
Trois critères pour choisir
- Cas d’usage
Barre de progression
Envoyer un fichier avec un avancement fiable en octets
Indicateur d'attente
Une courte opération n'a pas de valeur d'avancement utile
- Interactivité
Barre de progression
Généralement en lecture seule ; sa valeur et son libellé évoluent avec l’avancement mesurable.
Indicateur d'attente
Non interactif ; un état accessible indique que le traitement est toujours en cours.
- Rôle accessible
Barre de progression
progress
Indicateur d'attente
status + [aria-busy=true]
Neuf dimensions
- Déclenchement
Barre de progression
Une tâche mesurable commence et indique l’avancement par rapport au total.
Indicateur d'attente
Une opération dont la durée restante est inconnue commence.
- Modalité
Barre de progression
État de progression non modal ; le blocage appartient à la tâche environnante, pas à la barre.
Indicateur d'attente
Indicateur d’état non modal, sauf si le parcours environnant bloque lui-même l’interaction.
- Positionnement
Barre de progression
À côté de la tâche, du fichier ou de l’étape dont elle représente la progression.
Indicateur d'attente
Près de la région ou du contrôle concerné, sans remplacer le contenu sans rapport.
- Interactivité
Barre de progression
Généralement en lecture seule ; sa valeur et son libellé évoluent avec l’avancement mesurable.
Indicateur d'attente
Non interactif ; un état accessible indique que le traitement est toujours en cours.
- Focus
Barre de progression
L'indicateur ne reçoit pas le focus ; celui-ci reste sur les contrôles de l'opération ou la tâche actuelle.
Indicateur d'attente
Le focus reste sur le contrôle initiateur sauf si une transition documentée remplace toute la vue.
- Fermeture
Barre de progression
Il se termine seulement après réussite, échec ou annulation explicite et est remplacé par l'état final correspondant.
Indicateur d'attente
L'indicateur s'arrête lorsque le travail se termine ou est annulé ; il n'est jamais un message à fermer manuellement.
- Rôle accessible
Barre de progression
progress
Indicateur d'attente
status + [aria-busy=true]
- Cas d’usage
Barre de progression
Envoyer un fichier avec un avancement fiable en octets
Indicateur d'attente
Une courte opération n'a pas de valeur d'avancement utile
- Comportement mobile
Barre de progression
Utiliser la largeur disponible et garder le libellé ou la valeur lisible sans minuscule superposition.
Indicateur d'attente
Réserver un espace stable et accompagner l’indicateur d’un bref état textuel lorsque l’attente est perceptible.
| Dimension | Barre de progressionProgress bar | Indicateur d'attenteSpinner |
|---|---|---|
| Déclenchement | Une tâche mesurable commence et indique l’avancement par rapport au total. | Une opération dont la durée restante est inconnue commence. |
| Modalité | État de progression non modal ; le blocage appartient à la tâche environnante, pas à la barre. | Indicateur d’état non modal, sauf si le parcours environnant bloque lui-même l’interaction. |
| Positionnement | À côté de la tâche, du fichier ou de l’étape dont elle représente la progression. | Près de la région ou du contrôle concerné, sans remplacer le contenu sans rapport. |
| Interactivité | Généralement en lecture seule ; sa valeur et son libellé évoluent avec l’avancement mesurable. | Non interactif ; un état accessible indique que le traitement est toujours en cours. |
| Focus | L'indicateur ne reçoit pas le focus ; celui-ci reste sur les contrôles de l'opération ou la tâche actuelle. | Le focus reste sur le contrôle initiateur sauf si une transition documentée remplace toute la vue. |
| Fermeture | Il se termine seulement après réussite, échec ou annulation explicite et est remplacé par l'état final correspondant. | L'indicateur s'arrête lorsque le travail se termine ou est annulé ; il n'est jamais un message à fermer manuellement. |
| Rôle accessible | progress | status + [aria-busy=true] |
| Cas d’usage | Envoyer un fichier avec un avancement fiable en octets | Une courte opération n'a pas de valeur d'avancement utile |
| Comportement mobile | Utiliser la largeur disponible et garder le libellé ou la valeur lisible sans minuscule superposition. | Réserver un espace stable et accompagner l’indicateur d’un bref état textuel lorsque l’attente est perceptible. |