Conversion Optimierung: Mehr Leads & Sales durch bessere Formulare

Der Nutzer klickt auf Dein Werbemittel, befasst sich intensiv mit dem Angebot auf Deiner Landing Page – und springt ab. Derartiges Nutzerverhalten kann durch eine Vielzahl von Faktoren verursacht werden. Sobald der Nutzer Dein Angebot jedoch verstanden hat – und möglichst überzeugt ist – steht zwischen ihm und dem Lead bzw. Sale nur noch eines: Das Formular. Ich gebe Dir heute nützliche Tipps, die Du einfach für Dein Formular anwenden kannst.

Platzierung & Darstellung

Die Grundvoraussetzung für ein gutes Formular ist, dass es gefunden wird und ansprechend sowie leicht bedienbar aussieht. Wo ist die richtige Position und welche Gestaltungsrichtlinien gilt es zu beachten?

Wo sollte ich mein Formular platzieren?

Früher war es üblich, Formulare auf Unterseiten hinter Buttons zu verstecken. Mit der zunehmenden Anzahl von “Standalone Landing Pages” – d. h. speziell eingerichtete Marketing-Seiten für einzelne Angebote – wird die Platzierung von Formularen direkt auf der Landing Page immer beliebter.

Das macht auch Sinn: Wir haben die Formular-Platzierung “auf der Landing Page” vs. “hinter einem Button auf der Unterseite” für zahlreiche Landing Pages getestet und in fast allen Fällen sehr positive Ergebnisse erzielt. Die Conversion Rate-Steigerungen reichten dabei von +20% bis jenseits der +200% – bei ausreichend Conversions, um von statistischer Signifikanz sprechen zu können. Ein Grund hierfür liegt darin, dass der Nutzer sofort sehen kann, was ihn erwartet und wie einfach es ist, ein Formular auszufüllen.

Ausnahmen bestätigen die Regel: Sobald ein Formular im oberen Bereich einer Website eine gewisse Anzahl von Feldern oder Teilschritten überschreitet, macht eine Platzierung hinter einem Button auf einer Unterseite Sinn, da der Nutzer sonst u. a. von der Masse der abgefragten Angaben abgeschreckt wird, bevor er sich mit dem eigentlichen Inhalt der Seite auseinandersetzt. Bei längeren Formularen sollte man die Platzierung in jedem Fall A/B-testen.

Der “above the fold”-Mythos

Der “above the fold”-Mythos besagt, dass alle wichtigen Elemente auf Deiner Seite ohne zu scrollen sichtbar sein müssen. Der “fold” beschreibt hierbei die Unterkante des Browserfensters vor einer Scrollbewegung. Der angebliche Grund hierfür liegt in der Behauptung, Nutzer würden nicht scrollen.

Meiner Erfahrung nach stellt eine Platzierung below the fold nur dann ein Problem dar, wenn es für den Nutzer so aussieht, als sei er bereits above the fold am Ende der Seite angelangt. Der Schlüssel ist, den Nutzer zum Scrollen zu motivieren. Es macht deshalb Sinn, zumindest ein Element so zu platzieren, dass es sowohl above als auch below the fold sichtbar ist. Hierfür eignet sich beispielsweise das Formular, die Vorteilskommunikation oder ein passendes Bild. Mehr über den “fold”-Mythos kannst Du hier lesen.

Abbildung 1: Auf evernote.com wird vermutlich eher selten gescrollt: Die Seite ist viel länger als es scheint.

Häufig wird versucht, diese Problematik durch einen Button im Bereich above the fold zu lösen, welcher beim Klick ein Scrollen auslöst. Der Nachteil an dieser Lösung ist, dass Nutzer nicht so gerne klicken wie sie scrollen. Joshua Porter drückt es treffend aus: “Scrolling is a continuation, clicking is a decision.”

Wie ist das optimale Formular gestaltet?

Wann immer ich nach der optimalen Gestaltung gefragt werde, muss ich mit einem ernüchternden “Es kommt drauf an” antworten. Die Best Practices unterscheiden sich je nach Zielgruppe, Design der restlichen Website, Zweck und Kontext der Seite sowie zahlreichen anderen Faktoren. Und “optimal” ist etwas sowieso erst dann, wenn dauerhaft 100% aller Besucher mit höchstmöglichem (Warenkorb-)Wert konvertieren. Also nie.

