Meilleure pratique pour la validation des entrées d'application de bureau
J'ai lu certaines des autres questions étiquetées avec validation et similaires. Nous avons une application de bureau Windows (WPF) qui contient de nombreuses zones de texte contenues dans une boîte de dialogue qui doivent être validées, chacune différemment (doit être un nombre, doit être compris entre 2 nombres, doit être supérieur à zéro, etc.) .
Nous ne pouvons pas utiliser la même interface utilisateur que la plupart des formulaires de site Web lorsque vous essayez de soumettre ou de passer à une autre page, où du texte est affiché (en rouge, par exemple) près des champs non valides, indiquant à la fois quels champs sont invalides et ce qui est l'entrée attendue/ce qui ne va pas avec l'entrée actuelle. Dans de tels cas, la hauteur de la page Web est simplement étendue pour accueillir le texte supplémentaire, si nécessaire.
Dans le cas de notre application, l'immobilier est limité, de sorte que les contrôles et la fenêtre ne peuvent pas être facilement redimensionnés. La question est, quelles sont les règles/non-non sur la validation de l'entrée lors de l'interaction avec l'utilisateur?
Changeons-nous les valeurs incorrectes en valeurs correctes par défaut? Si oui, quand - à la sortie du champ, dans la boîte de dialogue OK, ou…? Les info-bulles semblent être une méthode de communication viable.
À votre question principale ...
Big No-No's autour de la validation:
Modification automatique d'une valeur Vous devez informer un utilisateur qu'un problème/erreur potentiel a été fait et suggérer la bonne réponse si vous êtes en mesure de le faire.
Dans le cas où il existe une dépendance entre les champs et si la modification de la valeur force un autre champ à se mettre à jour, informez à nouveau l'utilisateur de la modification d'un champ précédent qu'il a rempli.
Ne couvrant pas tous les cas d'utilisation ou contenu/libellés trompeurs
Si vous validez un champ, assurez-vous que tous les cas d'utilisation sont couverts. J'ai vu beaucoup de sites Web où les étiquettes/notes de champ demandent une chose mais la validation est très limitée. Exemple: "Entrez votre adresse e-mail", mais la validation ne s'attend qu'à des adresses e-mail se terminant par ".com", ".net" et ".org"
Ou ... "Fournissez votre adresse IP" mais autorisez uniquement l'adresse IPv4 et non IPv6
info-bulles inutiles
Modifiez visuellement le style du champ et n'affichez aucun texte utile. Le problème principal ici est l'accessibilité car certaines personnes peuvent même ne pas remarquer de changement de couleur.
Une autre erreur courante est ... d'afficher le texte "valeur invalide" ou similaire. Cela permettra à l'utilisateur de deviner ce qu'il a fait de mal et cela pourrait devenir très frustrant.
Effacement des valeurs en cas d'erreur (pas d'enregistrement de l'état du formulaire)
Permettez-moi de dire que plus le formulaire est grand, moins votre taux de conversion sera élevé, les formulaires doivent être petits/courts et ne capturer que des informations supplémentaires que vous n'avez pas encore saisies. Les utilisateurs sont plus susceptibles de fournir de courtes informations.
Maintenant, j'ai vu certains sites Web plus anciens qui n'enregistrent pas l'état du formulaire après qu'une erreur s'est produite et forçant l'utilisateur à ressaisir de nouveau les informations. Enregistrez l'état du formulaire pour faciliter la conversion de votre formulaire.
Désactivation des boutons d'action
J'ai vu des cas où le bouton "Soumettre" est désactivé jusqu'à ce que tous les champs passent la validation. Cela peut sembler une bonne idée au début, mais vous ne voulez pas que votre utilisateur continue de deviner pourquoi le bouton ne fonctionne pas et ce qu'il peut manquer. Il est possible de désactiver le bouton après la soumission initiale et pendant que les erreurs sont affichées (supposons que la validation du champ se produit lors de la "saisie" afin que le dernier champ passe la validation - le bouton se réactive instantanément).
validation WPF peut être configuré pour mettre en évidence/expliquer les mauvais champs des info-bulles lorsqu'ils perdent le focus; de cette façon, l'entrée complète de l'utilisateur est disponible. Vous pouvez laisser OK/Enregistrer désactivé jusqu'à ce que tous les champs soient validés avec succès, mais une meilleure approche (dans le cas où la plupart/tous les champs commencent vides et qu'un utilisateur peut oublier d'en remplir un qui est requis) est d'activer le bouton, mais de valider tous les champs vides lorsque l'on clique dessus et ne ferment que s'ils réussissent, mettant en évidence ceux qui échouent normalement. De cette façon, vous n'avez pas le problème d'afficher une surbrillance irritante sur les champs auxquels l'utilisateur n'a pas accès.
Alternativement, bien sûr, laissez le bouton OK désactivé jusqu'à ce que tous les champs obligatoires soient valides et non vides, mais ne mettez en surbrillance/info-bulle de validation qu'une fois qu'ils ont été ciblés au moins une fois.
La correction silencieuse de la saisie utilisateur n'est pas une meilleure pratique dans la plupart des cas, car elle a tendance à empêcher les utilisateurs de saisir correctement ce qu'ils voulaient. Et si vous commencez avec une valeur par défaut raisonnable dans le champ, toutes les modifications doivent être supposées être intentionnelles, et donc si elles ne sont pas valides, elles doivent être corrigées par l'utilisateur. Une exception à cela, cependant, serait les cas où un champ vide n'est pas valide en soi, mais peut être extrapolé à une valeur par défaut raisonnable, auquel cas le texte estompé et/ou en italique pour indiquer que la valeur par défaut est utile. Par exemple, un certain nombre d'applications dépendant du réseau comme la messagerie instantanée ou les clients torrent utilisent stunserver.org comme serveur STUN/TURN par défaut, et l'indiquent dans la configuration avec une zone de texte vide qui peut être définie si vous le souhaitez, mais qui revient à la valeur par défaut lorsqu'il est vide, et qui affiche la valeur par défaut comme exemple de paramètre comme indiqué.
WPF a un excellent cadre de validation. Je le trouve intuitif avec de nombreuses options. Et il conserve l'espace d'écran. Il utilise des bordures et des info-bulles facultatives.
La programmation n'est pas si simple, mais elle est agréable pour les programmeurs car elle applique les règles au niveau de la couche de données. Les couches métier/données n'ont pas à se soucier de la façon dont l'application de ces règles se propage à la couche d'interface utilisateur.
De nombreux utilisateurs y sont habitués. Pour moi, tout ce que fait Microsoft est une norme.
Si vous liez une propriété Integer à TextBox, vous obtenez automatiquement une validation entière.
En fait, vous avez besoin d'un convertisseur pour un TextBox vide pour ne pas envoyer string.empty.
Quant à quand forcez-vous la valeur à une valeur valide?
- Commencez avec des valeurs valides/par défaut
- Impossible de le faire avec la touche enfoncée car> 10 échouerait avant d'appuyer sur la deuxième touche
- Perte de concentration - lorsqu'ils quittent la TextBox
- Perte de focus ou touche d'entrée
- Lorsque vous cliquez sur un bouton soumettre/traiter
- Ne forcez pas. Donnez à l'utilisateur des commentaires sur ce qui ne va pas/ce qui est acceptable et faites-lui entrer une valeur valide.
Ils ont tous plus et moins
Si vous contraignez une valeur basée sur d'autres valeurs, vous pouvez rencontrer un problème de boucle si vous la définissez sur la perte de focus.
Regardez ce tutoriel pour les règles de validation: http://wpftutorial.net/DataValidation.html
Le message d'erreur se trouve dans l'info-bulle, mais vous pouvez placer le message d'erreur dans un storyboard et l'animer. Comme apparaître uniquement, en cas d'erreur. C'est ainsi que la validation en ligne est utilisée sur les sites Web. Ne me demandez pas comment je l'ai fait. C'est il y a quelques années, mais c'est faisable. Je pense que quelque chose comme démarrer l'animation si la boîte de chaîne n'est pas vide. J'espère que cela aide.
Le temps me manque, je travaille avec Sketchflow et Expression Blend - c'est un excellent ensemble d'outils.