von René Link

A/B-Testing braucht Qualitätssicherung: 5 Tipps, um Umsatzverluste zu vermeiden

 

Ok, es hat zwar ein bisschen länger gedauert, aber dafür stimmt dieses Mal jedes Testing-Detail.

Und dann: 10% Downcast!

Warum, es war doch alles perfekt?

Die harte Realität: Ein Test, der nicht qualitätsgesichert wird, ist ein echtes Risiko.

Aus dem Business-Alltag wissen wir, dass eine fehlende Qualitätssicherung (QS) schnell mal für Umsatzverluste sorgen kann.

Folglich lässt auch der deutsche Online-Handel jährlich zig Millionen durch lückenhafte QS liegen.

Aus diesem Grund widmen wir uns bei konversionsKRAFT in diesem Beitrag der Qualitätssicherung beim A/B-Testing.

Ein Thema, welches leider noch zu häufig ein Dasein als Randerscheinung fristet, obwohl:

Qualitätssicherung beim A/B-Testing ist weitaus mehr als: „Suche die 5 Unterschiede zwischen den beiden Bildern.”

3 kritische Probleme infolge mangelnder Qualitätssicherung

Auf der Suche nach dem Fehler für den 10% Downcast findet schließlich jemand eine Anomalie in den Auswertungszahlen des Testingtools. Bei einer genauen Segmentierung wird klar: in zwei Browsern hat die Variante signifikant schlechter abgeschnitten.

Doch der Umsatz ist zusammen mit dem verbrannten Traffic bereits verloren gegangen und die Opportunitätskosten sind gestiegen.

Ein kurzer Blick in die entsprechenden Browser gibt Gewissheit: die Variante ist kaputt, unbrauchbar, hier möchte – und kann – kein Kunde kaufen.

Auf die Frage hin, warum das nicht geprüft wurde, kommt nur ein:

„Also in meinem Browser sah es gut aus“.

Das sah der Entwickler:

Qualitätssicherung E-Commerce AB Testing

Das sahen 10% der Kunden:

Qualitätssicherung AB Test aus Sicht des Kunden

 

Dabei ist der Aufwand einer guten Qualitätssicherung im Vergleich zu anderen Schritten eines A/B-Testing-Projekts gar nicht so hoch, entscheidet aber genauso über das Gelingen oder Scheitern wie ein strategisches Experimentation Framework.

 

Problem 1: Wirtschaftlicher Schaden, da Elemente der Seite beschädigt wurden

Dies ist wohl der Worst Case. Es kann durchaus vorkommen, dass gewisse fehlerbehaftete Umbauarbeiten in Varianten z.B. ein Fortschreiten im Checkout-Prozess verhindern, oder dass eine Call to Action einfach nicht mehr angezeigt wird. Der Kunde wird an dieser Stelle verwundert oder verärgert sein und verlässt den Shop – vielleicht für immer.

 

Problem 2: Falsche Testergebnisse durch Fehler in den Varianten

Es gibt eine Menge an optischen und funktionellen Abweichungen, die auftreten können. Dadurch kann es passieren, dass ein durch die Hypothese prognostizierter Effekt nicht eintritt oder ein anderer ungewollter Effekt an dessen Stelle eintritt.

 

Problem 3: Falsche Testergebnisse durch Fehler in der Messung der Goals

Neben der optischen und funktionalen Prüfung der Varianten muss natürlich auch sichergestellt werden, dass die im Testingtool definierten Goals richtig eingerichtet wurden, und entsprechend auslösen. Mögliche Folge einer fehlerhaften Zielmessung ist, dass ein eigentlich erfolgreicher Test nicht als solcher ausgewiesen wird.

 

Typische Fehler:

  • Es wird vergessen, Goals in eine Variante einzufügen.
  • Goals werden zwar eingerichtet, lösen aber nicht korrekt aus, weil sich z.B. ein Tippfehler oder ein Copy/Paste-Fehler eingeschlichen hat, der verhindert, dass das Goal im Testingtool gemessen und angezeigt wird.
  • Goals sind eingerichtet, aber die Zuordnung ist vertauscht. Dann lösen die Goals zwar alle aus, aber nicht bei der Aktion, für die sie eigentlich eingerichtet sein sollen.
  • Goals lösen mehrfach aus.
  • Es wird ein Event Goal auf eine CTA gelegt. Dabei wird jedoch nicht berücksichtigt, dass z.B. am Ende der Produktdetailseite eine Kopie der CTA liegt oder es neben der CTA noch andere Links gibt, die einen Artikel in den Warenkorb legen. Es kann also passieren, dass es mehr Warenkorbaufrufe (Page View Goals) gibt als ausgelöste CTAs (Event Goal). Die dabei entstehende Differenz sorgt für Verwirrung und führt möglicherweise dazu, dass die Testergebnisse nicht richtig interpretiert und somit falsche Schlüsse gezogen werden.
  • Micro Conversions werden nicht als Testing-Goal bestimmt.

