web-dev-qa-db-fra.com

Masquer ou désactiver les options de formulaire?

Duplicata possible:
Ne pas masquer ou désactiver les éléments de menu?

Sur un formulaire de création/modification, où les options disponibles pour l'utilisateur final dépendront de leur saisie précédente, afin de donner à l'utilisateur quelques guides sur la façon de remplir les données, nous devons:

  • Désactivez les contrôles et activez-les uniquement lorsque les conditions préalables sont remplies.
  • Cachez-les à la place
  • Ne fais rien
  • Autres options

Exemple: lorsque vous demandez qui est le représentant légal de quelqu'un, le formulaire contiendra une zone de liste déroulante avec les options suivantes: la propre personne, ses parents ou quelqu'un d'autre. Seulement dans le cas où l'utilisateur choisit quelqu'un d'autre, il devait remplir une zone de texte indiquant qui.

Quelle option offrira la meilleure expérience utilisateur?

24
dcarneiro

Privilégiez généralement les champs cachés aux champs désactivés

Champs désactivés donne à l'utilisateur une réflexion supplémentaire sur la raison pour laquelle il n'est pas disponible. Selon Steve Krug " Don't make me think " vous devez supprimer les éléments qui font réfléchir l'utilisateur et dont ils n'ont pas besoin de toute façon. (Il serait préférable d'accorder cette attention au champ/paramètre qui rendrait le handicapé disponible.)

De plus, champs cachés peut également être utilisé dans d'autres cas. Par exemple, lorsque les champs sont facultatifs et que vous ne voulez pas que l'utilisateur soit distrait alors qu'il n'en a pas besoin. Les champs masqués peuvent être utilisés pour plus de cas et peuvent donc être appris par les utilisateurs comme comportement par défaut pour tous les types de champs; ils sont cachés jusqu'à ce qu'ils soient demandés/nécessaires.

Quand utiliser désactivé

Cela dit, je peux imaginer quelques instants lorsque les champs désactivés sont utilisables:

  • beaucoup de ces champs: masquer et afficher constamment des champs peuvent distraire car la vue change constamment. Il peut alors être préférable d'afficher les champs désactivés par défaut.
  • partie désactivée d'une phrase: comme le champ d'adresse e-mail dans le [x] Notify [email address] daily of any new answers sur SE lorsque vous posez une question
  • jeux/découverte: quand vous voulez que l'utilisateur joue et découvre quand certains champs deviennent disponibles.

Manipuler avec soin

Il est bon de toujours indiquer très clairement ce qui active un champ désactivé. Ainsi, les utilisateurs ont au moins une idée claire de ce qu'ils doivent faire s'ils pensent avoir besoin/vouloir le champ désactivé.

Lorsque vous utilisez des champs masqués ou désactivés, assurez-vous de respecter l'ordre de lecture; placez l'action pour afficher/activer plus haut dans le flux. Donc, la sélection legal representative est ci-dessus le representative name. Sinon, vous montrez/activez quelque chose plus haut où les gens ne regardent plus et ils ne sauront jamais qu'ils ont activé un autre champ.

N'oubliez pas non plus que les personnes dont javascript est désactivé ne peuvent pas modifier les champs masqués ou désactivés sans actualiser complètement la page. Assurez-vous qu'ils peuvent également utiliser votre formulaire, par exemple en utilisant suffisamment d'explications visuelles et textuelles.

22
Lode

Un contrôle désactivé indique à l'utilisateur:

  • L'entrée est possible.

  • Mais pas maintenant.

  • Mais l'utilisateur peut le rendre possible.

Cela décrit à peu près votre exemple où le simple fait de modifier une option adjacente rend possible la saisie. Il est préférable d'utiliser la désactivation plutôt que de masquer, car cela permet à l'utilisateur d'anticiper ce qui est nécessaire pour certaines options. Chaque fois que la désactivation est utilisée, vous devez indiquer clairement ce qui active spécifiquement le contrôle. Dans votre exemple, il suffit probablement d'utiliser des boutons radio pour que la zone de texte se trouve juste à côté de l'option Quelqu'un d'autre. Pire, utilisez une étiquette de texte ou une info-bulle pour indiquer comment activer le contrôle. Pour les commandes (éléments de menu et boutons de commande), il peut même être préférable de laisser le contrôle activé et d'afficher un message d'erreur expliquant ce qui doit être fait en premier, bien que cela ne devrait être fait qu'en dernier recours.

À moins qu'il n'y ait une action simple que l'utilisateur puisse faire pour accéder au contrôle (par exemple, en sélectionnant d'autres contrôles dans la même fenêtre), n'utilisez pas la désactivation. Cachez plutôt les contrôles. Par exemple, n'utilisez pas la désactivation pour les contrôles que les utilisateurs d'un certain travail ou d'une certaine classe ne sont jamais autorisés à utiliser. La désactivation peut dérouter certains utilisateurs qui chercheront ensuite quelque chose à faire pour les activer. En ce qui concerne les utilisateurs, les actions pour lesquelles ils n'ont pas les droits ne sont pas leur travail (sinon ils auraient accès), et donc les contrôles associés ne devraient tout simplement pas exister dans leur interface utilisateur. La documentation ou les manuels de procédures d'organisation peuvent indiquer aux utilisateurs comment ces actions sont accomplies.

