Erste Schritte mit Anmeldeformularen

Übersicht 

In diesem Artikel erfährst du, wie du Anmeldeformulare in Klaviyo erstellst und anpasst, um sie auf deiner Website zu veröffentlichen und das Kundenengagement zu steigern, E-Mail-Adressen und Telefonnummern zu erfassen sowie langfristige Kundenbeziehungen aufzubauen.

Mithilfe einiger zentraler Prinzipien kannst du in wenigen Minuten ein ansprechendes und erfolgversprechendes Anmeldeformular auf deiner Website einrichten.

1. Stelle sicher, dass Klaviyo-Anmeldeformulare auf deiner Website aktiviert sind. Dies kannst du im Abschnitt „Bevor du anfängst“ überprüfen.
2. Überlege dir ein Ziel für dein Formular.
3. Erstelle das Formular und passe sein Design an dein Ziel an.
4. Lege Targeting-Einstellungen fest, damit das Formular der gewünschten Zielgruppe angezeigt wird.

Bevor du anfängst

Best Practices für Anmeldeformulare 

Du bist dir nicht sicher, welche Anmeldeformulare du erstellen und veröffentlichen sollst? Hier ist eine Empfehlung für ein einfaches Formular, mit dem du deine Zielgruppe vergrößern und Besucher*innen deiner Website in zahlende Kund*innen verwandeln kannst:

• Veröffentliche ein Pop-up-Formular auf deiner Website, das angezeigt wird, wenn jemand die Seite verlassen will.
  • Nachdem du die hier beschriebenen Anleitungen für die Erstellung und Gestaltung deines Formulars umgesetzt hast, sieh dir den Abschnitt Formular ausrichten an. Dort erfährst du, welche Auslöser du für das Formular nutzen kannst, damit es nur Besucher*innen angezeigt wird, die Klaviyo noch nicht bekannt sind. 
    

    Falls du in diesem Formular sowohl eine E-Mail- als auch eine SMS-Einwilligung einholen möchtest, solltest du ein mehrstufiges Formular verwenden, um die Informationen in getrennten Schritten zu erfassen. Dies ist eine Best Practice für erfolgreiches Listenwachstum. Wenn du im Erfolgsschritt des Formulars einen Gutscheinblock für einen Aktionsrabatt hinzufügst, kann dies für Besucher*innen einen weiteren Anreiz darstellen, sich anzumelden und einen Kauf zu tätigen.

Ein Ziel für dein Anmeldeformular festlegen

Bevor du mit der Erstellung deines Anmeldeformulars beginnst, solltest du deine Ziele bestimmen. Ein Formular kann dir dabei helfen, mit potenziellen Kund*innen in Kontakt zu treten, mehr über deine Zielgruppe zu erfahren, E-Mail-Abonnent*innen zu SMS-Abonnent*innen zu konvertieren und vieles mehr. Ein einfaches Pop-up-Fenster, das die Kontaktinformationen von Personen erfasst, die deine Website besuchen, aber deine Nachrichten noch nicht abonnieren, ist ein guter Anfang. 

Mithilfe dieser drei Prinzipien kannst du ein erfolgreiches Anmeldeformular entwerfen:

• Einfacher Stil
  Wenn dein Formular zu lang ist, lenkst du vom Hauptziel ab und machst es Besucher*innen deiner Website schwerer, „Ja“ zu sagen. Halte dein Formular so einfach wie möglich, damit Besucher*innen dein Formular schnell verstehen und ausfüllen können.
• Design für das Gesamterlebnis
  Die Suche nach der perfekten Farbe oder dem perfekten Layout kann leicht ausufern. Bei erfolgreichen Anmeldeformularen geht es um mehr als nur den ersten Eindruck. Denke bei der Gestaltung deines nächsten Formulars an das Nutzungserlebnis deiner Abonnent*innen – bevor, während und nachdem sie dein Formular sehen.