Beispiele: Was deine Qualitätssicherung vor einem A/B-Test prüfen sollte

Neben der Überprüfung der optischen Konsistenz sowie dem Korrekturlesen neuer Inhalte, existieren wiederkehrende Topics, die vor einem Test geprüft werden sollten:

  1. Darstellungsfehler (optische Bugs, Z-Index-Fehler…)
  2. Rechtschreibfehler (Tippfehler, uneinheitliche Schreibweisen…)
  3. Logikfehler
  4. Fehler durch vernachlässigte Szenarien (Sonderfälle, ungewöhnliches Nutzerverhalten, abweichende Bildschirmgrößen…)

 

1. Darstellungsfehler

Darstellungsfehler im Onlineshop

 

Nicht jeder Browser beherrscht bei Bildern die Größenveränderungen (z.B: Verkleinerung der Thumbnails auf der Produktdetailseite). Es entstehen anschließend sog. Moiré Effekte, die besonders bei gemusterten Produkten unschön wirken.

 

Darstellungsfehler im E-Commerce

 

Sehr beliebt sind Z-Index-Fehler.

Elemente sind zwar korrekt programmiert, werden jedoch in Kombination mit bereits bestehenden Seitenelementen nicht richtig angezeigt.

Überlappungen von Menu und Ankerlinks

Überlappungen von Menu und Ankerlinks

 

Überlappungen der Felder

Überlappungen der Felder im E-Commerce Onlineshop

2. Rechtschreibfehler

Hier hat sich ein Buchstabendreher eingeschlichen, ausgerechnet bei der hervorgehobenen Vorteilskommunikation, die im Test verprobt werden soll:

Darstellungsfehler bei der Anzeige von Langlebigkeit der Materialien

 

oder hier:

Vervollständigen Sie den Look Darstellungsfehler

 

Es gibt wechselnde Ansprachen in gleichen Elementen.

Darstellungsfehler bei Schon gewusst Anzeige

 

In einer Umfrage wurde Du/Dir bzw. du/dir usw. nicht einheitlich groß oder klein geschrieben:

 

Darstellungsfehler Groß- und Kleinschreibung

 

3. Logikfehler

In diesem Beispiel wurde eine Filteroption für Größen hinzugefügt.

Das Problem: Es existieren auch Artikel, die keine Größenangabe besitzen bzw. nur in einer Einheitsgröße vorhanden sind. Der Filter wird bei diesen Artikeln dennoch angezeigt, sieht aber fehlerhaft aus und fordert den Kunden zu einer Aktion auf, die nicht möglich ist.

Darstellungsfehler bei Größenauswahl

Hier gibt es eine Fehlermeldung, weil die Person ihre Mailadresse nicht eingetragen hat. Allerdings gibt es das hierfür notwendige Eingabefeld gar nicht.

Fehler beim Formular des Checkouts

Nachfolgend doppelt sich das Element, sobald man die Anzahl erhöht.

 

Usability Fehler bei Mengenauswahl

Auch hier bringt jede Änderung eine neue Fehlermeldung hervor, ohne die alte zu löschen.

 

Usability Fehler wird mehrmals angezeigt

„Eine Frage der Reihenfolge”… wenn beide Felder rot sind, kann das obere nicht zuerst ausgefüllt werden. Das funktioniert erst, nachdem das untere Feld ausgefüllt wurde.

 

User Experience Fehler

 

4. Fehler durch vernachlässigte Szenarien

Hier arbeitet ein User mit einer Bildschirmauflösung von 1600×900 px – dabei wird die CTA des Warenkorb-Layers nicht mehr angezeigt, sondern muss „erscrollt” werden.

Was der Kunde sah

UX Fehler in einem Onlineshop

 

Was der Designer sah

Umsatzverlust durch fehlendes AB Testing

Ein Rondell aus Produktbildern funktioniert nicht, wenn es nur ein Produktbild gibt.

 

