web-dev-qa-db-fra.com

Espaces réservés avec le même texte que l'étiquette - bonne pratique?

J'ai un formulaire tel que le suivant, dans lequel les espaces réservés ont le même texte exact que leurs étiquettes correspondantes:

enter image description here

L'alternative étant de laisser chaque entrée sans espace réservé. Je ne discute pas des étiquettes par rapport aux espaces réservés. Les étiquettes resteront malgré tout!

Il me semble que ces espaces réservés apparemment redondants sont en fait utiles, dans une certaine mesure et pour certaines personnes. Cela peut empêcher l'utilisateur de regarder à gauche pour se souvenir de l'entrée qu'il remplissait (probablement sous de longues formes)

Je ne vois aucun mal à les mettre car l'impact visuel est très faible.

Existe-t-il une pratique établie pour savoir si les espaces réservés redondants sont utiles/nuisibles?

25
vemv

En règle générale, je trouve préférable d'utiliser le texte de l'espace réservé comme exemple du contenu souhaité. Ainsi, l'étiquette décrit le champ, et l'espace réservé illustre le type du contenu.

Voici un bon exemple, tiré de cet article: http://www.pardot.com/faqs/forms/placeholders-and-labels/

placeholder text in field

29
Caleb Sylvest

Inutile de répéter deux fois la même information. Utilisez un texte d'espace réservé pour aider les utilisateurs à comprendre comment les données doivent être saisies.

Par exemple, afficher le format du numéro de téléphone. Un autre exemple est quand il y a plusieurs lignes pour l'adresse, les repères peuvent être des espaces réservés.

Les recherches effectuées par N/n ont révélé que certains utilisateurs confondent l'espace réservé comme champ déjà rempli, mais je pense que, compte tenu de leur adoption généralisée grâce aux petits écrans, il est très probable que ce problème ne soit pas aussi commun qu'avant.

Pas de mal à avoir des champs avec des espaces réservés significatifs et d'autres vides. Au moins, les utilisateurs n'apprendront pas à ignorer la redondance.

4
Rajmera

J'ai vu un article du Nielsen Norman Group disant que les espaces réservés dans les champs de formulaire sont nuisibles http://www.nngroup.com/articles/form-design-placeholders/

Cependant, ils semblent avoir analysé les espaces réservés qui remplacent les étiquettes ou fournissent des informations supplémentaires. Ce n'est pas le cas dans votre exemple.

Comme vous le dites, mon sentiment personnel est que ces espaces réservés redondants peuvent être beaux et utiles. Si vous souhaitez ajouter de la variété, vous pouvez préfixer "Votre" au texte dans les espaces réservés; par exemple.:

Courriel: [votre adresse courriel]

Nom: [Votre nom]

3
firasd

Non, cela ne semble pas être une bonne pratique.

Dans l'article de Nielsen Norman Group, " Les espaces réservés dans les champs de formulaire sont nuisibles ", dans la liste des sept raisons pour lesquelles les espaces réservés ne doivent pas être utilisés, les dernières expliquent non seulement pourquoi vous avez besoin d'étiquettes, mais pourquoi est mauvais d'avoir des entrées non vides:

  1. Les champs contenant des éléments sont moins visibles. Les études d'eyeracking montrent que les yeux des utilisateurs sont attirés par les champs vides. Au minimum, les utilisateurs passeront plus de temps à localiser un champ non vide - une nuisance. Au pire, ils négligeront complètement le domaine - une catastrophe potentiellement destructrice pour les entreprises.
  2. Les utilisateurs peuvent confondre un espace réservé avec des données qui ont été automatiquement remplies. Lorsqu'il y a déjà du texte dans le champ, les gens sont moins susceptibles de réaliser qu'ils peuvent y taper. Certains utilisateurs supposent que le texte de l'espace réservé est une valeur par défaut et ignorent complètement le champ.

Texte d'espace réservé en plus des étiquettes

L'utilisation de texte d'espace réservé en combinaison avec des étiquettes de formulaire est un pas dans la bonne direction. (...) Cependant, même lorsque vous utilisez des étiquettes, le fait de placer des conseils ou des instructions importants dans un champ de formulaire peut toujours causer les 7 problèmes mentionnés ci-dessus, bien qu'avec moins de gravité.

D'un autre côté, j'ai vu qu'une bonne solution pour le texte d'espace réservé est considérée par certains concepteurs comme une étiquette flottante. Le texte d'espace réservé est en fait l'étiquette affichée par défaut, mais une fois qu'un champ de saisie est tapé et que le texte est entré, le texte d'espace réservé s'estompe et une étiquette alignée en haut s'anime.

Dans cet article, " Float Label Pattern ", Brad Frost a quelques bons arguments pour/contre:

Le motif d'étiquette flottante

Float Label Pros

L'utilisateur conserve le contexte - Le principal avantage de ce modèle est que l'utilisateur conserve le contexte du champ après s'être concentré et entré une valeur. Cela permet une expérience plus accessible et moins frustrante.

Nettoyer et numériser par défaut - Ce modèle permet une expérience d'étiquette en ligne propre par défaut, et ne devient un peu plus encombré qu'une fois que l'utilisateur a rempli les choses.

Elegent – ​​Il faut le dire: ce motif est sexy. Vous ne pouvez généralement pas dire cela à propos des formulaires. Il a l'air bien et les animations sont une belle touche subtile.

Float Label Cons

N'accorde toujours pas de place à la fois à l'étiquette et à l'espace réservé - Étant donné que l'étiquette occupe le même espace que l'espace réservé, il n'y a pas de place pour des indications supplémentaires.

Petite étiquette - L'étiquette devient petite et peut-être difficile à lire, mais en même temps ce n'est pas si grave. Une fois que l'utilisateur a interagi avec l'entrée, l'étiquette devient une référence plutôt qu'une instruction. Potentiel d'abus de code - Sur la base des quelques démos que j'ai vues, il y a la possibilité de détruire l'accessibilité et la sémantique.

2
Madalina Taina

Vous pouvez préfixer les espaces réservés avec "Entrez votre".

De cette façon, ils

  • se démarquer davantage comme un espace réservé par opposition au contenu
  • donner un peu plus d'informations sur ce que l'utilisateur doit faire, par exemple l'action de saisir du texte
  • et cela signifie également que vous pouvez ajouter cette invite supplémentaire sans encombrer votre étiquette
2
Dave Haigh

semble redondant pour le faire ... pourquoi ne pas se débarrasser des espaces réservés ou si vous devez ensuite essayer quelque chose comme

  • EMAIL: votre meilleur email
  • NOM: premier, dernier

de cette façon, vous pouvez vous débarrasser du nom de famille tous ensemble

0
Stanley VM