Progress Indicator
Indicateur de progression
Un indicateur de progression montre que le travail continue. Une barre ou un anneau montre une progression connue. Un spinner veut dire que le temps d'attente est inconnu.
Un vrai exemple
Un envoi de 400 Mo affiche 62 % et le temps restant. Une recherche rapide dont on ne connaît pas la durée utilise un petit indicateur d'attente.
Parties principales
- 01State signal
- 02Human-readable message
- 03Timing or progress
- 04Recovery path
Utilisez-le lorsque
Utilisez une barre avec un point final chaque fois que vous pouvez mesurer le travail.
Ne l'utilisez pas lorsque
Ne jamais afficher un spinner infini sans explication, sans moyen d'annuler, et sans état d'échec.
Nom utilisé dans le code
<progress> / aria-busy Avant d'expédier
Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states.
Outcome: Complete the task with Indicateur de progression (Progress Indicator). User context: Un envoi de 400 Mo affiche 62 % et le temps restant. Une recherche rapide dont on ne connaît pas la durée utilise un petit indicateur d'attente. Recommended pattern: Indicateur de progression (Progress Indicator). Why it fits: Utilisez une barre avec un point final chaque fois que vous pouvez mesurer le travail. Do not use it when: Ne jamais afficher un spinner infini sans explication, sans moyen d'annuler, et sans état d'échec. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): Aucun standard officiel unique ne régit l’ensemble du terme. Sa signification peut varier selon les équipes, plateformes ou frameworks. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Vérifiez cette demande
Review how Indicateur de progression (Progress Indicator) is used now. Definition: Un indicateur de progression montre que le travail continue. Une barre ou un anneau montre une progression connue. Un spinner veut dire que le temps d'attente est inconnu. Release checks: Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.