Fehler bei Rondell Anzeige mit nur einem Bild

 

Die Einführung eines Sale-Banners ist eine gute Idee.

Es wurde jedoch nicht berücksichtigt, dass bei Markenprodukten der Markenname in der oberen rechten Ecke steht und vom Sale-Banner nun überdeckt wird.

UX Fehler: Sale Banner überdeckt Markenlogo

 

Auch hier gibt es einen Ersparnis-Banner. Dieser ragt in der Kategorieseite über die Bilder der Artikel hinaus. Bei den obersten Produkten kollidiert dieser Badge allerdings mit der Tab Navigation.

Usability Fehler Überlappen des Sales mit Kategorien

 

Das nächste Konzept sieht eine Änderung der Kacheln auf einer Kategorie vor. Was hierbei nicht berücksichtigt wurde, ist, dass man die Ansicht der Kacheln auch ändern kann, und die Änderungen in dieser Ansicht leider kaputt zu sehen sind.

Usability Fehler Produktbilder

 

Wenn Produkte nicht bestell- und abholbar sind, sollte ein bestimmter UVP lieber nicht ausgespielt werden:

E-Commerce Fehler durch mangelnde Qualitätssicherung

 

Zu kleiner Viewport beim iPhone SE: Ein Element wird nach Auswahl gefettet und erzeugt dadurch einen Umbruch. In Folge sind die Elemente nicht mehr gleich hoch und wirken ungeordnet.

Usability Fehler ohne AB Testing

Qualitätssicherung im Alltag: Tipps, damit Testing & QS gelingen

Wichtig ist es, dass die Qualitätssicherung als essentieller Prozessschritt eines A/B-Tests bereits in der Planung berücksichtigt wird.

Faktoren, die eine gut funktionierende Qualitätssicherung beeinflussen:

  • Die menschliche Ressource: Schule dein QS Personal bzw. die Verantwortlichen. Gib ihnen den nötigen Raum, auch eigene Testszenarien zu entwickeln und zu prüfen. Sie sollen den nötigen Raum erhalten, Testumgebungen kritisch zu hinterfragen sowie auf Sinnhaftigkeit und Verständlichkeit zu achten.
  • Präventive Kontrolle: Nutze auf jeden Fall das Vier-Augen-Prinzip. Projektbeteiligte feedbacken sich gegenseitig und schalten erst danach einen A/B-Test live.
  • Teststart: Sorge dafür, dass nicht “nur noch schnell mal jemand drüber schaut”, sondern gib einer ordentlichen QS den nötigen Raum, auch wenn sich der Teststart dadurch leicht verzögert.
  • Testplan: Dokumentiere den Soll-Zustand, mit dem deine Qualitätssicherung die Umsetzung abgleichen kann. Halte in einem Testplan fest, was die einzelnen Varianten des Tests auf der Seite ändern und wie diese Änderungen im Detail aussehen sollen.
  • Whitelist: Schaffe eine Whitelist und dokumentiere eine verbindliche Auflistung aller in der Qualitätssicherung zu überprüfenden Endgeräte sowie Browser.
  • Testkonzept: Behandle in deinem Konzept nicht nur ein Idealszenario, sondern überdenke auch mögliche Ausnahmen oder Extremfälle.
  • Hardware: Stelle sicher, dass du Zugang zu einer Hardware verfügst, die dir den Test auf allen relevanten Browsern anzeigen kann.

 

Ein guter Qualitätssicherer hat die Mission, die oben genannten Punkte mit zu etablieren.
Die folgenden Aufgaben sind entscheidend für einen erfolgreichen Qualitätssicherungsprozess:

 

1. Unterschiedliche Testszenarien je Anwendungsfall entwickeln

Je nachdem, welche Art Test geplant wird, sollten verschieden Testszenarien durchdacht werden.

Ein Produktdetailseitentest erfordert z.B. eine andere Vorgehensweise als ein Test im Checkoutprozess.

  • Im Produktdetailseitentest werden überwiegend interaktive Elemente wie Größen und Farbwahl geprüft.
  • Im Checkout werden dagegen die einzelnen Prozessschritte vor- und zurückgeschaltet sowie die Formularfelder geprüft.

 

2. Performance prüfen