• Die richtigen Daten
  Die meisten Anmeldeformulare fragen nach der E-Mail-Adresse oder Telefonnummer. Zusätzliche Daten können dir jedoch dabei helfen, starke Beziehungen zu deinen Abonnent*innen aufzubauen. Anmeldeformulare können auch genutzt werden, um bestimmte Zielgruppen mit einer Ankündigung oder einem Angebot anzusprechen. Wenn du weißt, wann du wonach fragen solltest, erzählen dir Abonnent*innen gerne mehr über sich. 
  • Während mehrstufige Formulare eine Best Practice sind, um Informationen von neuen Abonnent*innen zu erfassen, sind einstufige Formulare (z. B. ein Formular, in dem nur eine Telefonnummer abgefragt wird) effektiv für die kanalübergreifende Akquise.

Sobald du dich für ein Ziel für dein Formular entschieden hast, wählst du in der linken Navigation von Klaviyo Anmeldeformulare aus, um mit der Erstellung zu beginnen.

Ein einfaches Anmeldeformular erstellen

Dieser Leitfaden gibt dir einen Überblick über die einzelnen Schritte. Sobald das Formular erstellt, gestaltet und ausgerichtet ist, kannst du es mit nur wenigen Klicks auf deiner Website veröffentlichen. 

Um ein neues Anmeldeformular zu erstellen, hast du zwei Möglichkeiten:

• Nutze eine Formularvorlage aus der Formularbibliothek von Klaviyo. 
• Erstelle ein neues Anmeldeformular.

Ein Formular aus der Formularbibliothek erstellen

Die Formulare in der Formularbibliothek wurden unter Berücksichtigung bewährter Verfahren entwickelt. Du kannst die Optionen nach Formulartyp oder Ziel filtern, um die richtige Vorlage zu finden. Anschließend kannst du die Standarddesigns einfach bearbeiten, sodass sie zu deiner Marke passen. 

1. Wähle in der Hauptnavigation von Klaviyo Anmeldeformulare.
2. Wähle oben rechts Formular erstellen aus.
3. Suche in der Bibliothek nach vorkonfigurierten Formularvorlagen. Du kannst auch die oben sichtbaren Drop-down-Menüs Typen und Kategorien verwenden, um in den Vorlagen nach Formularart, Zweck oder beidem zu filtern.
   
4. Wähle deine Formularvorlage.
5. In der angezeigten Vorschau:
   • Benenne dein Formular
   • Wähle die Liste aus, an die dein Formular übermittelt wird (dies ist die Liste, auf der die Personen, die dieses Formular ausfüllen, gesammelt werden).
     

     Beachte, dass du bei einem mehrstufigen Formular, in dem E-Mail und Telefonnummer erfasst werden, zwei verschiedene Listen auswählen kannst. Wenn du noch keine SMS-Abonnentenliste hast, wird automatisch eine erstellt, wenn du SMS-Abonnent*innen auswählst. 

     
6. Wähle Formular erstellen, um den Formular-Editor aufzurufen, in dem du den Inhalt und das Design an deine Marke anpassen kannst.
   

Ein neues Anmeldeformular erstellen

Wenn du lieber mit einer leeren Formularvorlage beginnst, erstelle ein neues Anmeldeformular.

1. Gehe zu Anmeldeformulare > Formular erstellen.
2. Klicke oben rechts auf Neues Formular erstellen.
   
3. Wähle im erscheinenden Detailfenster Folgendes aus:
   • Einen Namen für dein Anmeldeformular
   • Die Liste, zu der neue Abonnent*innen hinzugefügt werden
     

     Beachte, dass du die Liste, an die das Formular gesendet wird, später ändern kannst. Dafür klickst du im Editor auf die Schaltfläche „Senden“ des Formulars und wählst eine andere Liste aus.

   • Die Art des Anmeldeformulars, das du verwenden möchtest
   • Option zur Aktivierung von Datenschutzfeldern
     
4. Klicke auf Speichern und gestalten, um den Formular-Editor aufzurufen, in dem du den Inhalt und das Design deines Formulars anpassen kannst. 

Formular gestalten

Sobald du dein Formular erstellt hast, kannst du den Abschnitt Stile und den Abschnitt Blöcke hinzufügen im Formular-Editor verwenden, um das Design und den Inhalt deines Formulars anzupassen. 

Dein Anmeldeformular gestalten

Wähle im Formular-Editor den Bereich Stile. Hier kannst du Folgendes bearbeiten:

