it-swarm.com.de

Welche Probleme können auftreten, wenn während der Dateneingabe ein Etikett in einem Textfeld angezeigt wird?

Ich habe gerade eine neue Technik fertiggestellt, die ich für die Verwendung eines Etiketts in einem Textfeld entwickelt habe.

Hier ist die Live-Demonstration: http://powabunga.nfshost.com/bestform/

Es gab einige Dinge, die ich hier erreichen wollte: Bei herkömmlichen Inline-Beschriftungen wird die Beschriftung tatsächlich in das Textfeld programmiert und verschwindet manchmal nicht schnell genug, sobald der Benutzer den Fokus erreicht.

Da die Beschriftung verschwindet, muss der Benutzer außerdem einen Speicher für jedes Feld behalten, das er eingibt, anstatt die Beschriftung dauerhaft links von seiner Eingabe zu sehen.

In einigen Fällen läuft ein Fehler mit dem Etikett und es bleibt tatsächlich im Eingabefeld. Bei dieser Methode ist das Label tatsächlich ein separates HTML-Element und kann sich möglicherweise nicht zur Benutzereingabe hinzufügen.

Ich habe auch einige meiner Lieblings-UI/UX-Praktiken eingeführt, z. B. den automatischen Fokus auf das erste Feld beim Laden.

Was hält die Community von dieser Methode? Welche Probleme könnten sich bei der Verwendung dieser Art von Eingaben ergeben?

7
Adam Grant

Ich würde gerne sehen, wie sich dies auf komplexere Eingabefelder auswirkt.

Ich vermute, es macht die Felder weniger scannbar, um leicht zu bestimmen, was vor dem Start eingegeben werden muss.

Ich habe Bedenken, andere Eingabetypen auf die gleiche Weise zu gestalten, z. B. Dropdowns, oder mit Eingaben zu mischen, die nicht so funktionieren, z. B. Kontrollkästchen und andere Eingabetypen.

Ich weiß auch nicht, wie Sie mit Inline-Beispielen oder Hinweisen umgehen - ich denke, das könnte noch funktionieren. z.B. slashdot anmelden:

enter image description here

Also - ja, Skalierbarkeit ist mein Anliegen - aber ich mag das Konzept. +1 für draußen denken .... ähm ... in der Box.


Übrigens - ich kann Slashdots lächerlich Kommunikation der erlaubten Zeichen und implizite Einschränkungen bei der Auswahl eines Spitznamens in keiner Weise gutheißen!

1
Roger Attrill

Das ist eine interessante Idee.

Ich habe mich leidenschaftlich gegen Hinweise in Textfeldern eingesetzt: siehe meinen Artikel Fügen Sie keine Hinweise in Textfelder in Webformularen ein Das liegt daran, dass ich viele direkte Beweise habe, die meine Ansicht stützen, dass sie eine schlechte Idee sind .

Ich bin noch leidenschaftlicher gegen Etiketten in Kartons, aber bis jetzt war das einfach so, weil sie mir einfach wie eine wirklich dumme Idee aus verschiedenen informellen Bereichen erscheinen Beobachtungen von Menschen, die mit ihnen arbeiten und aus persönlicher Erfahrung. Ich hatte keine Gelegenheit, mit ihnen zu testen, weil meine Kunden sie auch als eine wirklich dumme Idee angesehen und sie nicht umgesetzt haben.

Was Sie hier programmiert haben, ist nicht so sehr "Beschriftung in der Box" als "Box um Beschriftung und Platz zum Eingeben". In den Tagen des Papiers nannten wir diesen Stil "Beschriftung in Box". Die entscheidenden Unterschiede sind: - Die Beschriftung bleibt während der Eingabe des Benutzers bestehen. - Der Benutzer kann sie eingeben.

Ich würde gerne sehen, was gewöhnliche alltägliche Webbenutzer daraus machen. Meine Sorge wäre, dass es nicht sofort offensichtlich ist, wo Sie tippen sollen. Generell "nicht sofort offensichtlich" = "schlechte Idee", wenn es um Formen geht.

Hat jemand versucht, dies mit Leuten zu testen, die keine UX-Designer/Programmierer sind?

1

Es ist süß und klug, aber ich sehe nicht, welchen Zweck es erfüllt. Der typische Grund für eine In-Field-Beschriftung besteht einfach darin, die Größe des Formulars auf der Seite zu komprimieren. Da das Etikett sichtbar bleibt, bin ich mir nicht sicher, wie vorteilhaft es ist, es im Feld zu platzieren. Könnte es auch einfach als normales Etikett links lassen.

Vom HTML-Standpunkt aus sehe ich nicht für jedes Feld ein tatsächliches label auf der Seite. Dies ist ein wichtiges Tag und muss aus Gründen der Barrierefreiheit Teil des Formulars sein. Sie verwenden auch ein alt -Attribut für ein input -Tag. Wenn Sie nur Text dort speichern möchten, berücksichtigen Sie das Attribut placeholder oder data- Attribute (beachten Sie jedoch, dass placeholder nicht als label Ersatz gedacht ist, obwohl viele es so verwenden)

0
DA01