Eine einzigartige Lösung – Live Validierungen

Ein potenzieller Kunde hat sich auf Deinem Onlineshop eingefunden, sogar das ein oder andere Produkt in seinen Warenkorb gelegt, jetzt müsste der erfolgreichen Bestellung eigentlich nichts mehr im Wege stehen. Oder vielleicht doch? Die Realität sieht oftmals anders aus, denn laut aktuellen Studien liegt die Kaufabbruchrate im Checkout bei ca. 69 %! Die Integration der Live Validierung, oder auch Inline Validierung kann diese Abbruchquote senken. 

Das Wichtigste auf einem Blick

Der 3 Step Checkout bietet 18 umfangreiche Usablitiy Funktionen, die Deinen Kaufabbrechern den Kampf ansagen. In diesen Beitrag geht es speziell um das außergewöhnliche Feature, die Live Validierungen, dessen Funktionen und die Vorteile.

Inhalte

• Was ist eine Live Validierung?
• Das Optimierungspotential
• 5 Vorteile durch die Validierung
• Live Validierung nicht nur im 3 Step Checkout
• Verknüpfung von Features
• Fazit: Live Validierung steht für Nutzerfreundlichkeit

Was ist eine Live Validierung?

Das Feature der Live Validierung gibt dem User unterschiedliche Arten von Feedback in Echtzeit am jeweiligen Formularfeld im Checkout-Bereich. So bekommt der Nutzer schon während der Bearbeitung Vorschläge für das korrekte Ausfüllen von Formularfelder oder eine Fehlermeldung, bei nicht erfüllen der Kriterien. Beispielsweise ist beim Formularfeld „Vollständiger Name“ nur der Vorname eingetippt worden, erscheint unter dem Formularfeld gleich eine Information, dass mindestens 2 Wörter eingegeben werden müssen. Hilfreich ist dieses Feature vor allem, wenn unter anderem Tippfehler während der Eingabe passieren und diese für den User nicht sofort sichtbar sind, wie beispielsweise ein Ziffernsturz bei der Postleitzahl.

Das Optimierungspotential 

Eine Studie von Luke Wroblewski zur Erforschung von best practices zum Thema Online-Validierung weist eindeutige Erfolge bei der Verwendung von Inline-Validierungen im zur den klassischen Submit+Refresh-Fehlermeldungen über dem Formularfeld nach.

Durch die Implementierung des Inline-Validierung lassen sich laut Wroblewski folgende Beobachtungen ergeben:

• Die Conversionrate der Abschlüsse steigt um 22 %
• Die Fehlerrate ließ sich um 22 % senken
• Die Zufriedenheit der Kunden erhöht sich um 31 %
• Die Zeit zum Ausfüllen des Formulars sinkt um 42 %

Doch nicht nur Wroblewski erforschte die Dringlichkeit der Inline-Validierung, auch andere Plattformen wie userlutions.com schreiben, dass die Inline-Validierung als Lösung für nutzerfreundliche Formulare dient. Sophie Krüger betont in ihrem Beitrag, dass Nutzer oft konkrete Hilfestellungen benötigen, bei der Eingabe von Formularfeldern. Durch eine Integration der Live Validierung können somit Fehler schnell und ohne weiter Frustration gefunden und behoben werden. 

5 Vorteile durch die Validierung

Eine Baymard Studie zur Inline Validation bestätigt ebenfalls die Aussage von Sophie Krüger und benennt fünf Vorteile, die durch die Integration dieses Features erreicht werden können.

Fehler schneller erkennen

Nutzer werden anhand der Live-Inline-Validierung sofort auf Fehler aufmerksam gemacht und der Prozess der Fehlerlokalisierung wird dadurch erheblich vereinfacht. Der User muss deshalb nicht mehr auf einer speziellen Fehlerseite zum stillstand kommen, sondern kann sofort diese Fehlermeldung überprüfen, beheben und direkt fortfahren.

Fehlerkontext ist noch frisch im Gedächtnis

Da der Benutzer direkt nach der Eingabe darauf hingewiesen wird, dass seine Eingabe ungültig ist, verringert sich der Zeitaufwand für die Korrektur erheblich, da die Eingabe und der Kontext noch frisch im Gedächtnis des Users sind. Auf einer gewöhnlichen Fehlerseite muss der Benutzer oft den Feldkontext erneut aufrufen und seine Eingabe erneut lesen. Da dieser Prozess mehrere Felder beinhalten kann und einige Minuten an Zeit in Anspruch nimmt, kann es dazu kommen, dass der User den Checkout-Prozess abbricht, bevor er alle Feldbezeichner erneut geprüft hat und den ungültigen Feldwert ergänzt hat.

