Wie und warum Sie A/B-Tests für Ihre E-Commerce-Landingpages erstellen sollten
Veröffentlicht: 2021-07-15Ich erinnere mich, als ich vor langer Zeit zum ersten Mal Chicagos Haupteinkaufsstraße, die Michigan Avenue, hinunterging, war ich absolut erstaunt über die Schaufenster von mehr als einem Geschäft. Der Nike Store war eine großartige Hommage an Michael Jordan, der Spielwarenladen FAO Schwarz war ein spektakulärer Mini-Vergnügungspark und so weiter. Sie gingen hinein und nahmen am Ende etwas mit, nur um eine Erinnerung an das Erlebnis zu bekommen
Das Äquivalent zu einem physischen Schaufenster in Ihrem Online-Shop ist Ihre Landing Page. Eine Zielseite ist eine entscheidende Seite Ihrer Website: In vielen Fällen ist sie die erste Seite, die ein Besucher nach einer Google-Suche oder nach dem Lesen eines Beitrags in Ihrem Blog sieht.
Die Leute denken oft, dass die Zielseite die Startseite Ihrer Website ist und es daher nur eine gibt. Nichts ist weiter von der Wahrheit entfernt. Diese Art von Seiten sind die Seiten, die wir als Einstiegspunkte zu unserer Website gestalten. Es ist das, was die Aufmerksamkeit des Besuchers auf sich zieht, ihn auf unserer Website hält und sein Einkaufserlebnis auslöst. So sind beispielsweise auf unserer Nelio-Website einige der Zielseiten, die wir für Nelio A/B-Tests zeigen müssen:
- Die Homepage von Nelio A/B Testing
- Nelio A/B-Testing für Ihr Unternehmen
- Nelio A/B-Testing für E-Commerce
- etc
Jede dieser Seiten präsentiert unser Produkt aus einer etwas anderen Perspektive, um auf die verschiedenen Arten von Profilen einzugehen, die an unserem Produkt interessiert sein könnten. So hebt zum Beispiel die Landing Page für einen E-Commerce Merkmale oder Funktionalitäten von Websites hervor, die einen E-Commerce haben. Sie werden erstellt, um potenzielle Kunden zu konvertieren. Und aus diesem Grund ist Ihr Hauptzweck auf diesen Seiten die Optimierung Ihrer Konversionsrate.
In diesem Beitrag sehen wir uns die Hauptmerkmale einer Zielseite und die Best Practices zur Verbesserung ihrer Conversion-Rate an.
Merkmale einer E-Commerce-Landing Page
Wie Sie bereits gesehen haben, ist eine E-Commerce-Zielseite eine eigenständige Webseite, die speziell für Marketingzwecke erstellt wurde. Es ist die Seite, auf der ein Besucher „landet“, wenn er auf einen Link klickt, entweder von einer Anzeige, einem Suchmaschinenergebnis oder einer Werbekampagne.
Der Zweck einer Zielseite besteht darin, Kunden dazu zu bringen, eine bestimmte Aktion auszuführen, die im Falle eines E-Commerce hauptsächlich darin besteht, einen Kauf zu tätigen. Einer der Hauptunterschiede einer Landing Page zu anderen, die Sie möglicherweise im Web haben, besteht einerseits darin, dass sie auf ein bestimmtes Besucherprofil zugeschnitten ist: Die Titel, Texte, Bilder und Testimonials sind also spezifisch für dieses Profil dass jemand mit diesem Profil zum Kauf animiert wird. Und auf der anderen Seite enthält eine Landingpage immer einen oder mehrere Calls-to-Action.