Je nach Ladeverhalten der Seiten kann ein testbedingter Umbau zu sehr unschönen Effekten führen. Scroll-, Slider- und Zoomeffekte sollten nicht nur auf verschiedenen Seiten, sondern auch in den verschiedenen Browsern gründlich getestet werden. Tipps zu komplexen Umbauten gibt unser Kollege Max Vith in seinem Artikel “Checkliste: 15 einfache Dinge für reibungslose A/B-Tests”.

 

3. Goals auslösen und Segmente prüfen

Bevor der Test live geschaltet wird, muss überprüft werden, ob die Goals im Testingtool auch so auslösen, wie es vom Konzept her gewünscht ist. Dabei sollten nicht nur die Testvarianten überprüft werden, sondern auch die Kontrollvariante! Bei komplexen Tests sollte auch genau und einzeln geprüft werden, ob jede Aktion das jeweils gewünschte Goal auslöst – es reicht dann nicht aus, einmal über die Seite zu gehen, alles einmal anzuklicken, und am Ende zu schauen, ob im Tool alle Goals ausgelöst haben.

 

4. Fehler forcieren

Gibt es Fehlermeldungen oder Hinweise, die korrekt platziert werden müssen, damit der Kunde nicht die Orientierung verliert? Gerade bei Formularen sollte man immer versuchen zu prüfen, was passiert, wenn man fehlerhafte Eingaben macht. Werden Fehler korrekt angezeigt, gibt es genügend Hinweise? Auch die optische Platzierung und Reihenfolge von Fehlermeldungen muss bei einem Formularumbau berücksichtigt werden.

 

5. Untypisches Verhalten simulieren (Doppelklicks, Hin- und Hernavigieren…)

Hier ist die Kreativität des Qualitätssicherers gefragt.

Was passiert eigentlich, wenn ich im letzten Schritt des Checkout-Prozesses die Sprache auf Englisch stelle? Oder einen leeren Gutscheincode versuche zu bestätigen?
Dabei ist es wichtig, davon auszugehen, dass der User zu Hause am Bildschirm kein „Musteruser” ist, der den Prozess ordentlich, fehlerfrei und Schritt für Schritt durchgeht.

Auch kann es sein, dass Funktionalitäten nicht als solche erkannt werden, dass z.B. auf ein Navigationselement doppelt geklickt wird, obwohl ein einfacher Klick genügt hätte.

Auch das Vor- und Zurücknavigieren im Browser, über Breadcrumbs, Prozessleisten etc., muss genau geprüft werden.

Gerade Änderungen im Checkout erfordern oft eine Prüfung des Prozesses bis zum simulierten Kaufabschluss (Testbestellungen in verschiedenen Szenarien auslösen). Je nach Test kann es auch notwendig sein, Testbestellungen mit verschiedenen Zahl- und Lieferarten durchzuführen, um sicherzugehen, dass der Test in keinem Szenario einen Fehler produziert.

Nutze dafür einen Testaccount, über den du Bestellungen durchführen kannst.

 

Qualitätssicherung im Testing ist essentiell

Eine nicht korrekt ausgespielte Variante kann die Seite unbrauchbar machen und im schlimmsten Fall den Kunden für immer vergraulen.

Deshalb muss sorgfältig geprüft werden, ob Varianten optisch und technisch korrekt umgesetzt werden.

Ein kurzer Blick ist nicht ausreichend, deshalb:

  1. Plane deine Qualitätssicherung im Vorfeld mit ein (Ressourcen, Budget..)
  2. Erstelle einen Testplan, bzw. ein genaues Testkonzept
  3. Wäge vor der Umsetzung ab, welche Browser und Szenarien in deinem Test nicht berücksichtigt werden sollten und schließe diese gezielt aus
  4. Prüfe im Gegenzug die Varianten in allen Browsern, die im Test eingeschlossen sind (z.B. auch Tablets und Smartphones
  5. Arbeite nach dem Vier-Augen-Prinzip
  6. Berücksichtige mögliche Fehlertypen, und provoziere kreativ deine Testvarianten
  7. Kontrolliere, ob alle Goals richtig eingerichtet wurden, und das Testingtool korrekt misst, was es messen soll – auch die Kontrollvariante

Herzlichen Dank an unser gesamtes QS-Team beim aktiven Mitwirken an diesem Beitrag.

René Link

René Link

René Link, Jahrgang 1976, Dipl. Media System Designer, ist Head of Quality Management bei konversionsKRAFT - Deutschlands führende Agentur für Conversion Optimierung.
Frage zum Artikel? Frag den Autor!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.