wake-up-neo.com

Zeichenbeschränkungen für Textfeldfelder - Vor- und Nachteile und Best Practices?

Einige unserer Formularfelder haben Zeichenbeschränkungen. Wir überlegen, ob wir die aktuelle Größe der Dateneingabe widerspiegeln oder einfach die Dateneingabe über diese Größe hinaus einschränken und sperren sollen.

In HTML einfach <input> Elemente können ein maxlength Attribut haben, das die weitere Eingabe verhindert, aber <textarea> hat keine eingebaute Option. Zeichenbeschränkungen in <textarea> kann leicht über Javascript auferlegt werden.

Twitter zeigt die verbleibenden verfügbaren Zeichen an und lässt Sie mehr als das eingeben, zeigt es jedoch als Fehler an (und deaktiviert die Aktionsschaltfläche).

Twitter limit remainingTwitter limit exceeded

Wir möchten proaktiv die Anzahl der zulässigen Zeichen für ein begrenztes Feld und die Anzahl der verbleibenden Zeichen anzeigen. Wenn der Benutzer das Limit überschreitet, wird eine Meldung zur Invalidierung des Inline-Formulars angezeigt.

limit shown, characters remainingfield limit exceeded

Ein Gegenargument ist, dass Benutzer nicht einmal bemerken, dass die kleinen Zahlen aktualisiert werden, und dass der Benutzer möglicherweise viel Aufwand aufwenden muss, um etwas einzugeben, das er dann zuschneiden muss.

Was sind einige der Vor- und Nachteile der Verwendung dieser Charakterzähler?

50
Erics
  • Wenn kein Text vorhanden ist, geben Sie in der Nachricht einfach die maximale Anzahl von Zeichen an (ohne Angabe der verbleibenden Anzahl).

  • Während der Eingabe wird die Anzahl der verbleibenden Zeichen von grau auf schwarz reduziert (sehr subtile Anzeige).

  • Wenn Sie das Limit erreicht haben, ändern Sie den Rand in Rot. Überschüssigen Text in eine andere Farbe bringen. Zeigen Sie unten ein kleines Fehlersymbol an und geben Sie die Anzahl der überschüssigen Zeichen an - jetzt jedoch in Rot. Sie könnten die Rötung über ein paar Sekunden hinweg verblassen lassen, um nicht zu sehr einen „Schock“ zu verursachen.

Durch die Färbung des überschüssigen Textes kann der Benutzer sehen , wie viel der überschüssige Text ist. Ich finde es immer ärgerlich, erraten zu müssen, wie viel von meinem Text tatsächlich die überschüssige Menge ist, und es ist schön, wenn er klar markiert ist.

Begrenzen Sie jedoch niemals die tatsächliche Anzahl der Zeichen, die eingegeben werden können, auf das tatsächliche Limit, das Sie als Maximum anzeigen - das ist ein Katastrophengebiet. Es ist immer gut, den Fluss dessen, was Sie sagen möchten, zu beenden und dann zu bearbeiten.

Der farbige Text ist während des Bearbeitungsprozesses großartig, da das Feedback genau dort im Kontext ist, anstatt auf die Nummer schauen zu müssen. Sobald es wieder unter den Grenzwert geht - entfernen Sie alle roten Bits.

enter image description here


Jon W erwähnte über Digsby - habe es gerade heruntergeladen, um es auszuprobieren - und hier ist ein Screenshot der Twitter-App in Digsby, die den Hintergrund von überschüssigem Text in Rot und Text in Weiß ändert. Es ist ein Bit hart für das Auge, aber das gleiche Grundprinzip gilt für die Änderung des Textformats.

enter image description here

36
Roger Attrill

Wie üblich ist es ein Kompromiss zwischen dem Informieren einer Person über die Zeichenbeschränkung und dem Ärgern von jemandem mit mehr Informationen als nötig.

Ich denke, die Lösung besteht darin, die Informationen offensichtlicher zu machen, wenn sie benötigt werden, aber subtiler, wenn sie nicht benötigt werden. Es gibt einige Möglichkeiten, dies zu tun, aber eine, die ich versuchen würde, wäre, den Hintergrund des Feldes zu ändern und nur die Fehlermeldung zu diesem Zeitpunkt anzuzeigen. Menschen bemerken Veränderungen, wenn sie nicht sehr subtil sind.

enter image description here

Jedoch beschränken Sie die Leute nicht darauf, nur 200 Zeichen einzugeben (wenn dies die Grenze ist). Lassen Sie den Typ mehr und bearbeiten Sie ihn dann, wenn es zu viel ist.

8
JohnGB

Eine zu berücksichtigende Sache ist, dass, wenn es sich um ein Feld handelt, in das viel Inhalt eingegeben wird (d. H. Mehr als 140 Zeichen), der Benutzer den Inhalt möglicherweise an einer anderen Stelle erstellt hat und ihn in dieses Feld einfügen möchte. Verhindern Sie nicht, dass sie dies tun. Lassen Sie sie den Inhalt einfügen und geben Sie ihnen dann die Möglichkeit, ihn auf die Größe zu bearbeiten.

Sie können das Stil des Textes des Inhaltsbereichs so ändern, dass sich Farbe/Kontrast ändern, je näher Sie dem Grenzwert kommen, anstatt erst nach Überschreiten des Grenzwerts in Rot zu wechseln. Auf diese Weise erhält der Benutzer eine Warnung, dass er sich seinem Limit nähert.

3
JonW

Die beste Antwort ist ausgezeichnet, aber ich dachte, ich würde eine alternative Idee dafür teilen. Ich würde gerne wissen, ob andere dies für brauchbar/eine gute Idee halten, da ich keine Nachforschungen oder Daten habe, um dies zu belegen:

Illustration of colored bar method

Ein farbiger Balken rechts oder unten wie ein "Fortschrittsbalken" zeigt an, wie viel relativer Text eingegeben wurde. Es ist bis zu einem gewissen Punkt grün, wird dann gelb, wenn das Limit nahe ist, und rot, wenn das Limit erreicht ist. Die Benutzeroberfläche piept (jedoch nur einmal bei Erreichen des Grenzwerts). Der Tooltip ändert sich, um anzuzeigen, dass das Zeichenlimit überschritten wurde, und das Standard- "Fehler-Kringel" (andere Farbe als das Rechtschreibprüf-Kringel) gibt an, welche Zeichen das Limit überschreiten.

Ich bin der Meinung, dass dies eher "Ambient" ist und nicht so viel Platz auf dem Bildschirm oder die Aufmerksamkeit der Benutzer beansprucht wie ein separates Label.

2
J. Dimeo