15.12.2015

Conversion Centered Landing Page

Im vergangenen Artikel dieser Serie hatten wir uns dem Kernstück der Landing Page gewidmet, unserem Content. Abschließen möchte ich diese Serie nun mit dem Thema Design.

In der Praxis ist die visuelle Gestaltung der Landing Page meist der erste Punkt, der im Prozess Berücksichtigung findet. Manchmal wird sogar versucht ohne Struktur und Inhalt, rein mit einer Idee und Vision eine Landing Page rund um Lorem Ipsum und Platzhalterbildern zu gestalten. Manchen erscheint diese Herangehensweise einfacher. Sie müssen sich nicht erst mit Struktur, Inhalt, Wording und den Zielen des Unternehmens, der Leistung oder des Produkts im Detail auseinandersetzen. Ja, es ist einfacher „drauf los zu zeichnen“, aber gewiss nicht erfolgreicher. Schließlich dient unsere Landing Page nur einem Ziel: Das Erreichen der höchstmöglichen Conversion basierend auf unserer Strategie und Zielsetzung.

Der Layout- und Designprozess ist demnach immer der letzte Schritt vor der Umsetzung. Ihr Design muss Ihren Content und Ihren Call to Action stützen. Tut das Design dies nicht, dann ist es kein funktional gutes Design.

Layout und Design, ein paar Basics

In den vergangenen Artikeln haben wir nun die Struktur und den Inhalt für die Landing Page definiert. Um der Gestaltung nun einen Rahmen zu geben, müssen wir noch einmal genauer schauen, wer unsere Adressaten sind und welche Elemente diese ansprechen. Können wir mit gestalterischen Elementen spielen, da unsere Zielgruppe auch eher kreativ-innovativ ist oder handelt es sich bei unserer Zielgruppe um klassisch-konservative Kunden?

Sowohl die Zielgruppe als auch die eigentlich beworbene Leistung muss durch eine passende Gestaltung auf den relevanten Medien präsentiert werden. Bezogen auf die Medien ist es wichtig, dass wir frühzeitig darauf achten, ob wir die Zielgruppe vermehrt über mobile Endgeräte ansprechen oder ob wir den Fokus auf einer Desktopvariante der Landing Page legen. Gleich, auf welcher Auflösung wir den größeren Fokus legen, die Landing Page sollte responsive erstellt werden. Zum einen, da Google dies in ihrem Ranking berücksichtigt und sich für uns die Maintance in der Zukunft durch diese Herangehensweise minimiert.

Bei der mobilen Ansicht unserer Landing Page ist es meist üblich, dass die Seite in einer Spalte strukturiert und gestaltet wird. Rein aus Platzgründen. Allerdings ist die Conversion auch bei der Desktopvariante wesentlich höher, wenn diese einspaltig ist. Wir sprechen hier von einem Single Column Design. Dieses ist wesentlich einfacher für den Besucher zu lesen und zu scannen und ist letztendlich weniger ablenkend.

Der gestalterische Fokus sollte bei Ihrer Landing Page stets auf der Hervorhebung des Call to Actions liegen. Dieser muss visuell dergestalt hervorstechen, dass Ihre Besucher diesen ohne Mühe und auf den ersten Blick erkennen. Verzichten Sie weitestgehend auf Elemente, die rein gestalterisch sind und nicht wirklich zu einer Steigerung Ihrer Conversion beitragen. Solche Elemente lenken den Besucher nur ab und verschlechtern die Loading Performance Ihrer Landing Page merklich.

Conversion Centered Design

Der Begriff Conversion Centered Design hat sich vor allem bei der Gestaltung von Landing Pages durchgesetzt, da es gerade bei diesem Seitenformat wichtig ist, die optimale Conversion zu erreichen. Conversion Centered Design meint dabei, dass jegliche gestalterische Ausrichtung dem gewünschten Conversion-Ziel dienen muss. Dieser Begriff wurde von Oli Gardner (Unbounce) und Dan McGaw (KISSmetrics) geprägt und definiert.