Wenn eine Person beispielsweise sucht, wie sie die Konversionsrate in ihrem E-Commerce optimieren kann, und nachdem sie die verschiedenen Ergebnisse gesehen hat, klickt sie auf den Link von Nelio A/B Testing für E-Commerce (Sie können einen Teil-Screenshot im Bild oben sehen ), wenn sie auf der Seite landen, sehen sie eine Überschrift, die der Suche entspricht, sie finden ein Bild eines Geschäfts sowie einen Text und eine Handlungsaufforderung, die sie auffordern, mit der Erstellung von A/B-Tests zu beginnen. Die Seite erklärt auch, wie sie die Präsentation der Produkte in ihrem Geschäft optimieren können, und enthält ein Testimonial, um dem Besucher mehr Vertrauen zu geben. Schließlich gibt es ein paar Abschnitte, in denen erklärt wird, wie sie dank der Daten den Umsatz steigern können, und natürlich zusätzliche Informationen darüber, warum sie uns vertrauen können.
Wie Sie im obigen Beispiel sehen können, besteht das Ziel jeder Zielseite darin, dass der potenzielle Käufer in Sekundenschnelle genau das findet, wonach er sucht. Der Inhalt der Seite ist auf die Käuferpersönlichkeit zugeschnitten, einschließlich wichtiger Produktmerkmale (wiederum für eine bestimmte Zielgruppe geschrieben), die Vertrauen schaffen und dem Besucher den Kauf erleichtern.
Der große Vorteil von unterschiedlichen Landingpages ist, dass Sie spezifische Kunden viel besser ansprechen können . Das Design, das Wertversprechen und die Handlungsaufforderung können viel besser auf ein Marktsegment zugeschnitten werden.
Warum und welche Tests sollte ich auf einer Landing Page erstellen?
Man mag sich fragen, warum man sich die Mühe macht, A/B-Tests durchzuführen, anstatt einfach die oben genannten Funktionen zu implementieren. Nun, eine Sache ist das, was Sie vielleicht glauben, dass es die Konversion Ihrer Benutzer verbessert, und eine andere, ganz andere, ist das, was wirklich auf Ihrer Website passiert. Was funktioniert und was nicht, können Sie nur durch A/B-Tests überprüfen.
Wie Sie vielleicht bereits wissen, beginnt ein A/B-Test mit einer Verbesserungshypothese (z. B. könnten wir denken, dass eine Umverteilung der Zielseite zur besseren Anzeige bestimmter relevanter Informationen zu mehr Conversions führt), setzt die Hypothese in einer Variante um, und testet, ob diese Variante besser abschneidet als Ihre Originalseite. Technisch gesehen zeigt der A/B-Test jedem Ihrer Besucher die eine oder andere Variante, verfolgt, was sie tun, und bestimmt, welche die beste ist (falls vorhanden).

Dies garantiert, dass jede Änderung, die Sie an Ihrer Website vornehmen, eine bessere Konversionsrate hat, da Sie mit echten Daten überprüft haben, ob diese Änderung eine tatsächliche Verbesserung ist oder nicht.
Denken Sie daran, wie ich Ihnen anhand eines Beispiels zeigen werde, dass die Ergebnisse eines A/B-Tests von den erwarteten abweichen können, und deshalb ist es so wichtig, sie durchzuführen. Darüber hinaus müssen A/B-Tests kontinuierlich durchgeführt werden und Teil des sogenannten Conversion-Rate-Optimierungsprozesses oder CRO sein.
Werfen wir einen Blick auf einige der Best Practices, die Sie auf den Zielseiten Ihrer Website anwenden können.
Vereinfachen Sie die Seite
Eine Zielseite sollte einfach und leicht zu verfolgen sein. Stellen Sie sicher, dass der Besucher nicht von zu viel Text überwältigt wird oder sich verirrt und den „Jetzt kaufen“-Button nicht finden kann. Einige Tipps zur Vereinfachung der Seite sind:
- Zeigen Sie prägnante und direkte Überschriften
- Präsentieren Sie klare und sichtbare Handlungsaufforderungen
- Eliminieren Sie Navigationslinks, die nicht zur Checkout-Seite führen
- Produktdetails mit Aufzählungszeichen anzeigen
- Reduzieren Sie den Text, der nur die wesentlichen Informationen anzeigt
Stellen Sie sich eine Zielseite als eine Seite vor, auf der Sie zuerst einen kurzen Blick darauf werfen, um zu entscheiden, ob Sie darauf bleiben oder versuchen, etwas Besseres zu finden. Vermeiden Sie unnötigen Text und beschränken Sie sich auf Antworten, die dem Besucher einen Mehrwert bieten.
Obwohl die Theorie gut ist, ist das Wichtigste, den A/B-Test zu erstellen, der bestätigt, dass die Vereinfachung, die Sie auf Ihrer Seite erstellt haben, tatsächlich die ist, die Ihre Besucher bevorzugen. Beispielsweise wollten wir unsere Homepage von Nelio Software vereinfachen und haben dafür einen A/B-Test erstellt. Unser Ziel war es, eine einfachere, visuellere und prägnantere alternative Version zu entwerfen, um die Konversion zu steigern.
Landung von Nelio. Vereinfachte Version von Nelios Landung.
Wir haben den Test durchgeführt und überraschenderweise war die neue Variante, die wir erstellt haben, keine bessere Lösung, um die Konvertierung zu verbessern. Hätten wir es nicht getestet, hätten wir eine Seite angewendet, die wir für besser hielten, aber eigentlich nicht war. Die Details des A/B-Tests, den wir durchgeführt haben, finden Sie in diesem Beitrag.
Aber wie Sie im folgenden Bild sehen können, haben wir hier nicht aufgehört und weiter verschiedene Varianten unserer Nelio-Homepage getestet. Das Design unserer Homepage zum Zeitpunkt des Schreibens dieses Beitrags unterscheidet sich stark von den vorherigen Vorschlägen: Es ist klarer, einfacher und aufgeräumter. Und es funktioniert besser!
Die erste Falte Ihrer Zielseite
Der erste Falz Ihrer Zielseite ist der wichtigste Abschnitt. Es ist das erste, was jeder Besucher sieht, der auf dieser Seite landet. Ob sie weiter auf Ihrer Website surfen, nach unten scrollen, um mehr zu sehen, oder in weniger als zwei Sekunden zur Google-Suchmaschine fliehen, hängt davon ab.
Leider können Sie nicht alle Informationen in dieser ersten Falte haben: Sie müssen sorgfältig auswählen, was Sie dort hineinlegen. Was ist die wichtigste Information, die Sie einem Besucher mitteilen müssen? Das Erstellen eines A/B-Tests der ersten Stufe kann einen großen Einfluss auf die Verbesserung der Konvertierung Ihrer Website haben.
Beispielsweise haben wir auf der Nelio A/B-Testing-Landingpage, auf der das Produkt beschrieben wird und deren Conversion-Ziel darin besteht, den Benutzer dazu zu bringen, die Seite mit den Produktpreisen zu besuchen, verschiedene Versionen von First Fold getestet. Bewegen Sie den Mauszeiger über den Block und bewegen Sie den Schieberegler, um beide Versionen zu vergleichen:



