web-dev-qa-db-fra.com

Habillage des étiquettes dans la saisie de données

J'ai une question de style concernant l'emballage des étiquettes. Pour une application de bureau expert de domaine que nous faisons, nous utilisons des étiquettes alignées à droite et des champs alignés à gauche. De temps en temps, nous obtenons une situation où l'étiquette est très longue (comme un terme commercial complexe ou une question).

enter image description here

À ce stade, la seule solution que je peux voir est de simplement conclure la question.

enter image description here

Est-ce la meilleure option? Je ne prévois pas de passer aux étiquettes alignées en haut, car presque toutes les données correspondent bien à l'étiquette et au champ se trouvant sur la même ligne. Et aussi, c'est uniquement sur le bureau.

2
shobaldur

Si l'alignement à gauche des étiquettes est la seule option, c'est une question de numérisation. Dans quelle mesure (le cas échéant) la conception interfère-t-elle avec la lecture et la réponse des utilisateurs aux questions?.

Je trouve que la première option, avec l'étiquette sur une seule ligne, est choquante. Mais je ne compte pas.

C'est une chose très simple à tester. Créez deux versions du formulaire et demandez aux gens. Ce n'est pas nécessairement un test formel. Les pages pouvaient être imprimées. Allez aux gens d'affaires; réceptionnistes, etc ... et demandez lequel de ces deux est-il le plus facile à lire?

Ce n'est qu'après que les répondants ont donné leur avis qu'ils indiquent que l'un a le texte encapsulé et l'autre sur une seule ligne (s'ils ne l'ont pas remarqué et l'ont signalé au préalable).

2
Mayo

vous pouvez peut-être augmenter les champs de saisie, pour contenir deux lignes de texte. Comme je peux comprendre, il ne devrait pas y en avoir beaucoup, donc limiter à deux lignes pourrait être une option. Essayez également de faire tous les champs de la même largeur, pour contrebalancer le trouble sur le côté gauche (longueur des étiquettes de texte, plusieurs lignes).

higher input fields

1
Harun Alikadić

Ce n'est qu'une suggestion, car elle ne concerne que le Web. voir la disposition ci-dessous.

enter image description here

(utilisé Adobe XD)

0
NPN