Sie heben sieben Muster heraus, die bei der Gestaltung Ihrer Landing Page Berücksichtigung finden sollten, damit diese die bestmögliche Conversion erreicht.

  1. Einkapselung
    Bei der Einkapselung geht es darum, den Fokus des Besuchers mittels gestalterischen Elementen zu lenken und zu leiten. Sie kennen wahrscheinlich die Einleitung der James Bond Filme, in welchen dieser im Lauf einer Pistole sichtbar ist. Der Fokus des Betrachters wird gezielt auf den Hauptdarsteller gerichtet.

    Gleiches müssen Sie bei Ihrer Landing Page berücksichtigen. Leiten und lenken Sie Ihre Besucher gezielt zu dem Call to Action, der zentral für die Conversion verantwortlich ist. Verzichten Sie dabei auf ablenkende Links auf der Seite. So bspw. auch auf eine von der Seite wegleitende Hauptnavigation.
  2. Kontrast und Farbe
    Da der Call to Action immer rasch ins Auge des Betrachters fallen soll, muss sich dieser farblich und kontrastreich von der Landing Page abheben. Ein dunkelblauer Button auf einem hellblauen Hintergrund ist bspw. nicht so deutlich wie ein grüner oder gar roter Button. Achten Sie bei der Farbgebung allerdings auch auf die vermittelten Signale. Rot wird in diesem Kontext gerne als Warnfarbe wahrgenommen.

    Wichtig ist in diesem Kontext auch, dass sich Ihre Landing Page an verweisenden Anzeigen u.ä. anlehnt. Das steigert die Glaubwürdigkeit und führt nicht zu Irritationen.
  3. Richtungsweiser
    Arbeiten Sie mit Richtungsweisern auf Ihrer Landing Page. Überlassen Sie es nicht dem Zufall, ob der Besucher den Call to Action auch wirklich findet. Leiten Sie Ihre Besucher gezielt zur Conversion. Dies kann mittels Pfeilen oder Pfaden erfolgen. Somit leiten Sie Ihren Besucher gezielt über die Landing Page, was Ihnen im Nachhinein auch die Kontrolle Ihrer Annahmen mittels Analysen und Tracking ermöglicht.
  4. Weißraum
    Fördern Sie den Weißraum auf Ihrer Landing Page und legen Sie den Fokus auf die Inhalte. Auch wenn die Versuchung groß ist, Weißraum mit irgendwie gearteten schmückenden Elementen zu „verschönern“, dies dient nicht Ihrer Conversion! Arbeiten Sie mit einer guten Balance zwischen Weißraum und Conversion-zentriertem Content.

    Der Weißraum hilft in diesem Kontext nicht nur der Fokussierung, sondern gibt Ihrer Landing Page auch die entsprechenden Zwischenräume zum Atmen. Hinzu kommt, dass Ihr Call to Action somit noch besser zur Geltung kommt.

    Geben Sie Ihrer Landing Page Weißraum zum Atmen!
  5. Dringlichkeit und Verknappung
    Wenn der Besucher einmal bei Ihrem Call to Action angekommen ist, gibt es die Möglichkeit mit einer „künstlichen“ Verknappung zu arbeiten, damit Sie diesen auch direkt und vor allem *jetzt* dazu bewegen den Call to Action auszulösen. Das Letzte, was wir möchten ist, dass der Besucher seine Entscheidung aufschiebt. Denn i.d.R. konvertieren Besucher, die ihre Entscheidung aufschieben nicht mehr.

    Sie können bei bestimmten Produkten bspw. mit einer Verfügbarkeit oder einem limitierten Zeitraum arbeiten, um den Besucher schneller zur Conversion zu leiten.

    Bei unserem eBook Beispiel können Sie bspw. mit einem Sonderpreis für eine festgelegte Laufzeit werben und somit eine künstliche Verknappung erzeugen.
  6. Erst testen, dann kaufen
    Sie kennen das bestimmt auch selbst. Neue Leistungen bzw. Produkte, die noch keiner kennt oder getestet hat und von denen Sie noch nicht viel wissen, lassen sich i.d.R. nicht so rasch und einfach verkaufen wie bewährte Leistungen / Produkte.

    Bezogen auf unser eBook Beispiel können Sie dem Besucher ein Probekapitel anbieten und ggf. von Ihnen bekannten Lesern Testimonials einfordern. Somit steigern Sie gleichzeitig den Social Proof.
  7. Social Proof
    Wie gerade bereits erwähnt, ist der Social Proof ein Verstärker für Ihre Conversion. Desto bekannter und passender die Testimonials zu Ihrer Leistung / Ihrem Produkt sind, desto erfolgsversprechender sind die Social Proofs. Sie signalisieren damit, dass auch andere Ihrem Unternehmen und dem, was Sie tun vertrauen.

Fazit

Das Konzept des Conversion Centered Designs wurde von den beiden Autoren und Experten Oli Gardner und Dan McGaw in einer Vielzahl von bestehenden Projekten nachträglich getestet und wegweisend in neuen Projekten eingesetzt. Es hat gezeigt, dass diese Fokussierung und Ausrichtung bei der Gestaltung und Ausrichtung einer Landing Page die Conversion merklich steigert. Detaillierte Informationen zu Conversion Centered Design finden Sie hier und hier.

Nun ist es an Ihnen, Ihre Landing Page bestmöglich zu konzipieren und optimal auszurichten. Wichtig ist, dass Sie nach Veröffentlichung Ihrer Landing Page stets Ihre Annahmen testen und verifizieren. Setzen Sie an der einen oder anderen Stelle, bei der Sie sich nicht sicher sind auch mal einen A/B Test ein. Dieser gibt Ihnen Aufschluss darüber, welche Variante besser performed.

Ich wünsche Ihnen viel Erfolg mit Ihrer Landing Page und die bestmögliche Conversion.