Allgemein kann man über die Gestaltung von Formularen sagen, dass sie vom restlichen Inhalt hervorgehoben bzw. abgegrenzt sein sollten, beispielsweise durch eine auffällige Hintergrundfarbe, einen Rahmen oder Ähnliches. Somit kann der Nutzer problemlos erkennen, was von ihm auf der Seite erwartet wird und wo es weiter geht.

Ein heller Farbton führt hierbei meist eher zum Erfolg als ein dunkler. Der Grund liegt darin, dass ein dunkles Formular “schwerfälliger” und komplizierter wirkt. Ein helles hingegen scheint “leichter” und somit einfacher auszufüllen zu sein.

Die Eingabefelder sollten stimmig angeordnet sein. Gerade bei mehreren Feldern je Zeile trifft man häufig auf unruhiges “Flattern” der Formularfelder, was dem Ganzen die visuelle Leichtigkeit nimmt.

Abbildung 2: So macht man’s richtig: Die Formularfelder sollten nicht “flattern”, sondern ein stimmiges Gesamtbild ergeben.

Warum sollte jemand mein Formular jetzt ausfüllen?

Wenn der Nutzer nicht auf Anhieb versteht, warum er unbedingt sofort bei Dir anfragen sollte, wird er mit hoher Wahrscheinlichkeit abspringen, ehe er das erste Formularfeld ausgefüllt hat.

Bevor der Nutzer Dein Formular ausfüllt, solltest Du ihn deshalb mit einer guten Formular-Überschrift und passender Vorteilskommunikation überzeugen bzw. in seiner Entscheidung bestärken.

Die richtige Formular-Überschrift

Bei der Formular-Überschrift geht es darum, dem Nutzer die unmissverständliche Antwort auf die Frage in seinem Kopf zu geben: “Warum sollte ich das hier jetzt ausfüllen?”

Überschriften wie “Jetzt Kontakt aufnehmen” oder “Ihre Anfrage” tragen selbstverständlich nicht dazu bei, den Nutzer zur Eingabe seiner Daten zu überzeugen. Es ist sinnvoll, an dieser Stelle Dein Angebot in Verbindung mit dem Ziel des Nutzers zu kommunizieren: Bietest Du auf Deiner Seite beispielsweise eine Online-Nachhilfe-Dienstleistung für Schüler an, wäre eine passende Überschrift “Mit Online-Nachhilfe in nur 4 Wochen bessere Noten erhalten”. So erzielst Du im Kopf des Nutzers einen “Das will ich”-Effekt und er fühlt sich verstanden. Die beste Voraussetzung für eine Conversion.

Passende Vorteilskommunikation

Um den “Das will ich”-Effekt weiter zu verstärken, solltest Du unter der Formular-Überschrift 2 bis 3 aussagekräftige Kundennutzen (ggf. in Kombination mit Eigenschaften) platzieren.

Um beim Nachhilfe-Beispiel zu bleiben:

Abbildung 3: Nachhilfebeispiel

Sollte es Dir schwer fallen, Kundennutzen zu finden, schreibe einfach eine Reihe von Angebots-Eigenschaften auf ein Blatt Papier und frage Dich jeweils: “Warum ist diese Eigenschaft gut für meinen Kunden?”

Voilà. Ein neuer Kundennutzen.

Formular-Usability & -User Experience

Kaum ein Element auf einer Website birgt so viel Frustpotential wie ein Formular. Wie sollten Felder angeordnet sein, damit es leicht zu bedienen ist? Wie gehst Du am besten mit fehlerhaften Eingaben um und was kannst Du tun, um die User Experience möglichst positiv zu gestalten?

Felder & Feldbezeichnungen

Sofern Du die Hemmschwelle nicht künstlich erhöhen möchtest (dazu später mehr), empfiehlt es sich, nur die Informationen abzufragen, die Du wirklich benötigst. Was kein Pflichtfeld ist, gehört – aus Conversion-Sicht – nicht ins Formular.