Erhöht das Vertrauen

Wenn eine Inline-Validierung positive Rückmeldung gibt, dann profitiert auch der Anwender ohne ungültige Eingaben. Die positive Live-Überprüfung nimmt dem User eine gewisse kognitive Belastung ab, da sie das Formular vor dem Absenden nicht mehr auf Fehler überprüfen und validieren müssen. Stattdessen kann der Kunde direkt zum nächsten Feld übergehen und sich darauf verlassen, dass die Eingabe gültig ist. Eine positive Inline-Validierung kann darüber hinaus ein Gefühl des raschen Fortschritts und der schnellen Ausführung vermitteln, da der Benutzer jedes Feld „erfolgreich ausfüllt“ hat und die Website ihm ein ermutigendes visuelles Feedback gibt.

Keine Formularfelder mehr überspringen

Die Live Validierung stellt nicht nur sicher, dass die Eingaben der Felder gültig sind, sondern ist in einem gewissen Maße auch effizient. Es werden beispielsweise ausgelassene Pflichtfelder hervorgehoben, wenn der Benutzer die Formularfelder mit der Tabulatortaste durchläuft (was nebenbei über 50 % der User während des Checkout-Prozesses machen). Mit der Inline-Validierung werden Benutzer sofort benachrichtigt, wenn sie mit der Tabulatortaste durch ein Pflichtfeld navigieren, ohne einen Wert einzugeben – was die Wahrscheinlichkeit, dass ein Benutzer versehentlich ein Pflichtfeld überspringt, erheblich verringert.

Kreditkartendaten trotz PCI compliance auf niedrigem Niveau

Eine der Möglichkeiten, wie E-Commerce-Websites mit einer PCI-Konformität (Payment Card Industry Data Security Standard) auf niedrigerer Ebene auskommen können, besteht darin, dass die Kreditkartendaten des Benutzers niemals ihren Server berühren dürfen, sondern der Benutzer seine Kreditkartendaten direkt an den Zahlungsabwickler senden muss. Eine Kehrseite davon ist jedoch, dass jegliche Validierungsfehler dazu neigen, die Formulareingabe zu löschen, da die E-Commerce-Site natürlich keine Möglichkeit hat, Daten, die sie niemals berührt oder erhalten, zu speichern. Die Inline-Validierung kann verhindern, dass ungültige Eingaben (z.B. eine Kartennummer, die zu kurz oder zu lang ist oder die Luhn-Validierung fehlschlägt) überhaupt erst eingereicht werden, und so das erneute Laden der Seite vermeiden, das die gesamte Eingabe des Benutzers löscht.

Live Validierung nicht nur im 3 Step Checkout

Die Überprüfung von Texten während der Eingabe in Formularfeldern wird nicht nur in Checkout angewendet. Dieses Feature hat schon Einzug in viele andere Plattformen wie Facebook, Twitter, Instagram oder Google gefunden. Viele Unternehmen wollen ihren Usern damit helfen, um die Frustration während der Registrierung auf dessen Portal zu mindern oder die Fehlerquote zu senken. 

Verknüpfung mit anderen Features

Um das Live Validierungs-Feature noch besser zu nutzen, lässt es sich beispielsweise mit einem anderen Feature, der Google Maps Implementierung verknüpfen. Mit der Google Maps Implementierung, werden dem User automatisch, wie durch „Magie“, passende Vorschläge für die Eingabe der Adresse gebracht. Dabei wird die Straße, Stadt und Postleitzahl mit der Google Datenbank verglichen.

Des Weiteren ist es möglich, die Live-Validierung auf eine E-Mail-Validierung auszuweiten und ein neues Feature zu generieren, welches hilft die E-Mail-Domain zu checken, bevor der Kunde das Formularfeld verlässt.

Fazit: Live Validierung steht für Nutzerfreundlichkeit

Ein Feature wie die Live Validierung ist essenziell für einen userfreundlichen Checkout, es bietet nicht nur höchsten Komfort, sondern verhindert auch viel Frustration und verbessert dauerhaft die User Experience im Checkout! Nicht nur Du, sondern auch Deine Kunden werden dieses kleine Feature mit offenen Armen begrüßen. 

Quellen:
https://www.usabilityblog.de/die-conversion-von-webformularen-verbessern-mit-inline-validierung/
https://alistapart.com/article/inline-validation-in-web-forms/
https://userlutions.com/blog/usability-insights/inline-validation/
https://www.aforms2web.com/-/validierung-fehler-warnungen
https://www.felixnagel.com/blog/artikel/2009/11/16/barrierefreie-live-validierung-von-formularen-mit-jquery/
https://baymard.com/blog/inline-form-validation