Afficher l'infobulle immédiatement ou seulement après un clic sur le "i"
J'ai un formulaire de demande de prêt. Tous les champs sont obligatoires et la plupart d'entre eux ont reçu une info-bulle de description. Je me bats quand il s'agit de montrer les info-bulles. Les masquer jusqu'à ce qu'un utilisateur clique sur une icône "i" derrière le champ ou afficher l'info-bulle sur le focus?
Nous avons fait un test mais le résultat était indécis 10:10 donc il n'y a pas de résultat clair.
p.s. excusez mes mauvaises compétences de prononciation et de grammaire;)
Lorsque vous avez testé cela, comment la question a-t-elle été formulée?
Était-ce:
"Pouvez-vous remplir ce formulaire? Lequel avez-vous préféré?"
Ou était-ce:
"Quelle méthode pour appeler l'infobulle préférez-vous?"
S'il s'agit de ce dernier, alors vous avez peut-être influencé par inadvertance le résultat en faveur d'un clic sur le "i", car la question elle-même explique à l'utilisateur ce que fait le fait de cliquer sur "i", alors que dans la vie réelle, tous les utilisateurs ne sauraient pas ce que cela signifie. est.
Je pense que les tests A/B seraient bénéfiques, vous pouvez donc utiliser des mesures plus objectives (c'est-à-dire le temps nécessaire pour terminer, l'exactitude, l'abandon), plutôt que les commentaires verbaux des utilisateurs.
Après tout, l'action de l'utilisateur parle plus fort que les mots :)
Alors que (comme @inkmarble l'a mentionné), le clic peut être plus difficile que le survol d'une souris, nous devons également garder à l'esprit le nombre croissant d'utilisateurs sur les appareils tactiles. Avec l'état actuel de la technique, il est tout simplement impossible de passer la souris sur une icône sur un appareil tactile, rendant ainsi ces informations d'aide inaccessibles à ce groupe d'utilisateurs.
Exemple: J'ai récemment été très frustré par Facebook parce que je ne pouvais pas trouver cette option d'édition dont je savais qu'elle existait parce que je l'avais déjà utilisée. Ce n'est qu'après un certain temps que je me suis demandé si c'était une de ces petites icônes grises qui n'apparaissent que lorsque vous survolez l'entrée de texte - et c'était le cas. Mon appareil est un cabriolet, je pouvais donc changer de mode. Sinon, je n'aurais pas du tout pu modifier mon texte.
Une autre page Web a résolu le problème différemment: ils ont simplement fait les deux. Le texte d'aide est apparu en survolant celui-ci, mais aussi en cliquant. Cela convenait aux appareils tactiles ainsi qu'aux utilisateurs de souris qui voudraient que le texte reste visible même en s'éloignant. En même temps, cela n'a pas nui aux utilisateurs de souris "normaux". Donc, globalement: si cela est techniquement faisable, je donnerais aussi une chance à l'approche hybride.
Une info-bulle est généralement une courte phrase descriptive - j'ai vu des suggestions selon lesquelles elles devraient être "5 ou 6 mots" ou "1-2 lignes courtes". Ils étaient à l'origine conçus comme un rappel utile pour un bouton ou un champ, destiné à un utilisateur qui connaissait les détails mais avait besoin du rappel.
Les informations d'aide que vous affichez semblent être beaucoup plus substantielles, peut-être destinées aux utilisateurs occasionnels ou débutants.
Je suggère d'utiliser une approche hybride:
- Au survol de la souris, affichez une info-bulle conventionnelle, y compris "(cliquez pour en savoir plus)" (localisé, bien sûr) à la fin
- Si/Lorsque l'utilisateur clique, affichez le plus gros texte d'aide avec des informations supplémentaires.
Je crois que les candidats à un prêt qui viennent combler un poste auront des connaissances ou pourront être novices. Dans les deux cas, l'icône "i" est utile, donc au survol de la souris, la boîte de description peut apparaître sur la page. Cliquer est un effort qui est plus qu'un survol de la souris.
Une autre façon est que toutes les informations peuvent être alignées sur le RHS du formulaire - avec des numéros attribués à l'emplacement - tels que les utilisateurs n'ont même pas besoin de survoler l'icône d'informations "i" avec la souris, mais peuvent être facilement assis là. Si les informations sont trop longues, l'icône "i" peut rester et les informations peuvent apparaître dans la colonne RHS sans perturber le formulaire.
@inkmarble est correct. l'étiquette doit être alignée à droite.
La position du code "EUR" peut être modifiée. Il semble aligné à gauche à droite dans l'élément unique.
Le premier champ par défaut doit être ciblé. Nous pouvons donc afficher le texte d'aide à proximité du champ de texte lorsque nous concentrons ce champ. Cela devrait être logique, l'utilisateur peut lire tout en entrant dans ce champ.
Veuillez revoir la largeur des champs de texte. (Chiffres max pour le montant)
REMARQUE: Si nous passons la souris sur "i", l'utilisateur doit trouver le texte d'aide lors de la saisie des données.