Autocomplete bei Input-Feldern abschalten

Das am meisten ignorierte Attribut im Web-Umfeld lautet wohl autocomplete.  Dabei ist der kleine Helfer äußerst sinnvoll, suggeriert es doch dem DAU, das der Browser dessen Kreditkarten-Nummer nicht kennt – was wohl eher ein Trugschluss ist ;) Es gibt natürlich Browser (Safari) wo das automatische Ausfüllen von Formularen mit persönlichen Daten zum Grundkonzept gehört, alle Browser können (per Default) allerdings Formular-Felder speichern und bei der nächsten Nutzung des Formulars dieses vor ausfüllen.

Autocomplete ist für eine Datalist grundlegend.

So weit zur Theorie, in der Praxis schaffen es manche Browser nicht, diese Daten auch einer Domain zuzuordnen. Will heißen: Fülle ich auf der einen Seite ein Formular aus, dass ein Feld mit dem Namen „kreditkarte“ enthält und gehe zur nächsten Seite, die in einem Formular ein Feld mit gleichem Namen besitzt, wird es dort vor ausgefüllt.

Wer sich ein bischen mit dem Thema beschäftigt weiss, das die Daten aus dem Browser kommen, und nicht von der Webseite. ABER der durchschnittliche Internetnutzer dürfte wohl eher auf die „Woher haben die meine Daten“-Idee kommen. Es ist also bei manchen kritischen Feldern sinnvoll, das autocomplete abzuschalten. Dies sollte natürlich bei kritischen personenbezogenen Daten der Fall sein, aber auch bei den meisten Login-Formularen ist der Autocomplete Quatsch. Wer jetzt sagt: da muss ich aber Benutzername / Passwort jedesmal wieder neu eintippen – falsch! Logindaten werden im Browser separat gehandelt und der Browser kann (insofern man sie speichert) diese Formulare erkennen und automatisch ausfüllen. Login-Informationen ist ungleich Form Autocomplete!

Wie erreiche ich nun, dass ein Feld oder ein Formular nicht automatisch ausgefüllt wird? Das Attribut autocomplete kann entweder auf ein einzelnes Form-Element oder auf die gesamte Form angewendet werden. Für letzteres sperrt man dann den autocomplete für alle Formular-Elemente auf einmal:

<form method="post" autocomplete="off">

Ein einzelnes Formular-Element wird analog gesperrt:

<input type="text" name="kreditkarte" autocomplete="off">

Aufgrund der neuen Tags in HTML5 gibt es natürlich auch neue Möglichkeiten für den Einsatz des Attributs autocomplete. Am wichtigsten ist wohl der Einsatz in einer Datalist. Diese wird in der Regel für große Datenmengen eingesetzt und die Chance, das ein Benutzer zweimal den gleichen Wert verwenden will, ist gering. Das Autocomplete ist am besten in diesem Video erklärt:

httpv://youtu.be/UpURhGt9aBo

Also, beim nächsten Formular vielleicht kurz an das Attribut erinnern, und einsetzen. Es ist sehr schnell eingebaut, bringt aber einen großen Nutzen, denn es suggeriert dem Benutzer zusätzliche Sicherheit – vor allem im Checkout einer E-Commerce-Site!

Ähnliche Beiträge


Sprite-Animation für HTML5
Willkommen zu einer neuen Folge von Zurück in die Zukunft. Spiele in HTML5 bringen eine Menge Technik mit sich, die die Generation C64 bereits aus dem...


HTML E-Mail Boilerplate
In der Webentwicklung gibt es schlimme Sachen, es gibt ganz schlimme Sachen, und es gibt HTML-E-Mails für Newsletter. Letztere sind nach meiner Meinun...


LimeJS – HTML5 Spiele Framework
Darüber das HTLM5 der Weg in die Zukunft ist, und nicht Flash, lasse ich mich heute mal nicht aus (dann haut ihr mich wieder!:) Aber es ist schön anzu...


HTML-Tables mit jQuery
Ich hoffe ihr benutzt Tabellen nur noch zur Datenvisualisierung, und nicht mehr für das Design! ;) Aber zumindest dort sind sie unumgänglich. Dummerwe...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.