web-dev-qa-db-fra.com

Existe-t-il des normes pour savoir quand utiliser du texte d'espace réservé par rapport aux info-bulles?

Pour aider un utilisateur à saisir des données dans un <input> champ, nous prévoyons de fournir des info-bulles et des espaces réservés. Je voulais comprendre les directives et les normes sur "quand" utiliser placeholder contre tooltips. Et en général, comment placeholder ou tooltip fournit-il une meilleure assistance que label et une sorte de help. Tous les exemples et explications seront utiles.

6
Arjun

Lorsque vous utilisez placeholder, l'élément d'information, l'aide ou l'exemple qu'il essaie de transmettre à l'utilisateur est masqué à partir du moment où un utilisateur tape quelque chose. Pour révéler les informations, l'utilisateur doit effacer le champ (par exemple, couper le texte dans le presse-papiers, à coller après la lecture). Je suis même tenté de dire que la plupart des utilisateurs ne seront pas en mesure de trouver un moyen de récupérer le texte de l'espace réservé, mais je n'en ai aucune preuve.

En ce sens, il est conseillé de préférer une info-bulle à placeholder car le texte de l'info-bulle peut être affiché à tout moment, sans avoir à modifier le texte déjà tapé. Cependant, une info-bulle nécessite une action explicite (survol de la souris, entrée focus) pour révéler son contenu alors qu'une étiquette est toujours visible.

Donc, il faut considérer les aspects de l'étiquette par rapport à l'infobulle; utilité, longueur, etc. À mon avis (pas si humble), utilisez placeholder avec parcimonie, et utilisez plutôt des étiquettes significatives. Si un champ nécessite une explication ou un exemple plus long, fournissez-lui une info-bulle.

5
Jawa

Le texte d'espace réservé est utile pour montrer un exemple unique du type d'entrée que vous souhaitez. Le meilleur exemple auquel je peux penser est celui des dates, car il existe de nombreuses façons d'exprimer la date. Votre texte d'espace réservé peut facilement afficher yyyy/mm/dd et donnez une indication sur le type d'entrée souhaité. Cependant, le texte de l'espace réservé disparaîtra à un moment donné, donc c'est OK pour un indice, mais pas d'instructions.

Les info-bulles ne sont pas aussi limitées par la taille et la forme que le texte d'espace réservé, et elles peuvent être utilisées pour des instructions ou des informations plus élaborées. Par exemple, où vous auriez pu avoir un exemple de mise en forme d'un horodatage comme indice, votre info-bulle peut dire: "Please enter a date in yyyy/mm/dd format. You can also enter N/A or leave the field blank." Vous devez fournir un indice à l'utilisateur afin qu'il sache où placer la souris pour afficher l'info-bulle ou au moins utiliser un emplacement standard.

Lorsque les info-bulles et les espaces réservés vous indiquent ce que vous êtes censé mettre dans une entrée, l'étiquette vous indique ce qu'est l'entrée. Est-ce une date de naissance? Une date de début? Date limite, etc? L'étiquette doit être courte et indiquer clairement ce que les données représentent.

Une note rapide sur les étiquettes par rapport aux espaces réservés - si vous ne pouvez pas penser à un espace réservé plus descriptif ou utile que l'étiquette, n'en utilisez pas. Il n'est pas utile d'étiqueter un champ "Prénom", puis de lui attribuer un espace réservé de "prénom". Une étiquette "Anniversaire" et un espace réservé de "aaaa/mm/jj" ont du sens, car l'espace réservé vous indique quelque chose de nouveau.

3
Surreal Dreams

Existe-t-il des normes? Non, mais il existe des bonnes pratiques * pour chacune en fonction de leurs propriétés intrinsèques. Je vais en énumérer quelques-unes qui me viennent à l'esprit. Deux bons, 1 mauvais.

Espaces réservés:

Sont bonnes lorsque l'espace est un problème car elles combinent des méta-informations sur l'entrée à l'intérieur de l'élément d'entrée lui-même.

Ajoutez une utilité supplémentaire lorsque le texte de l'espace réservé fait allusion à une structure d'entrée telle que (xxx) xxx-xxxx

Peut confondre les utilisateurs en leur faisant croire que le texte est déjà rempli.

Info-bulles

Ils sont également bons lorsque l'espace est un problème car ils prennent des méta-informations sur l'entrée en dehors de la structure du formulaire. Réduisant ainsi l'encombrement et préservant l'espace pour les éléments concernés.

Sont un bon choix pour fournir des informations supplémentaires sur l'entrée descriptive. Par exemple, "Numéro de téléphone: [] info-bulle:" Nous ne vous appellerons que si votre commande ne passe pas "

Ne fonctionne pas bien dans les environnements mobiles et peut distraire les utilisateurs de leur action prévue.

* Je laisse la meilleure solution à une tâche utilisateur l'emporter sur les "meilleures" pratiques. En fait, c'est comme ça qu'on en arrive.

J'espère que cela t'aides.

1
Itumac