Nutzer müssen keine Daten noch einmal in Formulare eingeben

Sie lernen Formularelemente kennen und erfahren, wie Sie ein Formular interaktiv machen. Als Nächstes sehen wir uns an, wie Sie Nutzern helfen können, die erneute Eingabe von Daten zu vermeiden.

Autofill optimal nutzen

Das Ausfüllen von Formularen kann zeitaufwendig sein. Zum Beispiel ist die wiederholte erneute Eingabe Ihrer Adresse auf jeder Website, auf der Sie etwas kaufen möchten, kein gutes Einkaufserlebnis.

Autofill kann Ihnen dabei helfen. Sie geben Ihre Adresse einmal ein. Von nun an bietet Ihnen Ihr Browser die Option, dieselbe Adresse automatisch in andere Formulare einzugeben.

Bist du in eine andere Stadt gezogen? Sie müssen sich keine Sorgen machen, dass die alte Adresse dauerhaft als Option verfügbar ist. Sie können die in Ihrem Browser gespeicherten Adressdaten bearbeiten, um sie auf dem neuesten Stand zu halten.

Wie funktioniert Autofill im Browser?

Unterstützte Browser

  • 14
  • ≤79
  • 4
  • 6

Quelle

Ein Adressfeld kann auf verschiedenen Websites sehr unterschiedlich aussehen. Woher weiß ein Browser, dass es sich um ein Adressfeld handelt?

Browser verwenden Heuristiken, um ein Adressfeld zu identifizieren. Wie lauten die Werte der Attribute name, type und id? Ist in der Formularsteuerung ein autocomplete-Attribut vorhanden?

Auf Grundlage dieser Informationen können Browser die Option anbieten, ein Feld automatisch mit zuvor eingegebenen Daten desselben Typs zu füllen. Browser können sogar das automatische Ausfüllen eines ganzen Formulars anbieten.

Browser mit Autofill unterstützen

Sehen wir uns an, was Sie tun können, damit Browser die richtigen AutoFill-Optionen anbieten.

Sinnvolle Attributwerte verwenden

Wie Sie gelernt haben, können Browser den Datentyp anhand der Attribute eines Formularsteuerelements identifizieren.

<label for="email">Email</label>
<input type="email" name="email" id="email">

Gibt es ein Feld, in das Nutzer ihre E-Mail-Adresse eingeben sollten? Verwenden Sie email als Wert für die Attribute name, id und type. Drei Hinweise für den Browser, dass dies ein E-Mail-Feld ist.

Das Attribut für die automatische Vervollständigung

Es gibt andere Beispiele, in denen es für Browser immer noch schwierig sein kann, den Datentyp nur anhand der name-, id- und type-Attribute zu identifizieren. Hier können Sie das Attribut autocomplete verwenden.

Haben Sie in dem von Ihnen verwendeten Browser schon einmal einen Namen eingegeben? Der Browser wird Ihnen wahrscheinlich die Option anbieten, das Feld für dieses Feld in der Demo noch einmal auszufüllen.

Weitere Informationen zur automatischen Vervollständigung und zum automatischen Ausfüllen finden Sie in einem späteren Modul.

Wissen testen

Testen Sie Ihr Wissen über Autofill

Basierend auf welchen Attributen wird Autofill angeboten?

Das Attribut name.
Richtig. Browser bieten u. a. die Funktion zum automatischen Ausfüllen basierend auf diesem Attribut.
Das Attribut type
Richtig. Browser bieten u. a. die Funktion zum automatischen Ausfüllen basierend auf diesem Attribut.
Das Attribut autocomplete
Richtig. Browser bieten u. a. die Funktion zum automatischen Ausfüllen basierend auf diesem Attribut.
Alles oben Genannte
Richtig. Alle genannten Attribute helfen Browsern, die die Funktion „Autofill“ anbieten.

Ressourcen