• Formulartyp
  • Pop-up
    Erscheint in der Mitte des Browserfensters. Pop-ups sind ein Blickfang und haben eine hohe Conversion-Rate, aber sie können das Besuchererlebnis stören. 
  • Flyout
    Scheint aus einer Ecke der Seite „herauszufliegen“. Flyouts sind zwar auffällig, aber ermöglichen es Besucher*innen meist weiterzusurfen, ohne mit dem Formular interagieren zu müssen.
  • Ganze Seite
    Das Formular wird über das gesamte Browserfenster hinweg angezeigt, um die volle Aufmerksamkeit deiner Kund*innen zu gewinnen. Diese Formulare haben eine hohe Conversion-Rate, da sie nicht übersehen werden können. Allerdings sind sie auch aufdringlicher, da Kund*innen mit dem Formular interagieren müssen, um es zu schließen. Ein ganzseitiges Formular kannst du auch als Landing Page nutzen, wenn du eine spezielle Opt-in-Seite auf deiner Website haben möchtest. 
  • Einbetten
    Das Formular wird in eine bestimmte Seite oder einen Abschnitt deiner Website, z. B. deinen Footer, eingebettet. Einbettungen sind hilfreich und leicht zu finden für Besucher*innen, die mit der Absicht einer Anmeldung auf deine Website kommen. Füge zusätzlich zu anderen Pop-ups, die du veröffentlichst, ein eingebettetes Formular in deinen Footer ein, um Möglichkeiten zum Listenwachstum auf deiner Website zu optimieren. Bei einer Platzierung im Footer empfehlen wir, nur nach der E-Mail-Einwilligung zu fragen, um die Anzahl der Opt-ins zu erhöhen. 
  • Banner-Formular
    Banner erscheinen als horizontale Leiste am oberen oder unteren Rand einer Seite und fügen sich unauffällig in das Design deiner Website ein. Sie sind weniger aufdringlich als Pop-ups und ganzseitige Formulare und bieten eine kontinuierliche Sichtbarkeit, ohne das Surf-Erlebnis zu unterbrechen. Du kannst ein Banner so einstellen, dass es mit der Seite scrollt oder fixiert bleibt. Letzteres ist eine benutzerfreundlichere und für Mobilgeräte optimierte Option. Bei Banner-Formularen hast du folgende Optionen: 
    • Füge Inhaltsblöcke und Eingabefelder direkt in das Bannerformular ein, z. B. ein E-Mail-Eingabefeld.
    • Konfiguriere das Banner so, dass es, wenn Benutzer*innen darauf klicken, ein anderes deiner Live-Formulare öffnet. Setze dazu die Schaltfläche der Aktion deines Banners auf Ein anderes Formular öffnen. Wähle dann das Formular aus, das angezeigt werden soll, wenn Kund*innen auf das Banner klicken. Beachte, dass diese Funktion für eingebettete Formulare nicht verfügbar ist.
      
• Formulargröße
• Bildinhalt
• Hintergrundfarben
• Formular-, Text- und Eingabefeldstile 

Blöcke zu deinem Anmeldeformular hinzufügen

Welche Inhaltsblöcke du zu deinem Anmeldeformular hinzufügst, hängt von deinem gesetzten Ziel ab und von den Informationen, die du von den Besucher*innen deiner Website erfassen möchtest. Um Inhalte zu einem Anmeldeformulars hinzuzufügen oder zu bearbeiten, wählst du im Formular-Editor die Registerkarte Blöcke hinzufügen. 

Es gibt eine Vielzahl von Inhaltsblöcken, die du per Drag-and-Drop zu deinem Formular hinzufügen kannst. Dazu gehören:

Elemente:

• Textblock
• Schaltflächenblock
• Bildblock
• Gutscheinblock
• Block für SMS-Offenlegung
• Block für Countdown-Timer
• Anmeldungszähler-Block

Eingabefelder:

• E-Mail-Eingabe
• Rufnummereingabe
• Optionsfeld
• Multi-Checkbox
• Datumseingabe
• Dropdown
• Alterssperre, wenn deine Marke etwas mit Alkohol zu tun hat und du SMS nutzen möchtest