Le masquage doit également être considéré comme une alternative à la désactivation lorsque vous remplacez l'accès à un ensemble de contrôles par l'accès à un autre ensemble. C'est pour éviter d'encombrer votre fenêtre avec des contrôles indisponibles en excès.

Dans votre exemple particulier, il existe une autre alternative, en supposant que vous utilisez des boutons radio: Laissez la zone de texte activée. Si les utilisateurs tapent dans la zone de texte, sélectionnez automatiquement le bouton radio Quelqu'un d'autre pour eux. Cela économise un clic à l'utilisateur. MS Office le fait avec le bouton radio Pages et la zone de texte dans sa boîte de dialogue Imprimer.

J'ai bien plus que vous n'auriez jamais cru possible sur le sujet à Controlling Your Controls .

Pour des problèmes et réponses similaires liés à la désactivation et au masquage, voir également:

Il est juste d'appeler cela une question pérenne.

10
Michael Zuschlag

Dans des circonstances normales:

  • Activez/désactivez si seuls quelques champs sont affectés.
  • Masquer/Afficher si de nombreux champs sont affectés.

Il est vraiment utile d'avoir les champs dépendants immédiatement après le champ qui les affecte afin que la dépendance soit claire ... soit sur la même ligne, soit sur la ligne ci-dessous et en retrait pour indiquer la dépendance.

3
James Crook

Je pense que les contrôles désactivés sont souvent déroutants: pourquoi est-il désactivé, que dois-je faire?

Si, à l'intérieur d'un formulaire, un utilisateur doit d'abord sélectionner quelque chose, et en fonction de cette décision, des champs supplémentaires doivent peut-être être remplis, je les cacherais et ne les afficherais que si nécessaire.

Donc, dans votre cas, je cacherais toujours la zone de texte jusqu'à ce que l'utilisateur ait sélectionné Someone else. Sinon, je peux imaginer que les gens pourraient s'attendre à taper le nom (que ce soit le sien, les parents ou quelqu'un d'autre). Cela ne fera que confondre les gens. Évitez de les faire réfléchir.

1
nathanvda

Cela dépend de la disposition de l'interface utilisateur que vous utilisez. Si le reste de votre site génère plus de champs dynamiquement lorsque l'utilisateur fait des choix, alors allez-y. Je dois dire que cette approche est à la fois dangereuse et exigeante. Cela ne peut pas être une chose unique, cela doit être dans la mentalité de l'ensemble du site pour que l'utilisateur puisse saisir le concept.

Il existe de nombreux cas où un utilisateur peut se sentir dérouté par l'absence de certains champs. Je crois que votre exemple est l'un de ces cas.

  • Si vous avez l'option cachée dans un menu déroulant, je ne m'attendrais pas à ce qu'il y ait un champ supplémentaire

  • Si vous avez un bouton radio ou une autre méthode qui laisse l'option exposée, je rechercherais le champ supplémentaire même s'il est désactivé.

1
Harris

Dépend de l'utilisation. Mais généralement, s'il doit remplir, activez tous les champs qui doivent être remplis et s'il n'est pas rempli, donnez simplement un avertissement à l'utilisateur. L'activer après avoir rempli certains champs peut parfois être ennuyeux.

0
Orhan Obut