Die Eingabefelder sollten möglichst wenig fehleranfällig sein: Verwende z. B. einen “Datepicker” (Kalender) für die Auswahl eines naheliegenden Datums. Oder biete für die Angabe eines Geburtsdatums 3 Dropdown-Felder an: Eines für den Tag, eines für den Monat, eines für das Jahr. Erspare dem Nutzer Fehlermeldungen, welche durch fehlende Übereinstimmung im Datumsformat (z. B. 01.03.2015 vs. 1.3.2015) verursacht werden.

Die Feldbezeichnungen (“Label”) in einem Formular mit mehr als 3 Feldern sollten nicht innerhalb der Felder platziert werden (und bei einer Eingabe verschwinden), sondern links daneben oder darüber. Andernfalls erschwert man die Überprüfung der eigenen Eingaben extrem, da man am Ende des Formulars nicht mehr weiß, was beim ersten Feld gefragt war.

Automatisches Füllen von Feldern

Je einfacher und schneller ein Formular ausgefüllt ist, desto besser. Kommt der Nutzer beispielsweise über Deinen Newsletter auf Deine Seite, übergib seine E-Mail-Adresse direkt in das entsprechende Formular-Feld.

Soll der Nutzer seine Adresse eingeben, nimm ihm doch ein Stück Arbeit ab und fülle mithilfe der OpenGeoDb den Ort und die Vorwahl automatisch, nachdem er seine PLZ eingegeben hat.

Einwandbehandlung und Validierung

Manchmal ist für den Nutzer schwer nachvollziehbar, warum eine bestimmte Information abgefragt wird. Schnell entstehen Einwände. Und wenn diese nicht behandelt werden, springt der Nutzer ab. Wirke den Einwänden entgegen, bevor sie entstehen, indem Du eine kleine Tooltip-Box mit einer nachvollziehbaren Begründung einblendest, sobald sich der Cursor im Eingabefeld befindet.

Abbildung 4: Check24.de macht es richtig und lässt beim Ausfüllen des Formulars keine Fragen offen.

Bei Eingaben, welche bestimmte Kriterien erfüllen müssen (z. B. Zeichenanzahl oder Sonderzeichen im Passwort), ist es für den Nutzer hilfreich, ein visuelles Feedback zu erhalten, sobald ein Kriterium erfüllt wurde.

Abbildung 5: Visuelles Feedback hilft dem Nutzer bei der Wahl eines Passworts, das den Sicherheits-Anforderungen entspricht.

Die Validierung sollte möglichst in Echtzeit, also beim oder unmittelbar nach dem Ausfüllen jedes Feldes, passieren. Fehlermeldungen, welche erst beim Klick auf den Submit-Button erscheinen, sind frustrierend und machen es bei längeren Formularen schwer für den Nutzer, die fehlerhafte Stelle wiederzufinden.

Bei positiver Validierung empfiehlt sich die Darstellung eines grünen Häkchens als positive Rückmeldung. Das versteht jeder. Sollte eine Angabe fehlerhaft sein, muss die Fehlerbeschreibung sehr kurz und sehr “auf den Punkt” sein. Der Nutzer muss sofort verstehen, was er wie korrigieren muss.

Der Call-To-Action-Button (“CTA-Button”)

Randnotiz: Meist wird der primäre Button innerhalb einer Webseite als Call-To-Action (“CTA”; Handlungsaufforderung) definiert. Das kann zwar zutreffen, allerdings muss eine CTA nicht zwingend ein Button sein. Es ist – nun ja – eine Handlungsaufforderung. Wo sie sich befindet, hängt vom Aufbau der einzelnen Seite ab. Deshalb verwende ich hier den Begriff “Call-To-Action-Button”.

Solltest Du direkt an diese Stelle gescrollt haben, weil Du gehört hast, dass eine bestimmte Buttonfarbe Deine Leads & Sales um 234% steigert: Ich muss Dich enttäuschen. Der eine perfekte Button existiert nicht. Und jede Case Study, die etwas anderes behauptet, lügt.

“Aber orangene Buttons sind doch besser als grüne Buttons.”

Sicherlich kann man einen A/B-Test mit verschiedenen Buttonfarben aufsetzen und nach einigen Conversions eventuell eine Variation sehen, welche scheinbar besser ist als die anderen. Lässt man einen solchen Test jedoch länger laufen, werden sich die Ergebnisse immer weiter annähern.

Abbildung 6: Bildquelle