Wenn du in deinem Formular ein Eingabefeld hinzufügst, hilft ein Platzhaltertext Besucher*innen dabei zu verstehen, welche Informationen sie eingeben sollen. Wenn du ein Eingabefeld als Erforderlich markierst, sind die zugehörigen Optionen Erforderlicher Text und Ungültiger Text ebenfalls vollständig anpassbar. Du kannst sie in die Sprache deiner Wahl übersetzen, ebenso wie jeden anderen Text in deinem Anmeldeformular. 

Wenn du deine Kund*innen um mehrere Informationen bitten möchtest (z. B. E-Mail-Adresse, Telefonnummer, Geburtstag usw.), erstellst du am Besten ein mehrstufiges Formular. Dazu klickst du in der oberen Menüleiste auf + Schritt und gibst die Art des Schritts an, den du hinzufügen möchtest. Mit mehrstufigen Formularen kannst du zusätzliche Seiten zu deinem Anmeldeformular hinzufügen. Auf diese Weise überwältigst du Besucher*innen nicht mit zu vielen Feldern in einem Schritt. Wenn du E-Mails und Telefonnummern erfasst, empfehlen wir ein mehrstufiges Formular. Dies gilt als Best Practice für das Listenwachstum und die Einhaltung von Vorschriften. 

Dynamische Blöcke für unterschiedliche Desktop- und mobile Ansichten konfigurieren

Wenn dein Anmeldeformular so eingestellt ist, dass es auf allen Geräten (Desktop und Handy) angezeigt wird, und du möchtest, dass es je nach Gerät unterschiedlich aussieht, brauchst du nicht zwei verschiedene Formulare zu erstellen. Dynamische Blöcke können so konfiguriert werden, dass sie auf einigen Geräten angezeigt werden, auf anderen jedoch nicht. Damit kannst du jeden der oben aufgeführten Blöcke zu deinem Formular hinzufügen und angeben, auf welchem Gerät der Block angezeigt wird. So erhalten deine Kund*innen auf Mobilgeräten eine andere Ansicht als Kund*innen auf dem Desktop.

Weitere Informationen zur Verwendung von dynamischen Blöcken zur Anpassung deines Formulars an den Gerätetyp findest du in unserem Leitfaden zur Verwendung dynamischer Blöcke in Formularen.

Formular-Teaser hinzufügen

Füge deinem Pop-up-, Flyout- oder ganzseitigen Anmeldeformular einen Teaser hinzu, damit Besucher*innen, die das Formular schließen, es bei Bedarf erneut öffnen können.

Klicke in der Menüleiste auf Teaser, um ihn für dein Formular zu erstellen. Von hier aus kannst du den Stil und das Verhalten des Teasers so konfigurieren, dass er zu deinem Formular passt. Hier erfährst du mehr über Formular-Teaser.

Die Erfolgsmeldung deines Formulars anpassen

Wenn du die Hauptschritte deines Formulars fertig gestaltet hast, klicke in der oberen Menüleiste auf Erfolg, um die Erfolgsmeldung des Formulars anzuzeigen und zu bearbeiten. Diese Erfolgsseite wird jedem angezeigt, der das Formular erfolgreich ausfüllt – es sei denn, die Aktion nach dem Absenden ist auf Formular schließen oder Zur URL gehen eingestellt. Die Seite sollte zum Design und Branding deines Formulars passen. 

Targeting deines Formulars

Wähle im Formular-Editor die Registerkarte Verhalten und Targeting aus, um zu konfigurieren, wann und für wen dein Formular auf deiner Website angezeigt wird. Je nachdem, welche Ziele du mit deinem Anmeldeformular verfolgst, kannst du die folgenden Einstellungen zur Formularanzeige anpassen:

• Zeitplanung der Anzeige
• Häufigkeit der Anzeige
• Geräte, auf denen dein Formular angezeigt werden soll (Mobilgerät und/oder Desktop)
• Einstellungen zum Schließen des Formulars
• Targeting-Einstellungen
  • Du kannst ein Formular auf der Grundlage des Standorts von Besucher*innen, des Gerätetyps, der Listenzugehörigkeit, der URL, der UTM-Parameter, des Warenkorbinhalts und mehr ausrichten. 

