Gib mir Deine Daten! Review eines Registrierungsprozesses

Kein Zutritt! Jetzt registrieren Nutzername, E-Mail-Adresse, Passwort und fertig? Nein, ganz sicher nicht (mehr). Sicherlich findet man diese Form eines Registrierungsprozesses, wenn es diese Bezeichnung überhaupt verdient, auch noch. Doch mittlerweile wird wesentlich mehr Augenmerk auf die Gestaltung der einzelnen Schritte einer Registrierung und dem Gesamtprozess gelegt. Warum? Weil es um das wichtigste Gut im, der Name sagt es schon, Informationszeitalter geht: Informationen. Genauer: Nutzerinformationen. Grund genug sich einmal einen Registrierungsprozess anzugucken, der mittlerweile recht verbreitet und meiner Meinung nach gut durchdacht ist.

Positionierung des Links zur Registrierung

Der Registrierungslink kann an vielen Stellen angebracht werden. Dieser darf allerdings nicht penetrant wirken und den Nutzer quasi nötigen sich zu registrieren. Ein Link sollte natürlich beim Login-Formular angebracht werden. Des Weiteren immer dann, wenn der Nutzer eine Seite betreten möchte, für die eine Registrierung erforderlich ist. Eine schöne Möglichkeit sind auch ansprechend gestaltete kleine Banner im Content-Bereich der Seite.

Layout: keine normale Content-Seite

Abbildung 1: Registrierungsformular auf bahn.de

Der Registrierungsprozess wird nicht einfach in die normale Seite eingebettet, sondern findet auf einer Art eigenen Seite statt. Diese sieht insgesamt genau so aus wie auch der Rest der Seite. Im Prinzip geht es nur darum jegliche “Ablenkung” zu entfernen. Darunter fallen insbesondere alle Links, die den Nutzer dazu bewegen könnten aus diesem Prozess auszusteigen. Man blendet also eine ggf. vorhandene Sidebar mit Links zum Forum, zur Beiträgen etc. aus; evtl. wird auch die Hauptnavigation ausgeblendet - abgesehen vom Link zur Startseite. Wichtig ist, dass der Registrierungsprozess die ungeteilte Aufmerksamkeit des Nutzers hat.

Auf bahn.de wird dies sehr konsequent umgesetzt (vgl. Abbildung 1). Hier wird tatsächlich nur noch ein Grundgerüst der eigentlichen Seite verwendet. Meiner Meinung nach schon etwas grenzwertig, denn der Nutzer darf niemals den Eindruck haben, dass er die eigentliche Seite verlassen hat. Als Beispiel aber sehr gut geeignet.

Schritt 1: Die Registrierung

Im ersten Schritt werden einige Basisdaten abgefragt. Mindestens der Nutzername, der Vor- und Nachname, die E-Mailadresse sowie das Passwort für die Seite (ggf. mit Bestätigungsfeld). Ganz wichtig ist der Link zu den AGB bzw. den Datenschutzrichtlinien. Beide müssen vom Nutzer explizit anerkannt werden. Die jeweiligen Dokumente sollten sich in einem extra Fenster oder einer Lightbox öffnen. Sehr gut finde ich auch eine Darstellung des Registrierungsablaufs. Dieser sollte währende des ganzen Prozesses sichtbar sein und immer den Abschnitt hervorhebe, in dem man sich gerade befindet.

Abbildung 2: Die Registrierung (Klicken für Großdarstellung)

Was kann man noch machen? Interessant ist sicherlich die direkte Abonnierung eines Newsletters sowie die Abfrage von weiteren Nutzerdaten. Bei weiteren Daten muss man vorsichtig sein. Sicherlich möchte man so viele Informationen wie möglich erhalten, aber zu viele Felder schrecken den Nutzer ab. Besser eine Registrierung mit weniger Daten als gar keine. Da auf dieser Seite nicht gerade viele Elemente vorhanden sind wirkt diese zum Teil etwas leer. Das ist natürlich im Sinne einer ablenkungsfreien Registrierung. Wem dabei unwohl ist, der kann zum Beispiel noch eine kurze Vorteilsargumentation für die Registrierung anbringen oder einen grafischen Anreißer platzieren.

Hinsichtlich der Usability ist es immer sehr angenehm, wenn die eingegebenen Daten mittels AJAX direkt überprüft werden. Zum Beispiel, ob der Nutzername noch frei ist oder die E-Mail-Adresse gültig. Natürlich sollte man darauf achten, dass der Prozess auch für Nutzer ohne JavaScript zugänglich ist. Wir wollen ja niemanden aussperren, sondern Nutzer einladen.
Wie dieser erste Schritt schemenhaft aussehen könnte, zeigt Abbildung 2.

