web-dev-qa-db-fra.com

Aligner le texte à gauche ou à droite À côté de textBox?

J'ai un Label et un Textbox à côté. J'essaie de savoir quelle disposition est la meilleure pour la convivialité?

Étiquettes alignées à droite

Right-aligned labels

Étiquettes d'alignement à gauche

Left-aligned labels

15
Mike Darwish

Ça dépend.

LukeW a couvert cela dans son livre Web Form Design . Ce n'est pas un nouveau livre, mais couvre la plupart des problèmes de formulaires Web courants.

Chacun a un avantage/inconvénient:

Aligné à droite:

Les alignements à droite sont un peu plus lents à terminer mais nécessitent moins d'espace vertical sur l'écran. Cependant, ils ont des problèmes de flexibilité lorsque les étiquettes changent de largeur. Lors de la localisation d'applications, il est important de noter que des langues comme l'allemand ou le français peuvent être deux fois plus longues que l'anglais. Les étiquettes alignées à droite ne fonctionnent pas non plus correctement lorsque les utilisateurs doivent numériser un ensemble d'étiquettes pour voir ce qui est requis car un texte de chiffon gauche nuit à la lisibilité.

enter image description here

Aligné à gauche:

Les formes alignées à gauche sont les plus lentes à remplir en raison du nombre de fixations oculaires dont elles ont besoin pour analyser. Cependant, pour les formulaires contenant de nombreux champs facultatifs ou des données inconnues (comme les boîtes de dialogue des préférences ou les paramètres avancés), ils permettent aux utilisateurs de numériser efficacement les étiquettes. En fait, si vous voulez que les utilisateurs ralentissent et considèrent chaque entrée dans un formulaire plus attentivement, les étiquettes alignées à gauche sont une bonne solution.

enter image description here

Et aligné en haut: (avez-vous envisagé cette option?)

Les étiquettes alignées sur le dessus tendent à réduire le plus souvent les délais de traitement (combien de temps il faut pour remplir un formulaire) pour les données familières (adresse, carte de crédit, etc.) car elles ne nécessitent qu'une seule fixation oculaire pour prendre à la fois l'étiquette et le champ de saisie . Les étiquettes alignées en haut fonctionnent également bien pour les formulaires qui nécessitent une localisation ou des étiquettes longues, car il existe de nombreux espaces horizontaux pour étendre/contracter l'étiquette sans impact négatif sur la mise en page globale. Cependant, les étiquettes alignées en haut occupent beaucoup de biens immobiliers verticaux.

enter image description here

Nielsen Norman Group a une préférence vers étiquettes alignées en haut

Nous vous recommandons de placer des étiquettes de champ au-dessus des champs de texte correspondants. Bien que cela augmente la longueur totale du formulaire, il facilite la numérisation du formulaire, car les utilisateurs peuvent voir le champ de texte dans la même fixation que l'étiquette. Le placement supérieur permet également des étiquettes de champ plus longues, car l'espace horizontal n'est pas un problème.

25
Mike M

Ou vous pouvez mettre l'étiquette au-dessus de l'entrée.

Pourquoi?

  • proximité, il est donc plus facile d'associer étiquette/entrée.
  • traitement plus rapide
  • améliore la lisibilité

Le seul inconvénient serait que vous obtiendrez des formulaires un peu plus longs, mais tout le monde défile. http://www.hugeinc.com/ideas/perspective/everybody-scrolls

1
robert