Leitfaden zur Bildvergleichung
Bilder mit der passenden Ansicht vergleichen
Bildvergleich funktioniert am besten, wenn die Ansicht zur Entscheidung passt, die Sie treffen müssen.
Dieser Leitfaden behandelt zwei Bildfelder, Vorschau im Browser und vier praktische Vergleichsmodi.
Beispiele
Vier Vergleichsmodi mit lokalen Demo-Bildern
Jede Vorschau nutzt ein echtes Vorher-Nachher-Paar, damit der Modus im passenden Prüfkontext verständlich wird.
Image A
Image B
Schritt 1
Mit Bild A und Bild B beginnen
Laden Sie das Original oder Vorher-Bild in Bild A. Laden Sie die geänderte oder Nachher-Version in Bild B.
Nutzen Sie Dateien derselben Szene, desselben Designs, Produktfotos oder Screenshots. Unverwandte Bilder lassen sich anzeigen, sind aber schwerer zu bewerten.
- Bild A: Original, vorher, Basis oder Referenz.
- Bild B: geändert, nachher, exportiert, bearbeitet oder neu.
- Unterstützte Formate: PNG, JPG, JPEG, WebP.
Vorher und nachher
Bildvergleich Slider
Bildvergleich Slider unterstützt Vorher-nachher-Prüfungen für Bildvergleich und Vergleichsbild.
Nutzen Sie diesen Modus, um sichtbare Änderungen in einem gemeinsamen Bildbereich aufzudecken.
Ganzes Bild
Bilder nebeneinander vergleichen
Bilder nebeneinander vergleichen hält beide Dateien sichtbar, damit Fotovergleich und Layoutänderungen leichter prüfbar bleiben.
Nutzen Sie diesen Modus, wenn beide Bilder gleichzeitig für Zuschnitt, Abstand und Komposition sichtbar sein sollen.
Ausrichtung
Bildvergleich mit Overlay
Bildvergleich mit Overlay hilft beim Prüfen von Ausrichtung, Farbe, Zuschnitt und Abständen.
Nutzen Sie diesen Modus, wenn Platzierung, Skalierung oder Ausrichtung wichtiger sind als ein einfacher Vorher-Nachher-Vergleich.
Pixelcheck
Differenzen hervorheben
Markieren Sie Bildunterschiede und geänderte Pixel nach dem browserlokalen Schwellwerttest rot.
Nutzen Sie diesen Modus, wenn Sie nach dem Diff geänderte Bereiche und lokale Pixelmetriken brauchen.
Formate
Unterstützte Bildformate
Das aktuelle Tool unterstützt PNG, JPG, JPEG, WebP. Für beste Ergebnisse vergleichen Sie zwei Bilder aus demselben Workflow.
Nicht unterstützte Formate sollten vor dem Vergleich konvertiert werden.
Geladene Bilder
Erkennen, ob Bilder geladen wurden
Wenn Ihre Bilder in den Upload-Feldern erscheinen, wurden sie in der Regel erfolgreich geladen. Sehr große Bilddateien können länger dauern und den Vergleich verlangsamen.
Anwendungsfälle
Typische Einsätze für den Online-Bildvergleich
Vergleichen Sie zwei Bilder online, wenn visuelle Änderungen vor Freigabe einer Bearbeitung, eines Exports oder Screenshots geprüft werden sollen.
Modustabelle
Einfache Modustabelle
| Modus | Am besten für | Verwenden, wenn |
|---|---|---|
| Bildvergleich Slider | Bildvergleich Slider unterstützt Vorher-nachher-Prüfungen für Bildvergleich und Vergleichsbild. | Ziehen Sie die Teilungslinie, um zu überprüfen, wo die geänderten Pixel im Kontext stehen. |
| Bilder nebeneinander vergleichen | Bilder nebeneinander vergleichen hält beide Dateien sichtbar, damit Fotovergleich und Layoutänderungen leichter prüfbar bleiben. | Vergleichen Sie beide Bilder gleichzeitig, bevor Sie die berechneten Metriken des Bild-Diff-Checkers lesen. |
| Bildvergleich mit Overlay | Bildvergleich mit Overlay hilft beim Prüfen von Ausrichtung, Farbe, Zuschnitt und Abständen. | Blenden Sie ein Bild über das andere, um Ausrichtungs-, Farb- und Beleuchtungsverschiebungen zu erkennen. |
| Differenzen hervorheben | Differenzen hervorheben berechnet lokale Pixelunterschiede erst, nachdem der lokale Diff gestartet wurde. | Markieren Sie Bildunterschiede und geänderte Pixel nach dem browserlokalen Schwellwerttest rot. |
Bereit zum Vergleichen