it-swarm.com.de

Textfeldvalidierung vs. Prävention

Ich habe (hauptsächlich mit mir selbst) über den besten Ansatz für den Umgang mit ungültigen Eingaben in Textfeldern diskutiert - Validierung versus Prävention.

Am Beispiel eines numerischen Textfelds ist es besser, die Eingabe nicht numerischer Zeichen zu verhindern (unter Berücksichtigung von Sonderfällen wie Vorzeichen, Dezimalstellen usw.) oder die Eingabe von beliebigen Zeichen zuzulassen und dann eine Fehlermeldung anzuzeigen (normalerweise) wenn der Fokus übrig bleibt) wenn das Ergebnis ungültig ist?

Der erste Ansatz lautet "Erlaube dem Benutzer nicht, etwas zu tun, von dem du weißt, dass es falsch ist", hat jedoch den Nachteil, dass es möglicherweise überhaupt nicht offensichtlich ist, was passiert, wenn eine Tastaturtaste eingegeben wird und nichts passiert. Es bricht auch die Erwartung, dass Sie, wenn Sie etwas in ein Textfeld eingeben, erwarten, dass Sie sehen, was Sie eingegeben haben.

In der Vergangenheit habe ich mich im Allgemeinen dem Präventionsansatz zugewandt, aber im Allgemeinen habe ich das Gefühl, dass der Validierungsansatz auf der Feldeingabeebene möglicherweise eine bessere Benutzererfahrung bietet. Ist hier jemand eine Best Practice bekannt?

18
Bill Dagg

Prävention wird wahrscheinlich einen Benutzer frustrieren, wenn er es betritt und es nicht funktioniert. Natürlich kann dies mit angemessenen Nachrichten behoben werden, die ihnen mitteilen, warum bestimmte Zeichen abgelehnt wurden.

Einige Benutzer tippen möglicherweise auch mit gesenktem Kopf und sehen möglicherweise nicht, wann einige Zeichen abgelehnt werden. Wenn sie 10 Zeichen eingeben, aber nur wenige innerhalb dieser Tastenanschläge abgelehnt werden, werden sie es möglicherweise nie erfahren, da ihr Kopf gesenkt ist.

Im Allgemeinen habe ich die Validierung bevorzugt, da der Benutzer ihren Fehler sehen konnte. Wenn Sie komplexere Eingaben erhalten, kann es für Benutzer schwieriger werden zu verstehen, warum einige Zeichen abgelehnt werden.

20
Francis Pelland

Das Verhindern, dass der Benutzer etwas tut, von dem Sie wissen, dass es falsch ist, ist niemals das Verhindern von Tastenanschlägen in einem Textfeld. Es geht darum, die Notwendigkeit der Eingabe für diese bestimmte Eingabe nach Möglichkeit ganz zu beseitigen.

Zum Beispiel:

  • Überprüfen Sie keine Daten in einem Textfeld, entfernen Sie die Texteingabe und verwenden Sie ein Datumsauswahl-Steuerelement.
  • Haben Sie eine festgelegte Anzahl von Standardoptionen, bei denen der Benutzer eine auswählt? Lassen Sie den Benutzer sie aus einer Dropdown-Liste/Liste auswählen, anstatt sie einzugeben. Wenn Sie zusätzlich zu dieser Liste eine freie Texteingabe vornehmen müssen, verwenden Sie eine "andere" Option und erlauben Sie erst dann die Texteingabe.

Es stehen viele verschiedene Dateneingabesteuerelemente zur Verfügung, bei denen es sich nicht um Textfelder handelt. Stellen Sie sicher, dass Sie alle Ihre Optionen berücksichtigen, bevor Sie sich für die Texteingabe entscheiden.

13
Franchesca

Es gibt drei gängige Lösungen für dieses Problem, und je nach Anwendungsfall ist ein Gleichgewicht von 2 oder 3 höchstwahrscheinlich die beste.

Als Faustregel ... früh und oft Feedback geben


Sie können dem Benutzer Feedback geben:

Vor der Eingabe

Das Schreiben einer prägnanten, kommunikativen Kopie ist ein solider Schritt vorher. Tooltips, Onboarding-Flows für Erstbenutzer und andere Tools stehen Ihnen ebenfalls zur Verfügung.

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups


Während der Eingabe

Das dynamische Überprüfen von Inhalten während Eingaben und das Bereitstellen von Feedback ist ebenso wertvoll. Wenn Sie in Ihrem Fall lieber Tastenanschläge akzeptieren möchten, benachrichtigen Sie den Benutzer sofort. Wie bei der Sozialversicherungsnummer oder einer Kreditkarte können Sie Benutzer außerdem automatisch zum nächsten Feld weiterleiten (um ihnen beim Gruppieren zu helfen). Überprüfen Sie bei "komplizierteren" Eingaben wie einer E-Mail die Semantik so schnell wie möglich auf Übereinstimmung.

mockup

bmml Quelle herunterladen


Nach Eingabe

Überprüfen von Inhalten nach Eine Einreichung ist für Benutzer normalerweise am frustrierendsten, da sie den größten Aufwand betrieben haben. Wenn sie sich die Mühe gemacht haben, ein Formular falsch auszufüllen, wiederholen sie triviale Aktionen, die keinen Wert liefern. Den Benutzern mitzuteilen, dass sie etwas falsch gemacht haben, wirkt sich nachteilig auf die Stimmung gegenüber einem Produkt aus. Dies wird durch den Aufwand noch verstärkt.

Im folgenden Beispiel könnte die Benachrichtigung, dass das Formular falsch ausgefüllt wurde, vor oder während der Eingabe und nicht am Ende einer Reihe von Aktionen erfolgen.

mockup

bmml Quelle herunterladen


Ich würde Sie davon abhalten, bestimmte Tastenanschläge nicht zuzulassen, aber wenn die Kopie und das Feedback klar sind, können Sie die Kopfschmerzen in der überwiegenden Mehrheit der Fälle insgesamt vermeiden.

9
SwankyLegg

Nicht Verhindern Sie (einige) Tastenanschläge, da dies den Benutzer leicht verwirren und frustrieren kann.

Do Geben Sie eine eindeutige Beschriftung an, um dem Benutzer im Voraus mitzuteilen, welche Art von Eingabe gültig wäre.

Do Geben Sie während der Eingabe ein Validierungs-Feedback, um den Benutzer zu führen, wenn er einen ungültigen Wert eingegeben hat.

Andere haben vorgeschlagen, Tastenanschläge für Datumsangaben und numerische Felder überhaupt nicht zuzulassen. Dies mag in einigen Situationen angemessen sein, aber in vielen (den meisten?) Situationen ist es für Benutzer oft schneller, in der Lage zu sein, ein Formular/eine Benutzeroberfläche nur mit der Tastatur zu navigieren, insbesondere wenn es sich um etwas handelt, das sie regelmäßig verwenden. Wenn Sie diesen Weg gehen, denken Sie daran und fügen Sie möglicherweise die Tastaturnavigation in die von Ihnen bereitgestellte Benutzeroberfläche ein. Es ist jedoch möglicherweise am einfachsten, nur eine normale Tastatureingabe mit den obigen Vorschlägen zuzulassen und dann eine zusätzliche Möglichkeit in Betracht zu ziehen, Werte (z. B. Datumsauswahl, Dropdown-Liste usw.) als "Verknüpfung" für diejenigen auszuwählen, die diese verwenden möchten eine Maus/Zeiger/Touch-Oberfläche.

3
Squig