Nutzer kaufen nicht, weil ein orangener Button sie unterbewusst dazu zwingt, zu klicken. Ob grün, blau, rot, orange oder schwarz – viel wichtiger als die Farbe ist die Aufmerksamkeitsstärke Deines Buttons. Durch eine besonders auffällige Darstellung sorgst Du dafür, dass der Nutzer Deinen Button sehr frühzeitig sieht. Dadurch kannst Du – die richtige Beschriftung vorausgesetzt – sehr früh Relevanz erzeugen. Und je relevanter eine Seite für den Nutzer erscheint, desto eher befasst er sich mit den Inhalten und desto eher konvertiert er folglich.

Hier sind 3 Tipps für aufmerksamkeitsstarke Buttons:

1. Setze eine Farbe ein, die sich stark vom Rest der Seite abhebt. Sie sollte möglichst nirgendwo sonst auf der Seite vorkommen. Den größtmöglichen Kontrast erreichst Du durch den Einsatz der Komplementärfarbe des Bereichs, auf welchem sich der Button befindet. Vernachlässige hierbei jedoch nicht die Ästhetik.

2. Gestalte den Button so groß, dass Du ihn aus 3 Metern Entfernung lesen kannst.

3. Ein dezenter Verlauf im Hintergrund von oben/hell nach unten/dunkel hebt den Button plastisch hervor und lässt ihn “klickbarer” erscheinen.

Was sollte auf Deinem Button stehen?

Ist der Button aufmerksamkeitsstark gestaltet, wird ihn der Nutzer besonders früh wahrnehmen. Aus diesem Grund solltest Du eine Button-Beschriftung einsetzen, die einen Mehrwert bietet und dazu beiträgt, den Zweck bzw. das Ziel der Seite zu verstehen.

Beispiele für schlecht gewählten Button-Text:

• Weiter

• Hier

• Senden

• Download starten

• Angebot anfordern

Beispiele für besseren Button-Text:

• Kostenloses E-Book herunterladen

• Angebot für (…) erhalten

• Unverbindlichen Beratungstermin vereinbaren

Wie beeinflusse ich Qualität & Quantität von Leads?

Je nach Produkt variieren die Unternehmensziele in Sachen Leadgenerierung teilweise extrem. Während einige Unternehmen so viele Leads wie möglich generieren wollen, setzen andere Unternehmen auf Qualität statt Quantität.

Steigerung der Hemmschwelle: Steigerung der Lead-Qualität

Du solltest den Leadgenerierungs-Fokus auf Qualität setzen, wenn Dein Angebot erklärungsbedürftig ist und eine persönliche Beratung (z. B. durch einen Verkäufer) stattfindet.

Qualitativ hochwertigere Leads bringen gegenüber minderwertigen Leads typischerweise folgende Eigenschaften mit sich:

Pro:

• Leads haben mehr Interesse am Angebot

• kürzere bzw. einfachere Verkaufsgespräche

• häufigere Kaufabschlüsse

• höherer Werbe-ROI (Deckungsbeitrag / Werbeinvest * 100)

Kontra:

• geringere Lead-Anzahl

Die Qualität Deiner Leads kannst Du ganz einfach steigern, indem Du die Hemmschwelle für das Ausfüllen des Formulars steigerst.

Höhere Lead-Qualität durch zusätzliche Pflichtfelder

Es ist ein Leichtes, die Lead-Qualität durch zusätzliche Formular-Pflichtfelder zu steigern.

A) Möchtest Du beispielsweise Leads im B2B-Bereich generieren, definiere das Feld “Firma” als Pflichtfeld. Gespräche mit Privatpersonen werden alleine hierdurch deutlich weniger Zeit in Anspruch nehmen.

B) Bei besonders hochpreisigen Dienstleistungen kannst Du durch das Abfragen der Budgethöhe eine Art “Vorfilter” erschaffen und schnell erkennen, ob der Lead für Dich interessant ist – oder nicht.

C) Im B2C-Bereich wird die Qualität durch das Aufheben der Anonymität des Nutzers gesteigert. Name, Anschrift, E-Mail und Telefonnummer sind viel mehr wert als nur eine E-Mail-Adresse.

D) Grundsätzlich gilt: Je mehr Felder, desto weniger Nutzer “kämpfen” sich durch das Formular. Und je mehr Felder, desto höher ist die Qualität der Anfragen, welche am Ende bei Dir ankommen.

