Die beste Entscheidung ist eine informierte Entscheidung, und A/B-Tests ermöglichen es dir, datengestützte Entscheidungen zur Verbesserung deiner Website zu treffen. In diesem Leitfaden lernst du die genauen Schritte zur Durchführung von A/B-Tests kennen. Solltest du das eine oder das andere Design für deine Landingpage wählen? Welches ist besser? Wie kannst du das herausfinden?
Um diese und ähnliche Fragen zu beantworten, können sich Webentwickler an die Implementierung von A/B-Tests wenden, um die beste Option zu wählen.
A/B-Tests geben dir die Möglichkeit, datengestützte Entscheidungen zu treffen und Verbesserungen an deiner Website vorzunehmen. Anstatt zu versuchen, zu raten, welche Version eines Designs mehr Konversionen generiert oder ein benutzerfreundlicheres Erlebnis schafft, kannst du dich an die Daten wenden, um eine echte Antwort zu erhalten.
Noch besser: A/B-Tests mit WordPress durchzuführen ist nicht so kompliziert und kostet kein Geld. Wenn du etwa 30 Minuten in ein paar grundlegende Einstellungen investieren kannst, kannst du deine Website mit einem einfachen visuellen Editor kostenlos testen.
In diesem Beitrag zeigen wir dir Schritt für Schritt, wie du A/B-Tests für WordPress und Elementor Inhalte mithilfe des kostenlosen Google Optimize Dienstes durchführen kannst.
Darüber hinaus stellen wir eine native WordPress Plugin Option für Elementor Benutzer vor, mit der du Split Tests aus dem Elementor Editor heraus einrichten kannst.
Bist du bereit, mit dem Testen zu beginnen? Los geht‚s!
Was ist A/B-Testing?
A/B-Testing ist der Prozess, bei dem zwei verschiedene Versionen einer Seite verschiedenen Besuchern gezeigt werden, damit du sehen kannst, welche Version der Seite besser funktioniert.
Nehmen wir zum Beispiel an, du hast einen Call to Action Button auf deiner Landingpage und möchtest, dass die Besucher diesen anklicken. Soll der Text der Schaltfläche „Konto erstellen“ oder „Kostenlose Testversion starten“ lauten? Mit A/B-Tests kannst du beide Varianten ausprobieren, um zu sehen, welche Version mehr Klicks bringt.
Je nachdem, was du testen willst und wie komplex du es machen willst, kannst du verschiedene Arten von Tests verwenden. Hier sind einige der gängigen Taktiken:
A/B-Testing der „Standard“ Test. Du kannst zwei verschiedene Versionen einer Seite gegeneinander vergleichen, um zu sehen, welche Version besser abschneidet. Du kannst auch weiter gehen und A/B/n Tests erstellen, um mehr Variationen in den Mix zu bringen.
Multivariate Tests ähnlich wie ein A/B-Test, aber ein bisschen komplizierter. Du kannst Änderungen an mehreren Abschnitten einer Seite testen und dann Variationen für alle möglichen Kombinationen dieser vielen Änderungen erstellen. Die Idee ist, dass du nicht nur siehst, welche Version der Seite besser performt, sondern dass du tatsächlich sehen kannst, welche spezifischen Änderungen den größten Einfluss hatten.
Split URL Tests du teilst den Traffic auf zwei völlig unterschiedliche URLs auf, anstatt verschiedene Versionen der gleichen Seite zu testen, wie bei einem A/B-Test oder multivariaten Test. Man könnte dies auch als „Indirekt Test“ bezeichnen.
Multi Page Test damit kannst du konsistente Änderungen über mehrere Seiten hinweg testen. Wenn du zum Beispiel einen mehrseitigen Verkaufstrichter hast, kannst du sehen, wie sich verschiedene Änderungen auswirken, wenn sie konsistent über den gesamten Trichter durchgeführt werden.
In den meisten Fällen wirst du nur mit traditioneller A/B-Tests beginnen wollen, da die anderen Testarten etwas komplizierter sein können. Du kannst jederzeit zu diesen anderen Testtypen übergehen, sobald du die Grundlagen gut verstanden hast.
Warum solltest du A/B Tests in Betracht ziehen?
Auf einer hohen Ebene ist A/B-Testing eine Möglichkeit, deine Website anhand von Daten zu optimieren. Anstatt zu raten, welche Änderung am besten funktionieren wird, kannst du den Test durchführen und erhalten eine echte Antwort.
Darüber hinaus kann das Ziel, für das du optimierst, unterschiedlich sein, was A/B Tests sehr flexibel macht.
Je nachdem, wie du deine A/B Tests einrichten, kannst du A/B Tests nutzen, um zu optimieren.
Konversionsraten siehst du, welche Varianten zu mehr Konversionen führen, was sich positiv auf dein Geschäft auswirken kann. Du kannst die Lead Generierung durch Conversions, E-Commerce Conversions und mehr testen.
Absprungraten finde es heraus, welche Varianten mehr Besucher auf deiner Website halten, anstatt sie abspringen zu lassen.
Schmerzpunkte der Besucher finde Möglichkeiten, deine Website benutzerfreundlicher zu gestalten, indem du verschiedene Möglichkeiten zur Lösung häufiger Schmerzpunkte der Besucher testest und die effektivste Variante findest.
Website Redesigns hole einige Daten, um deine Design Entscheidungen zu untermauern, damit du fundierte Entscheidungen treffen kannst.
Du kannst auch mehrere A/B Tests verwenden, um für diese verschiedenen Ziele zu optimieren. Zum Beispiel könntest du deine Landing Pages für Conversions optimieren, um deinen Umsatz und Return on Investment (ROI) zu maximieren, dabei kannst du deine Blog Seiten für Engagement optimieren, um einen Weg zu finden, die Bounce Raten auf deinen Content Seiten zu reduzieren.
Wenn du erst einmal gelernt hast, wie man A/B-Tests für WordPress Inhalte durchführt, kannst du mit diesen verschiedenen Zielen so viel experimentieren, wie du möchtest.
Wie man einen A/B-Test auf WordPress durchführt
Nun, da du weißt, warum A/B-Tests so nützlich sein können, lass uns in den eigentlichen „Wie“ Teil des A/B Testens von WordPress Seiten einsteigen.
Für dieses erste Tutorial werden wir den kostenlosen Google Optimize Dienst verwenden.
Google Optimize ist ein kostenloser Service von Google, mit dem du beliebige Inhalte und Designs auf deiner Website A/B testen kannst. Es ist nicht WordPress spezifisch, funktioniert aber hervorragend mit WordPress Sites, einschließlich Designs, die du mit Elementor erstellst.
Der Prozess des Einrichtens eines A/B-Tests mit Google Optimize kann grob in drei Teile unterteilt werden:
Erstelle deine ursprüngliche Testvariante. Wenn du die Seite, die du testen möchtest, noch nicht erstellt hast, solltest du diese erst einmal einrichten, bevor du loslegst.
Richte Google Optimize auf deiner Website ein. Dazu musst du deine Website über die Google Optimize Schnittstelle hinzufügen und einen Code Snippet auf deiner Website einfügen. Du musst auch Google Analytics verwenden, um Google Optimize zu aktivieren, also musst du das einrichten, wenn du nicht bereits Google Analytics verwenden.
Richte einen neuen A/B-Test in Google Optimize ein. Du kannst einen visuellen Editor verwenden, um deine Variante einzurichten, einschließlich der Änderung von Text und Design.
Wir werden unser Tutorial in diese drei Teile aufteilen. Fangen wir an!
Teil 1: Erstelle deine Originalvariante (falls du das noch nicht gemacht hast)
Wenn du die Seite, die du testen möchtest, bereits erstellt hast, kannst du zum nächsten Teil übergehen. Wenn du jedoch bei null anfängst, besteht dein erster Schritt darin, das Design zu erstellen, das du testen möchtest.
Dies wird die Basis für deinen Test sein und du kannst später in diesem Tutorial eine oder mehrere Varianten hinzufügen.
Um deine ursprüngliche Seite zu erstellen, kannst du einfach Elementor wie gewohnt verwenden. Du kannst deine Seite entweder aus einer leeren Leinwand erstellen oder mit einer der vielen mitgelieferten Vorlagen von Elementor beginnen.
Sobald du deine Seite erstellt hast, stelle sicher, dass du sie veröffentlichst, damit sie öffentlich zugänglich ist – dies wird wichtig sein, wenn du Google Optimize einrichtest.
Teil 2: Füge Google Analytics und Google Optimize zu deiner Website hinzu
Bevor du mit der Erstellung von A/B-Tests mit Google Optimize beginnen kannst, musst du zunächst:
- Füge deine Website zu Google Optimize hinzu.
- Füge den Codeschnipsel, den du von Google Optimize erhältst, in den Abschnitt deiner Website ein.
Um Google Optimize zu verwenden, musst du auch Google Analytics verwenden. Wenn du also deine WordPress Site noch nicht mit Google Analytics eingerichtet hast, musst du dies ebenfalls tun, bevor du zum Teil von Google Optimize bist. Der Prozess ist ähnlich wie bei Google Analytics, du musst deine Website zunächst über die Google Analytics Schnittstelle hinzufügen und dann ein Code Snippet zu deiner WordPress Website hinzufügen. Es gibt viele Möglichkeiten, wie du die Code-Snippets für beide Sites hinzufügen kannst. Für fortgeschrittene Benutzer kannst du die Code Snippets manuell hinzufügen. Oder, für Leute, die keinen Code verwenden möchten, kannst du ein Plugin verwenden. Es gibt mehrere Plugins, die sowohl Google Analytics als auch Google Optimize unterstützen. Hier sind einige der besten:
- GA Google Analytics
- Offizielles Google Site Kit Plugin
- MonsterInsights
Für diesen Teil werden wir das kostenlose GA Google Analytics Plugin verwenden, weil es leichtgewichtig ist und den Prozess ziemlich einfach macht. Du kannst jedoch auch ein anderes Plugin oder die manuelle Methode wählen.
1. Einrichten der Google Analytics Universal Analytics Eigenschaft
Wenn du deine Website noch nicht mit Google Analytics eingerichtet hast, musst du dies tun, bevor du Google Optimize hinzufügen kannst.
Um loszulegen, musst du bei Google Analytics einloggen und dich bei deinem Konto anmelden. Folge dann den Anweisungen hier, um eine Universal Analytics Eigenschaft zu erstellen.
Es ist sehr wichtig, dass du die Universal Analytics Version von Google Analytics verwendest, da du das neue Google Analytics 4 derzeit nicht mit Google Optimize verknüpfen kannst.
Um eine Universal Eigenschaft zu erstellen, musst du die erweiterten Optionen anzeigen, wenn du deine Eigenschaft einrichtest. Du kannst dann den Kippschalter verwenden, um die universelle Option zu aktivieren:
Sobald du die Eigenschaft erstellt hast, sollte Google Analyticsdir einen Bildschirm zeigen, der deine Tracking-ID enthält. Halte diese griffbereit, da du sie zum Einrichten deiner WordPress Site benötigst:
Wenn du das Google Analytics Plugin GA verwendest, musst du nur deine GA Tracking ID in den Einstellungen des Plugins einfügen.
Stelle sicher, dass du die richtige Trackingmethode auswählst, nämlich Universal Analytics:
Hinweis: Wenn du Google Analytics bereits in der Vergangenheit zu deiner Website hinzugefügt hast, ist es sehr wahrscheinlich, dass du bereits die Option „Universal Analytics“ verwendest, es sei denn, du hast deine Website erst in den letzten paar Monaten erstellt.
2. Erstelle einen Google Optimize Container und füge ein Code Snippet hinzu
Als Nächstes musst du deine Website zu Google Optimize hinzufügen und dann den Code Snippet, den du erhältst, zu deiner WordPress Website hinzufügen.
Rufe die Google Optimize Website auf und melde dich mit deinem Google Konto an.
Du solltest dann eine Aufforderung sehen, ein Konto zu erstellen, klicke auf die Schaltfläche „Konto erstellen“:
Nun wirst aufgefordert, einen Container zu erstellen. Gebe den Namen deiner Website oder den Domainnamen als Containernamen ein und klicke dann auf Erstellen:
Hier musst du ein paar Dinge tun.
Zunächst klicke auf die Schaltfläche mit Analytics verknüpfen, um deinen Google Optimize Container mit der Eigenschaft deiner Website in Google Analytics zu verknüpfen. Dadurch kann Google Optimize Daten über deine Testvarianten sammeln:
Wenn Google Optimize die Eigenschaft nicht verknüpfen lässt, hast du möglicherweise versehentlich eine Google Analytics 4 Eigenschaft erstellt, anstatt die Universal Tracking Methode zu verwenden. Gehe zurück zum vorherigen Schritt und stelle sicher, dass du die Google Analytics Universal Tracking Eigenschaft eingerichtet haben.
Als Nächstes musst du das Google Optimize Code Snippet installieren, das du unter Setup Anweisungen siehst:
Du musst dieses Snippet in den Abschnitt deiner WordPress Website einfügen. Wenn du das Google Analytics Plugin GA verwendest, kannst du dies tun, indem du zu Einstellungen Google Analytics gehst und das Google Optimize Snippet in das Feld „Custom Code“ einfügst. Vergewissere dich, dass der Speicherort des Trackingcodes auf den Seitenkopf eingestellt ist und aktiviere außerdem das Feld Benutzerdefinierter Code Speicherort, damit deine Website das Google Optimize Skript zuerst lädt: Später werden wir ein Diagnosetool vorstellen, das Google Optimize anbietet, um sicherzustellen, dass du das Code-Snippet richtig einrichtest. Aber für den Moment solltest du bereit sein, wenn du diese Anweisungen befolgt hast.
Teil 3: Einrichten eines A/B-Tests in Google Optimize
Jetzt kannst du damit beginnen, deine Testvarianten zu erstellen. Google Optimize nennt jeden Test eine „Erfahrung.“ Sobald du ein Erlebnis erstellt hast, kannst du deine Testvarianten einrichten.
Bevor du beginnst, solltest du sicherstellen, dass du den Chrome Browser verwendest. Außerdem solltest du die offizielle Google Optimize Chrome Erweiterung installieren, mit der du den visuellen Editor von Google Optimize zum Einrichten deiner Testvarianten verwenden kannst.
1. Erstelle ein Erlebnis
Wenn du deine Website in Google Optimize öffnest, solltest du eine Aufforderung sehen, dein erstes Erlebnis zu erstellen, indem du auf „Let‚s go“ klickst:
Daraufhin öffnet sich ein Slide out:
Gebe deinem Experiment einen Namen: beispielsweise „Testen verschiedener CTA Buttons.“
Gebe die URL der Seite ein, die du testen möchtest.
Wähle als Erfahrungstyp „A/B-Test.“ Du kannst später mit verschiedenen Testtypen experimentieren, aber wir halten die Dinge erst einmal einfach.
Dann befindest du dich im Dashboard für dein Erlebnis.
2. Erstelle eine Variante
Im Erlebnis Dashboard solltest du eine Aufforderung zum Erstellen einer neuen Variante sehen – Variante hinzufügen, um loszulegen:
Gebe dein im Slide Out einen Namen und klicken Sie auf „Fertig.“
Du solltest dann in der Liste der Varianten angezeigt werden. Um die Designänderungen vorzunehmen, klicke auf die Schaltfläche „Bearbeiten“:
Dadurch wird der visuelle Editor gestartet, der ähnlich wie Elementor funktioniert. Um den Inhalt oder das Design eines Elements zu ändern, kannst du es anklicken, um seine Einstellungen zu öffnen.
Den Text der Schaltfläche von „Get Started“ in „Download Now“zu ändern, würdest du auf die Schaltfläche klicken und „Edit Element“ auswählen, um den Text oder HTML bearbeiten zu können:
Bei einigen Elementen kann es schwierig sein, Text direkt zu bearbeiten, daher musst du manchmal ein Element als HTML bearbeiten und den Inhalt auf diese Weise ändern.
Du kannst so viele Änderungen vornehmen, wie du möchtest. Klicke einfach auf die Schaltfläche „Speichern“, wenn du fertig bist. Klicke dann auf Fertig, um zur Google Optimize Oberfläche zurückzukehren und dein A/B-Test abzuschließen.Im Erlebnis Dashboard solltest du eine Aufforderung zum Erstellen einer neuen Variante sehen – Variante hinzufügen, um loszulegen:
Gebe dein im Slide Out einen Namen und klicken Sie auf „Fertig.“
Du solltest dann in der Liste der Varianten angezeigt werden. Um die Designänderungen vorzunehmen, klicke auf die Schaltfläche „Bearbeiten“:
Dadurch wird der visuelle Editor gestartet, der ähnlich wie Elementor funktioniert. Um den Inhalt oder das Design eines Elements zu ändern, kannst du es anklicken, um seine Einstellungen zu öffnen.
Den Text der Schaltfläche von „Get Started“ in „Download Now“zu ändern, würdest du auf die Schaltfläche klicken und „Edit Element“ auswählen, um den Text oder HTML bearbeiten zu können:
Bei einigen Elementen kann es schwierig sein, Text direkt zu bearbeiten, daher musst du manchmal ein Element als HTML bearbeiten und den Inhalt auf diese Weise ändern.
Du kannst so viele Änderungen vornehmen, wie du möchtest. Klicke einfach auf die Schaltfläche „Speichern“, wenn du fertig bist. Klicke dann auf Fertig, um zur Google Optimize Oberfläche zurückzukehren und dein A/B-Test abzuschließen.
3. Konfiguriere weitere Einstellungen und führe die Diagnose aus
Sobald du den visuellen Editor verlässt, solltest du dich wieder in der Google Optimize Oberfläche befinden. Du kannst in diesem Bereich nach unten scrollen, um weitere Einstellungen nach Bedarf zu konfigurieren.
Du kannst zum Beispiel weitere Varianten hinzufügen, die Gewichtung des Traffics zwischen den Varianten ändern, nur bestimmte Nutzertypen ansprechen und vieles mehr.
Stelle sicher, dass du in den Einstellungen für die Ziele ein primäres Ziel auswählst, da dies das ist, was Google Analytics zwischen den Varianten messen wird. Du kannst benutzerdefinierte Ereignisse einrichten, um Schaltflächenklicks zu verfolgen, oder du kannst generische Dinge wie die Absprungrate testen.
Im unteren Bereich der Einstellungen siehst du außerdem eine Aufforderung zur Überprüfung der Installation, mit der du überprüfen kannst, ob du das Google Optimize Code Snippet korrekt installiert hast.
Wenn du einen Werbeblocker verwendest, stelle sicher, dass du den Werbeblocker auf der Website deaktivierst, auf der du die Tests durchführst, bevor du die Diagnose ausführst. Google Optimize öffnet die eigentliche Website in deinem Browser, um die Diagnose auszuführen, wenn du also einen Werbeblocker aktiviert hast, könnte der Werbeblocker das Google Optimize Skript blockieren und deine Website wird bei der Diagnose „durchfallen“, selbst wenn du das Skript richtig installiert hast.
Erspar dir also etwas Frust und stelle sicher, dass du deinen Werbeblocker deaktiviert hast, bevor du dich auf die Suche nach dem Fehler machst.
4. Starte deinen Test
Nachdem du die Einstellungen vorgenommen hast, scrolle zurück an den Anfang der Seite und klicke auf die Schaltfläche Start, um dein A/B-Test zu starten:
Oder du klickst auf das Uhren-Symbol links, um den Test für einen Zeitpunkt in der Zukunft zu planen.
Du siehst dann ein Pop-up zur Bestätigung. Klicke erneut auf Start, um den Test live zu schalten.
Und das war‚s! Du hast gerade dein erstes WordPress A/B-Testing Experiment gestartet. Standardmäßig fügt Google Optimize ein Ablaufdatum hinzu, das vier Wochen in der Zukunft liegt. Du kannst deinen Test jederzeit manuell früher beenden, indem du auf die Schaltfläche „Beenden“ klickst und du kannst die Leistung des Experiments auf der Registerkarte „Berichte“ anzeigen:
Eine native WordPress A/B Testing Option für Elementor Nutzer
Google Optimize funktioniert für A/B-Tests aller Arten von WordPress Inhalten. Das schließt deine Elementor Designs ein, aber es funktioniert auch mit Inhalten aus dem regulären WordPress Editor, deinem Theme und allem anderen, was du verwenden könntest.
Wenn du jedoch speziell A/B-Tests für Elementor Inhalte durchführen möchtest, gibt es auch ein spezielles Plugin, mit dem du das tun kannst und das einen viel einfacheren Einrichtungsprozess hat, Split Test For Elementor.
Split Test For Elementor ist ein Drittanbieter Plugin von einem anderen Entwickler, sodass das Elementor Team keine direkte Kontrolle darüber hat. Aber es ist gut bewertet und zum Zeitpunkt, an dem wir diese Anleitung schreiben, voll funktionsfähig.
Es gibt eine kostenlose Version auf WordPress.org, allerdings benötigst du die Premium-Version, wenn du das Seiten Caching für die Designs, die du A/B-Tests unterziehst, aktivieren möchtest.
Hier: wie du es verwendest:
1. Erstelle einen neuen Test
Sobald du das Plugin aktiviert hast, kannst du zu Split Test? Test hinzufügen, um einen neuen Test zu erstellen:
- Elemente: teste verschiedene Elemente auf der gleichen Seite.
- Seite: teste völlig unterschiedliche Seiten gegeneinander.
Sobald du deinen Testtyp ausgewählt hast, musst du Namen für zwei oder mehr Variationen eingeben, ebenso wie die Art und Weise, wie du den Traffic aufteilen möchtest.
Darunter kannst du dein Conversionziel festlegen, das eine interne oder externe Seite ist:
2. Test in Elementor einrichten
- Sobald du deinen Test erstellt hast, öffne den Elementor Editor für das Design, das du A/B testen möchtest.
- Öffne dann die Einstellungen für die ursprüngliche Variante des Elements, das du testen möchtest z. B. ein Button Widget. Wenn du auf die Registerkarte erweitert gehst, siehst du eine neue Option Split Test.
- Wähle den Split Test, den du im vorherigen Schritt erstellt hast und weise dann das Elementor Widget/den Elementor Abschnitt einer der Split Test Varianten zu.
- Jedes Element, das dieser Variation zugewiesen wird, wird nur in dieser spezifischen Variation angezeigt:
- Erstelle nun das/die andere(n) Element(e), das/die du für die andere(n) Variante(n) verwenden möchtest und folge denselben Schritten, um sie verschiedenen Varianten zuzuweisen.
- Wenn du z. B. zwei verschiedene Schaltflächen A/B testen würdest, würdest du im Elementor Editor tatsächlich zwei Schaltflächen sehen:
- Da du jedoch jeden Button einer anderen Variante zugewiesen hast, sehen deine Besucher*innen immer nur einen Button.
- Stelle sicher, dass du die Änderungen an deinem Elementor Design speicherst, wenn du fertig bist.
3. Test Ergebnisse anzeigen
Jetzt ist dein Test live. Um zu sehen, wie es läuft, gehe zum Split Test Bereich in deinem Dashboard und klicke auf den Statistik-Button neben deinem Test.
Du siehst dann die grundlegenden Conversionrate Daten für jede Variante:
Implementiere A/B-Tests, um das ansprechendste Design für deine Besucher*innen zu finden.
Insgesamt ist das A/B-Testing in WordPress eine großartige Möglichkeit, deine Website anhand echter Daten zu verbessern.
Der häufigste Anwendungsfall ist die Verwendung von A/B-Tests, um die Konversionsraten deiner Lead Capture Formulare oder Landingpages zu verbessern, aber du kannst A/B-Tests auch verwenden, um Absprungraten zu reduzieren, Benutzer Schmerzpunkte zu lösen und ansonsten einfach eine effektivere Website zu erstellen.
Wenn du WordPress und Elementor verwendest, ist eine der flexibelsten A/B-Testing Lösungen die Nutzung des kostenlosen Google Optimize Dienstes. Die Einrichtung deiner Website mit Google Optimize ist ein wenig gewöhnungsbedürftig. Aber sobald du es zum Laufen gebracht hast, kannst du mit dem visuellen Editor von Google Optimize leicht neue Testvarianten erstellen.
Für eine Elementor spezifische Option kannst du auch das Drittanbieter-Plugin Split Test for Elementor in Betracht ziehen. Dieses Plugin ist nicht ganz so flexibel, da es nur begrenzte Conversion Ziele testen kann, aber es ist einfacher zu bedienen und du kannst deine Varianten mit dem regulären Elementor Editor einrichten.
Hast du noch Fragen zu A/B-Tests für WordPress? Frag uns in den Kommentaren und wir werden versuchen zu helfen!
Übersetzt von Nata Uchava
Von Website Freiburg
Quellen, unsere Websoftware Partner Elementor Pro:
www.elementor.com/blog/a-b-testing/
