Search Field
Champ de recherche
Un champ de recherche est une zone de texte pour trouver du contenu qui correspond aux mots tapés.
Un vrai exemple
La recherche de projet accepte une partie d'un nom et montre les recherches récentes. Un bouton efface le texte.
Parties principales
- 01Étiquette persistante
- 02Input control
- 03Hint or format
- 04Validation message
Utilisez-le lorsque
Utilisez-le lorsque qu'une collection est trop grande pour être parcourue ou atteinte rapidement via la navigation.
Ne l'utilisez pas lorsque
Ne promettez jamais une correspondance exacte lorsque les résultats sont classés par pertinence ou peuvent être incomplets.
Nom utilisé dans le code
<input type="search"> Avant d'expédier
Give each field a label that code can read. Link hints and errors, and keep entered values. Check autofill, keyboard order, validation timing, submit states, failure recovery, zoom, and languages.
Outcome: Complete the task with Champ de recherche (Search Field). User context: La recherche de projet accepte une partie d'un nom et montre les recherches récentes. Un bouton efface le texte. Recommended pattern: Champ de recherche (Search Field). Why it fits: Utilisez-le lorsque qu'une collection est trop grande pour être parcourue ou atteinte rapidement via la navigation. Do not use it when: Ne promettez jamais une correspondance exacte lorsque les résultats sont classés par pertinence ou peuvent être incomplets. 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): La norme couvre uniquement le champ d'application énuméré. Elle ne choisit ni le style visuel, ni la décision de produit, ni l'exemple de Vibulary. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Vérifiez cette demande
Review how Champ de recherche (Search Field) is used now. Definition: Un champ de recherche est une zone de texte pour trouver du contenu qui correspond aux mots tapés. Release checks: Give each field a label that code can read. Link hints and errors, and keep entered values. Check autofill, keyboard order, validation timing, submit states, failure recovery, zoom, and languages. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.