Übrigens: Pflichtfelder solltest Du immer gut sichtbar als solche kennzeichnen. Fehlermeldungen aufgrund von nicht ausgefüllten Feldern erzeugen Frust und senken Conversion Rates.

Höhere Lead-Qualität durch Preiskommunikation

Wenn Du nirgendwo einen Preis kommunizierst, werden viele Anfragen aus folgenden Worten bestehen: “Wie teuer ist das?”

Derartige Leads kosten Zeit und lassen sich einfach vermeiden, indem Du den Preis Deines Angebotes auf Deiner Website bzw. Landing Page kommunizierst: Wer den Preis nicht zahlen möchte, fragt auch nicht an.

Neben der Preiskommunikation ist es immens wichtig, dass der Nutzer den Wert Deines Angebots versteht. Solltest Du kein begnadeter Texter sein, der die Antwort auf das “What’s in it for me?” eines Angebots aus dem Schlaf in überzeugende Worte fassen kann, lasse besser die Finger von dieser Technik. Oder beauftrage einen erstklassigen Texter. Andernfalls wird die Preiskommunikation zum Conversion Killer und die Anzahl der Leads auf ein absolutes Minimum reduziert.

Senkung der Hemmschwelle: Steigerung der Lead-Quantität

Du solltest den Leadgenerierungs-Fokus auf Quantität setzen, wenn Dein Angebot schnell und einfach verkauft wird.

Die “Massen”-Generierung von (oft minderwertigen) Leads bringt typischerweise folgende Eigenschaften mit sich:

Pro:

• Hohe Reichweite

• Viele Sales

• Aufbau großer Emfpänger-Listen für Cross- & Upselling möglich

Kontra:

• vermehrt unqualifizierte Leads (wirkt sich negativ auf ROI aus)

Die Quantität Deiner Leads kannst Du steigern, indem Du die Hemmschwelle für das Ausfüllen des Formulars senkst.

Höhere Lead-Quantität durch Reduktion der Pflichtfelder

Wer viele Leads generieren möchte, sollte auf alle Felder verzichten, die nicht zwingend notwendig fürs weitere Bearbeiten des Leads sind.

In Sachen Formularfeld-Anzahl liegt das Optimum für eine hohe Anzahl an Leads bei 1-3 Feldern: E-Mail, ggf. Vor- und Zuname. Das Ausfüllen des Formulars ist blitzschnell erledigt und es werden kaum Fragen oder Unsicherheiten (“Kostet das was?”, “Ist das verbindlich?”) im Kopf des Nutzers aufgeworfen, wie es bei der Angabe der eigenen Adresse häufig der Fall ist. (Buchtipp: Don’t Make Me Think – Steve Krug)

Höhere Lead-Quantität durch Gratis-Angebote

Verschenkt man ein Produkt oder eine Dienstleistung, sind Conversion Rates jenseits der 50% keine Seltenheit – eine gute Landing Page vorausgesetzt.

Durch Gratis-Angebote kann man eine riesige Gruppe an Nutzern erreichen und sich als Experte positionieren – oder einfach E-Mail-Adressen sammeln, um im Rahmen der rechtlichen Möglichkeiten später Upselling zu betreiben.

Gratis-Angebote können außerdem hervorragend als Ergänzung zu kostenpflichtigen Angeboten genutzt werden: Es wirkt sich positiv auf die Lead-Anzahl aus, wenn Du Deine “7 besten Tipps für (...)” o. ä. als kostenloses Dankeschön für die Anfrage versprichst.

Ein weiterer Vorteil von Gratis-Angeboten ist der sog. Reziprozitäts-Effekt: Erhält jemand ein Geschenk oder einen Gefallen von Dir, ist er gewillt, sich dafür zu revanchieren. Oder einfacher ausgedrückt: Wie Du mir, so ich Dir. Das bedeutet für Dein Gratis-Angebot, dass es sich positiv auf Conversion Rate, spätere Verhandlungen und/oder Weiterempfehlungen auswirken kann.

