Dark Mode und Visual Testing: Warum Sie doppelt so viele Tests brauchen
Dark Mode verdoppelt die Testfläche: invertierte Farben, kaputte Kontraste. Visuelles Testing sichert beide Themes ohne doppelte Arbeit.
Weiterlesen →Visuelle Erkennung — Alle Artikel & Tutorials
14 Artikel
Die visuelle Erkennung beschränkt sich nicht auf den Pixel-für-Pixel-Vergleich zweier Bilder. Je nach Art des angestrebten Defekts unterscheiden sich Algorithmen und Schwellwerte: Eine subtile Farbabweichung (schlecht aufgelöstes Token, sRGB/P3-Konvertierung) erfordert einen perzeptuellen Vergleich; eine Layout-Verschiebung (gebrochenes Flexbox, duplizierter Margin) zeigt sich besser durch strukturelle Analyse; ein Typografie-Problem (geladene Fallback-Schrift statt der Hauptschrift) verlangt besondere Aufmerksamkeit für das Sub-Pixel-Rendering. Und im Responsive- oder Dark Mode-Modus ändert sich alles erneut, da jeder Breakpoint die abzudeckende Fläche vervielfacht.
Diese Seite versammelt Artikel, die die Arten erkennbarer visueller Regressionen sezieren und ihre Unterscheidung erläutern: falsch-positive Ergebnisse durch Schriftglättung, echte Kontrastregressionen, die mit bloßem Auge unbemerkt bleiben, Layout-Brüche bei schmalem Viewport, partielle Dark-Mode-Umschaltungen, bei denen einige Komponenten sich nicht anpassen. Wir behandeln auch die Wahl der Vergleichsalgorithmen (Pixel-Matching, SSIM, perzeptuell) mit ihren jeweiligen Stärken und blinden Flecken. Delta-QA setzt auf eine Kombination dieser Ansätze, um Rauschen zu minimieren und gleichzeitig bei echten Regressionen streng zu bleiben; diese Artikel erklären die Prinzipien, um zu verstehen, was ein visuelles Testwerkzeug zuverlässig erkennen kann – und was nicht.
CSS kaputt nach dem Deployment: Warum das passiert und wie Sie es verhindern
CSS bricht nach einem Deployment kaputt? Cascade, Spezifität, Minification: visuelles Testing entdeckt das vor der Produktion.
Weiterlesen →
Automatisiertes visuelles Audit einer Website: Der methodische Leitfaden
Visuelles Website-Audit in 5 Schritten: Inventar, Baselines, Cross-Browser, Responsive, Barrierefreiheit. Vollständige Methodik.
Weiterlesen →
False Positives im Visual Testing reduzieren: Das Problem, das niemand wirklich löst
False Positives sind Problem Nr. 1 im Visual Testing. Anti-Aliasing, Animationen, Cross-Browser-Rendering – wie man Fehlalarme auf Null reduziert.
Weiterlesen →
Visueller HTML-Vergleich Online: zwei Seiten visuell prüfen
Vergleichen Sie zwei HTML-Seiten visuell, kostenlos und ohne Registrierung. Erkennen Sie im Code unsichtbare CSS-Unterschiede dank echtem Browser-Rendering.
Weiterlesen →