In der Variante haben wir den Titel geändert und anstelle des Produktnamens, der bereits im Logo vorkommt, eine Botschaft hinzugefügt, die die Neugier des Besuchers wecken soll. Eine andere Farbe? Eine andere Form für die Knöpfe? Ein alternativer Ort für alles?
Im Anschluss daran haben wir den Untertitel so geändert, dass er anzeigt, dass wir die Lösung haben, um ihre Neugier zu befriedigen: „Erstellen und testen Sie verschiedene Versionen Ihres WordPress, um herauszufinden, was Ihrem Publikum am besten gefällt, und verbessern Sie Ihre Conversions“. Und schließlich haben wir den Text der Aktionsschaltfläche geändert, indem wir einen Dringlichkeitspunkt hinzugefügt haben: „Jetzt starten“. Außerdem würde der erste Abschnitt der Website die gesamte erste Falte einnehmen. Ziel war es, sich auf die Botschaft zu konzentrieren.
In diesem Fall waren die Ergebnisse des A/B-Tests für die englische Version anders als für die spanische Version. Während wir in der englischen Version eine Conversion-Steigerung von mehr als 12 % erzielten, konnten wir in der spanischen Version keine aussagekräftigen Daten erhalten. Für weitere Details zu diesem Experiment klicken Sie hier.

Dieses Beispiel zeigt Ihnen noch einmal, wie wichtig das A/B-Testen Ihrer Zielseiten ist. Sie können nicht wissen, welche Auswirkungen eine Änderung auf Ihre Website haben wird, bis Sie sie testen.
Ausgewählte Bilder
Unter den Elementen des ersten Falzes einer Website, die die Wahrnehmung des Besuchers am stärksten beeinflussen, ist das von uns verwendete Feature-Image der Schlüssel. Da es das erste ist, was sie sehen, haben wir sie verloren, wenn das allgemeine Gefühl des Besuchers Ablehnung ist. Darüber hinaus spielen Beitragsbilder eine wichtige Rolle, wenn der Inhalt in sozialen Medien geteilt wird.
Aus diesem Grund kann etwas so Einfaches wie das Erstellen eines A/B-Tests von vorgestellten Bildern ein Lächeln auf Ihr Gesicht zaubern, wenn Sie die Conversion-Ergebnisse sehen. Auf der Zielseite von Nelio Contents, deren Konversionsziel darin besteht, dass unsere Benutzer am Ende die Preisseite besuchen, haben wir einen A/B-Test des vorgestellten Bildes durchgeführt.
Auf dieser Seite enthält die erste Falte ein Beitragsbild, das einen lächelnden Mann mit einem Post-it auf der Stirn und dichtem Bart vor einem Computer zeigt. Auf dem Computermonitor sehen wir den Redaktionskalender von Nelio Content. Wir haben uns entschieden, einen A/B-Test mit zwei zusätzlichen Varianten zu erstellen: Die erste Alternative ist ein konventionelleres Bild, das ein Team von Menschen zeigt, die vor einem Laptop arbeiten. In der zweiten Option zeigten wir einen Screenshot des Redaktionskalenders, auf den wir einen Unschärfeeffekt angewendet hatten, um den Text darüber besser lesbar zu machen.
Glücklicher Mann. Stockfoto mit einem Mann und zwei Frauen, die den Inhalt ihres Computers kommentieren. Screenshot des Redaktionskalenders von Nelio Content.
War in diesem Fall irgendein Bild besser als der Rest? Was denken Sie? Wird der bärtige Herr die beiden anderen vorgestellten Bildvarianten schlagen können?
Nun, seltsamerweise gab es ein Siegerbild. Hier ist die vollständige Seite mit den Testergebnissen:

