Blog - Mr Suricate

WAS IST EIN GRAFISCHER NICHTREGRESSIONSTEST UND WARUM SOLLTE MAN IHN DURCHFÜHREN?

Verfasst von Mr Suricate | 30. März 2022 09:00:00

Es gibt nicht nur funktionale Tests im Leben! Es gibt auch grafische Nichtregressionstests, auch bekannt als grafische Vergleichstests, die sehr wichtig sind, um die visuelle Qualität Ihrer Website oder Anwendung zu überprüfen. Aber was genau ist das? Wir erklären es Ihnen. 

92,6 % der Nutzer sagen, dass das Design der Website und die visuellen Darstellungen die Hauptfaktoren für die Kaufhandlung sind, so die neueste Infografik von Voucher Cloud. Aber wie sieht es mit Abbrüchen aufgrund von Darstellungsproblemen aus? Versetzen Sie sich zwei Minuten lang in die Rolle eines Internetnutzers. Sie surfen gerade auf einer Website und suchen nach einem neuen Fahrrad, um das schöne Wetter zu genießen und lange Ausflüge zu machen, als plötzlich... ein großer Fehler dazu führt, dass alle Fotos der Fahrräder übereinander liegen und die Anzeige unleserlich wird. Oder Sie haben sich in Ihr Traumfahrrad verliebt, finden aber nirgends die Schaltfläche, mit der Sie es in den Warenkorb legen können. Das ist doch ein sehr großes Hindernis, oder? Und genau hier liegt der Sinn, regelmäßig grafische Nichtregressionstests durchzuführen. 

Voucher Cloud

Aber was ist ein grafischer Nichtregressionstest (NRT)?

Mit grafischen Vergleichstests oder visuellen Tests (ja, so viele verschiedene Deklinationen für ein und dieselbe Sache) wird überprüft, ob die Website oder die mobile Anwendung für alle Nutzer richtig angezeigt wird. Im Wesentlichen geht es darum, sicherzustellen, dass jedes Element (Schaltflächen, Texte, Fotos, Bilder...) auf einer Seite an der richtigen Stelle, in der richtigen Größe/Farbe/Form usw. erscheint. Man spricht von Vergleich oder Nichtregression, da diese Tests verwendet werden, um zu überprüfen, ob die Website oder mobile Anwendung ihrer Vorgängerversion pixelgenau (pixel perfect) gleicht und ob sie den gesetzlichen/rechtlichen Anforderungen entspricht. 

Grafikvergleichstests gehören zu den Tests, die sich mit den heutigen Technologien leicht automatisieren lassen. Aber wie funktioniert das? Im Rahmen der Testautomatisierung bedeutet dies, dass Screenshots, die bei der Ausführung von Szenarien gemacht werden, generiert, analysiert und verglichen werden, um festzustellen, ob sich Elemente auf visueller Ebene verändert oder bewegt haben. Durch die Konfiguration eines zulässigen Toleranzprozentsatzes bewertet die Lösung die Ähnlichkeit zwischen dem Referenzbild und dem Bild der aktuellen Ausführung. 

Ein einfacher, unerwünschter Farbwechsel in einer Schaltfläche, ein Versatz im Layout oder gar ein Unterschied in einer Schriftart reichen aus, um das Testszenario für den Grafikvergleich zum Scheitern zu bringen. Wir können auch das Beispiel eines Kunden von Mr Suricate bei dem die Kundenbewertungen nicht mehr angezeigt wurden und der Grafikvergleichstest diesen Fehler aufdecken konnte. 

Darüber hinaus können Sie mithilfe von grafischen Nichtregressionstests (NRT ) auch die in einigen Ländern (z. B. USA und asiatische Länder) vorgeschriebenen gesetzlich vorgeschriebenen Anzeigen überprüfen, um die Anforderungen zu erfüllen.

Warum sollte man grafische Nichtregressionstests durchführen? 

Und warum nicht? Zugegeben, die Antwort ist ein bisschen einfach und das ist nicht das, was diesen Artikel füttern wird, oder? In Wirklichkeit gibt es viele Gründe für visuelle Tests. 

Zunächst könnte man denselben Grund anführen wie bei der Durchführung von Nichtregressionstests (NRT) überhaupt. Sobald es eine Änderung, ein Update der Benutzeroberfläche gibt, ist es wichtig zu überprüfen, ob dadurch das Design oder die Ergonomie nicht gestört wurden. Und auf visueller Ebene gibt es häufig Überarbeitungen oder Verbesserungen. Da es immer mehr Betriebssysteme, Webbrowser und Geräte gibt, wird es außerdem entscheidend, sicherzustellen, dass die Benutzeroberfläche auf jeder Möglichkeit korrekt angezeigt wird.

Aber warum machen Sie dann nicht einfach funktionale Nichtregressionstests (NRT)? Weil sie in der Regel nicht die visuellen Aspekte der Website oder der mobilen Anwendung abdecken. Eine Website kann eine kaputte Anzeige haben und dennoch funktional sein, es sei denn, die Objekte verschwinden, so dass eine Steuerung sehr wohl ein funktionales Szenario auf einer nicht konformen Oberfläche durchführen kann. Mithilfe von grafischen Nichtregressionstests können Sie diese Lücken schließen und so potenzielle visuelle Fehler erkennen, die bei funktionalen Tests unbemerkt bleiben würden. 

Abgesehen davon: Wenn es nur einen einzigen guten Grund für grafische Vergleichstests geben sollte, dann ist es der, die bestmögliche Nutzererfahrung zu gewährleisten. Wie wir ganz am Anfang dieses Artikels erwähnt haben (und es schadet nicht, es zu wiederholen), geben 92,6 % der Nutzer an, dass das Design der Website und die visuelle Darstellung die Hauptfaktoren für die Kaufhandlung sind. Im Gegensatz dazu lassen sie sich keinen einzigen visuellen Fehler entgehen. Ein einziger Fehler reicht aus, um sie vom Kauf abzuhalten oder sie dazu zu bringen, die Website oder die mobile Anwendung zu verlassen, was zu Geschäfts- und Imageverlusten führt. Und die einzige Möglichkeit, diese Bugs zu vermeiden, besteht darin, so oft wie möglich grafische Nichtregressionstests durchzuführen. 

Haben Sie noch ein letztes Argument? Keine Sorge. Wenn Sie eine Website oder eine Anwendung ohne visuelle Fehler liefern, sichern Sie sich ein hochwertiges Produkt. Das trägt nicht nur dazu bei, Ihre Glaubwürdigkeit und das Vertrauen der Nutzer in Ihr Unternehmen zu stärken, sondern stärkt auch Ihr Markenimage. 

 

Haben Sie verstanden, was grafische Vergleichstests / grafische Nichtregressionstests / visuelle Tests sind? Haben Sie sie vorher gemacht? Und wenn nicht, hat Sie dieser Artikel davon überzeugt, welche zu machen? Bitte teilen Sie uns Ihr Feedback in den Kommentaren mit!