it-swarm.com.de

Material Design - So zeigen Sie einen Anmeldefehler an

Problem

Ich versuche, eine Anmeldeseite zu erstellen, die den Richtlinien für das Materialdesign entspricht, weiß jedoch nicht, wie ich damit umgehen soll, wenn der Benutzer die falsche E-Mail oder das falsche Kennwort eingibt.

In den Richtlinien für das Materialdesign wird empfohlen, einen Fehlertext direkt unter dem falschen Eingabefeld anzuzeigen. Aus Sicherheitsgründen können wir dem Benutzer jedoch nicht mitteilen, ob die E-Mail oder das Kennwort falsch sind. Wir können dem Benutzer nur sagen, dass eines oder beide Felder falsch sind (aber nicht welches).

Unsere aktuelle Fehlermeldung bei einem fehlgeschlagenen Login lautet:

Wir erkennen diese E-Mail oder dieses Passwort nicht. Überprüfen Sie Ihre Informationen und versuchen Sie es erneut.

Beispiel

Wenn wir versuchen, dies auf unser Materialdesign zu übertragen, haben wir folgende Optionen:

(Examples

  1. Die erste Option entspricht nicht unseren Sicherheitsbestimmungen, da sie dem Benutzer mitteilt, welches der Felder falsch ist.
  2. Bei der zweiten Option wiederholen sich die Informationen und scheinen dem Benutzer keine hilfreichen Informationen zu liefern.
  3. Die dritte Option weicht von den Richtlinien für das Materialdesign ab.

Wir haben darüber nachgedacht, das Login in zwei Seiten aufzuteilen, aber das möchten wir vermeiden.

Was ist unsere beste Option?

Bearbeiten

Ein Snackbar-Toast wurde hinzugefügt, basierend auf den Ratschlägen von @Harshith.

(Updated design


15
Sebastian S

Versuchen Sie es mit Toast im Materialdesign

(enter image description here

Material-UI Snackbars Docs https://material.io/guidelines/components/snackbars-toasts.html

Ich denke, das sollte dein Problem lösen

Wenn nicht, versuchen Sie diese andere Option der Karte

(enter image description here

In diesem Fall wird ein Fehler angezeigt und ein Symbol angezeigt, da der Fehlertext groß ist, wenn Sie auf das Symbol klicken, wird der Text angezeigt. Die Hauptsache, die wir dem Benutzer zeigen müssen, ist, dass in einem Feld ein Fehler vorliegt.

Oder einfach anzeigen, dass die eingegebene E-Mail-Adresse/das eingegebene Passwort falsch ist. Bitte überprüfen Sie

8
Harshith