Konkret hatte das Bild mit der Menschengruppe vor dem Computer eine 25 % bessere Konvertierung als der bärtige Mann mit fast 90 % Vertrauen in die spanische Version und eine prozentuale Verbesserung von fast 15 % in der erfolgreichen englischen Version, jetzt mit einer noch höhere statistische Zuverlässigkeit von über 95 %.

Wie Sie sehen, ist es sehr schwierig zu erraten, was am besten funktioniert, wenn Sie keinen A/B-Test erstellt haben, um Ihre Hypothesen zu bestätigen. Weitere Details zu diesem Test finden Sie hier.
Und genauso wie wir verschiedene vorgestellte Bilder testen, ist eine andere interessante Art von Test, ob es besser ist, ein Bild für ein Video zu ändern. In diesem Beitrag erläutern wir weitere Details zu diesem Experiment.
Call-to-Action-Buttons
Eine andere Art von Test, die Sie auf einer Zielseite ausprobieren sollten, ist das Testen verschiedener Arten von Call-to-Action-Buttons darauf. Sie testen die Größe der Schaltfläche, ihren Stil und ihren Text.
Nach einigen Theorien darüber, welche Farbe für einen Call-to-Action-Button am besten geeignet ist, entschied man sich, einen A/B-Test für die Farbe der Buttons auf der Landingpage von Nelio Content durchzuführen. In diesem Fall haben wir einen CSS-Styles-Test mit Nelio A/B Testing durchgeführt.
So sehen die Aktionsschaltflächen aus, wenn sie aus dem CSS-Stil-Editor für jede Variante des von uns durchgeführten A/B-Tests betrachtet werden. Zuerst haben Sie die Originalversion mit den Schaltflächen in Orange. Die anderen beiden Varianten beinhalten das CSS, um die Schaltflächen grün bzw. rot zu setzen:
Originalversion der Seite. Version mit den Aktionstasten in Grün. Version mit den Aktionstasten in Rot.
In diesem Fall war das Ergebnis, das wir erhalten haben (weitere Details zu diesem Experiment finden Sie hier), dass Grün die Farbe ist, die für unser englisches Publikum der Nelio-Inhaltsseiten am besten funktioniert. Für unser spanisches Publikum konnten wir jedoch keine Farbe finden, die besser funktioniert als die, die wir bereits hatten.
Wie erstelle ich diese A/B-Tests?
Das Erstellen eines A/B-Tests ist sehr einfach, wenn Sie ein A/B-Testing-Tool verwenden. Insbesondere wenn Sie Nelio A/B Testing, ein vollständig integriertes WordPress-Plugin, verwenden, können Sie die Varianten eines beliebigen Tests so einfach erstellen wie Änderungen an einer Seite mit dem Blockeditor vornehmen.

Darüber hinaus haben Sie, wie Sie bereits in einigen der vorherigen Bilder gesehen haben, die Ergebnisse auch in WordPress selbst und müssen keine Programmierkenntnisse haben oder ein WordPress-externes Tool verwenden.
In dieser vollständigen Anleitung erkläre ich, wie man A/B-Tests mit dem WordPress-Blockeditor erstellt.
Beginnen Sie mit der Verbesserung der Konversion Ihres E-Commerce
Die Verbesserung der Conversion in Ihrem E-Commerce ist mindestens so entscheidend wie die Steigerung der Besucherzahlen auf Ihrer Website. Zielseiten sind die Seiten, die Ihre Besucher erreichen, und es sollte Ihre Hauptpriorität sein, sie zur Konvertierung zu bewegen. Sie haben bereits gesehen, dass alle einige gemeinsame Merkmale haben, aber nur wenn Sie A/B-Tests erstellen, wissen Sie, wie Sie sie verbessern können. Wir haben einige Beispiele gezeigt, aber anstatt sie zu kopieren, stellen Sie Ihre eigenen Hypothesen auf und fangen Sie an zu experimentieren.
Unsere Erfahrung in der kontinuierlichen Erstellung von A/B-Tests hat es uns ermöglicht, den Umsatz mit sehr geringem Aufwand zu steigern. Worauf warten Sie, um die Conversion auf Ihrer Website zu verbessern?
Beitragsbild von Igor Miske auf Unsplash.