Dein Formular auf deiner Website veröffentlichen

Während du dein Anmeldeformular erstellst, bemerkst du vielleicht, dass in der linken unteren Ecke des Editors Formularwarnungen angezeigt werden. Wenn du auf die Registerkarte Formularwarnungen klickst, siehst du eine Liste der identifizierten Probleme mit einem Hinweis zur Behebung (z. B. Text zu einer Schaltfläche hinzufügen). Wenn du eine Warnung ignorierst, wird sie in den Bereich Ignorierte Warnungen verschoben. Hier kannst du sie später erneut aufrufen. 

Sobald dein Formular fertig ist, klickst du auf Veröffentlichen. Wenn dein Formular noch Fehler aufweist, wirst du aufgefordert, diese in der Registerkarte Formularwarnungen zu beheben. Wenn alle Probleme behoben sind und deine Website mit Klaviyo integriert ist (wie im ersten Abschnitt in diesem Artikel erwähnt), erscheint dein Formular durch die Veröffentlichung auch auf deiner Website.

Dein Anmeldeformular testen

Um dein Anmeldeformular anzusehen und zu testen, gehst du auf deine Website. Wenn dein Formular für bestehende Klaviyo-Profile (wie dich) verborgen ist, kannst du einen Inkognito-Browser verwenden. Stelle sicher, dass du alle Targeting-Kriterien des Formulars erfüllst. Wenn du z. B. ein Formular so eingestellt hast, dass es nach drei Sekunden und einer Beendigungsabsicht erscheint, warte drei Sekunden ab. Demonstriere dann deine Absicht, die Seite zu verlassen, indem du deinen Mauszeiger schnell zur Schaltfläche „Schließen“ bewegst (oder auf dem Mobilgerät schnell nach oben scrollst). Beachte, dass alle Kriterien erfüllt sein müssen (in diesem Fall die Zeitverzögerung und die Beendigungsabsicht), damit das Formular erscheint.

Nachdem dein Formular freigeschaltet ist, werden die Besucher*innen deiner Website es nun in den nächsten Stunden und Tagen sehen und ausfüllen können. Die Ergebnisse deines Formulars findest du in deinen Formularauswertungen. 

Bot-Schutz für Formulare

Klaviyo aktiviert automatisch Bot-Präventionsmaßnahmen, einschließlich CAPTCHA für Anmeldeformularen, die E-Mail-Adressen, Telefonnummern oder Gutscheincodes erfassen.

CAPTCHA verlangt von Personen, die Formulare einsenden, dass sie eine kurze Aufgabe erfüllen, um zu bestätigen, dass sie ein Mensch und kein Bot sind. Wenn Klaviyo verdächtiges Verhalten oder frühere Bot-Aktivitäten von der IP-Adresse von Nutzer*innen feststellt, werden diese aufgefordert, ein CAPTCHA zu lösen, bevor sie das Formular absenden. Nur Nutzer*innen, die verdächtige, botähnliche Aktivitäten zeigen, müssen das CAPTCHA lösen.

Nächste Schritte

Wenn dein Anmeldeformular einen Anreiz für die Anmeldung enthält (z. B. kostenlosen Versand oder einen Rabatt auf eine Bestellung), erwarten neue Abonnent*innen, dass sie das Angebot sofort nutzen können. Nutze einen Welcome Flow, um ihnen das Angebot zuzusenden sowie Markenbekanntheit und Loyalität aufzubauen. 

Dein Welcome Flow sollte die Liste deines Anmeldeformulars als Auslöser verwenden. Die erste E-Mail sollte sofort verschickt werden. Zusätzliche Nachrichten oder Erinnerungen an den Gutschein kannst du ein paar Tage später hinzufügen. 

Wenn du experimentieren und den besten Anreiz für deine Zielgruppe herausfinden möchtest, kannst du auch A/B-Tests für dein Anmeldeformular durchführen. 

Weitere Ressourcen 

• Kurs: Strategische Anmeldeformulare erstellen
• So zeigst du Formularantworten an 

• Grundlagen: Gestaltung mobiler Formulare