Die Steigerung der Anfragen-Menge durch kostenlose Angebote funktioniert natürlich auch in der Lead-Generierung, mit Fokus auf hochwertige, qualifizierte Anfragen. Hier solltest Du jedoch sehr genau prüfen, ob das Verhältnis von Qualität und Quantität mit Deinen Vorstellungen übereinstimmt.

Marketing-Automation & Umgang mit unqualifizierten Leads

Für das Massengeschäft mit Leads empfehle ich eine (Teil-)Automation des Marketings. Gerade bei günstigen Produkten rentiert es sich häufig nicht, jede Anfrage ab dem ersten Schritt manuell zu bearbeiten. Zumindest die Qualifizierung von Leads kann man recht einfach mit fast jedem Newsletter-Tool (z. B. MailChimp) automatisieren.

Im gleichen Zug macht es Sinn, einen Plan B für unqualifizierte Leads zu entwickeln: Du kannst Dein Unternehmen bzw. Produkt etwa durch automatisierte E-Mails im Monats-Intervall oder kostenlose Produkte immer wieder in ihre Köpfe bringen und sie ohne viel Aufwand möglichweise zu Markenbotschaftern machen, die Dich weiterempfehlen.

Tipps für Formulare auf mobilen Websites

Der Anteil der Nutzer, die mit ihrem Mobilgerät durchs Internet surfen, nimmt stetig zu. Heutzutage müssen Websites für Mobilgeräte optimiert sein – sei es in Form von Responsive Design oder durch eigenständige mobile Websites, auf welche Mobilnutzer geleitet werden.

Natürlich gibt es auch bei Formularen einige Kniffe zu beachten, die Deine Conversion Rate für Smartphone & Co. steigern können.

Mach es Deinem Nutzer so einfach wie möglich

Niemand füllt gerne Formulare auf einem Smartphone aus. Der Bildschirm ist klein, die Tastatur schwierig zu bedienen. Nötige Sonderzeichen (z. B. @) sind auf vielen Geräten nicht sofort sichtbar.

Glücklicherweise bringt HTML5 eine ganze Reihe von Formular Input Types mit sich, die für verschiedene Zwecke direkt die richtige Eingabeoberfläche darstellt. So taucht bei einem E-Mail-Feld direkt das @-Zeichen auf der Tastatur auf. Eingabefelder für Datums-Auswahlfelder rufen ein Kalender-Interface auf, Telefonnummern eine Nummern-Tastatur.

Abbildung 7: Der Input-Type “tel” ruft auf Mobilgeräten eine Nummern-Tastatur auf

Mehr über HTML5 Input Types und deren Einsatz erfährst Du hier.

Du solltest außerdem darüber nachdenken, Dein Formular noch weiter zu reduzieren. Jedes überflüssige Input-Feld kann im Mobile Web zum Absprung führen.

Auf die Größe kommt es an

Die Werbeabbildungen bekannter Smartphone-Hersteller lassen vermuten, dass es da draußen hauptsächlich Menschen mit wunderschönen schlanken Fingern gibt – gemacht für präzises Tippen auf jedes noch so kleine Interaktionselement.

Die harte Realität sieht anders aus: Auch Menschen mit Wurstfingern wollen bei Dir kaufen. Frustriere sie nicht mit Formularfeldern und Buttons, deren Höhe die 30 Pixel kaum überschreitet. Komme ihnen entgegen und mach die Interaktionselemente auf Deiner mobilen Website so groß, dass man beim Tippen problemlos trifft – und optimalerweise auch noch sieht, was sich da gerade unter der eigenen Fingerkuppe befindet.

Meine Faustregel für mobile Websites: Kein Interaktionselement darf kleiner als mein Zeigefingernagel sein.

Fazit und Tipps zum Mitnehmen

Bei Formularen kann man sehr vieles falsch oder richtig machen. Wenn Du die Tipps aus diesem Artikel befolgst, bist Du in der Regel auf der sicheren Seite. Doch wie immer bei der Conversion Optimierung gilt: Vertraue nicht blind auf Best Practices. Teste Veränderungen in Deinem Kontext und finde heraus, was für Dich gut funktioniert.

Hier noch einmal die wichtigsten Learnings in Kurzform zusammengefasst:

Welche Erfahrungen hast Du mit Formularen gemacht? Hast Du Ergänzungen oder widersprichst Du in bestimmten Punkten? Lass es mich in den Kommentaren wissen. :-)