Schritt 2: Die Aktivierung

Nach erfolgreichem ersten Schritt wird dem Nutzer eine E-Mail zur Aktivierung der Registrierung zugesendet. Ein entsprechender Hinweis befindet sich auf der zweiten Seite. Man hat hier die Möglichkeit die Aktivierungs-E-Mail erneut senden zulassen. Ist der Loginbereich sichtbar, zum Beispiel im Header, ist man hier auch schon eingeloggt. Ab diesem Zeitpunkt kann man einige Funktionen der Seite schon benutzen, daher wird ein Hinweis darauf angebracht, was man schon machen kann und wie es weitergeht.

Schritt 3: Freunde einladen (optional, kann übersprungen werden)

Abbildung 3: "Empfehlen Sie XING - erweitern Sie Ihr Netzwerk!"

Wenn der Nutzer von der Seite überzeugt ist, wird er sicher auch Freunde einladen wollen. Warum geben wir ihm nicht also direkt die Möglichkeit dazu. Es gibt (kostenpflichtige) Anwendungen die es ermöglichen einige Adressbücher von Online-Diensten zu durchsuchen und beliebigen Kontakten daraus direkt eine Einladung zukommen zu lassen. Möchte man hierfür kein Geld ausgeben kann man zumindest eine manuelle Eingabe von E-Mail-Adressen ermöglichen.

Diese Möglichkeit ist im Übrigen nicht nur für den Registrierungsprozess interessant, man sollte dem Nutzer jeder Zeit dieses Feature anbieten. Ein gutes Beispiel, wo dieses Feature sowohl bei der Registrierung als auch bei der Verwendung umgesetzt ist, ist das soziale Netzwerk Xing (vgl. Abbildung 3).

Schritt 4: Mein Profil (optional, kann übersprungen werden)

In diesem Schritt kann das vollständige Nutzerprofil ausgefüllt werden, so wie es auch jedem vollständig registrierten Nutzer möglich ist. Bereits eingetragene Daten aus Schritt 1 werden hier erneut dargestellt.

Schritt 5: Inhalte einstellen (optional, kann übersprungen werden)

Kann ein Nutzer auf der Seite spezielle Inhalte einstellen, kann man ihm jetzt schon die Möglichkeit dazu geben. Sollte er dies tun, hat man den Nutzer direkt an sich gebunden, denn wenn man sicherst einmal die Mühe gemacht hat, dann verschwindet man nicht direkt wieder. Beispielsweise könnte ein Kochportal dem Nutzer die Möglichkeit einräumen, schon Rezepte von sich online zu stellen.

Schritt 6: Fertig!

Damit ist der eigentliche Prozess abgeschlossen - abgesehen vom Klick auf den Aktivierungslink. Ist ein Nutzer noch nicht aktiviert, hat er stets Zugriff auf alle Funktionen von oben und kann sich auch ganz normal einloggen. Der Nutzer kann die Seite also in einer eingeschränkten Version benutzen. Des Weiteren erhält er bei jedem Besuch der Seite einen Hinweis auf die fehlende Aktivierung, zum Beispiel als Lightbox. Diese enthält auch einen Link, um sich die Aktivierungs-E-Mail erneut zuschicken zu lassen oder seine E-Mail-Adresse zu überprüfen.

Der Login

Entweder integriert man einen Loginbereich in einem Bereich der Seite, der immer zugänglich ist, häufig wird dafür der Header genutzt. Eine andere Möglichkeit bietet eine Lightbox, die sich immer dann öffnet, wenn man auf einer Seite ist für die man eingeloggt sein muss. Nach erfolgreichem Login in der Lightbox kommt man natürlich immer zum gewünschten Inhalt zurück. Zwei zentrale Funktionen, die jeder Login zusätzlich bieten muss, sind Hilfen bei vergessenen Logindaten (Nutzername, E-Mail, Passwort).

Natürlich habe ich den Registrierungsprozess jetzt nur kurz umrissen, aber ich denke, dass es möglich ist auf Basis dieser Informationen ein individuelles Konzept für seine eigene Seite zu erstellen. Wie bereits erwähnt, ist dieser Prozess mein aktueller Favorit. Vielleicht kennt ja jemand noch andere gute Konzepte. Es würde mich freuen, wenn wir darüber in den Kommentaren diskutieren könnten.