Bilder auf Webseite invertiert (negativ); wie lösen?

C

camaso

Mitglied
Thread Starter
Dabei seit
14.06.2008
Beiträge
78
Reaktionspunkte
9
Hallo Forunauten

Ich habe eine kleine Webseite gestaltet, welche auf den div. Geräten unterschiedlich dargestellt wird. Safari und Firefox haben auf dem Mac kein Problem damit (siehe 1. Screenshot Mac, gilt für alle Browser), ebensowenig Edge und Chrome auf dem PC. Auf dem iPhone hingegen sind die Bilder entweder unsichtbar (siehe 2. Screenshot iPhone) oder gleich die ganze Seite invertiert (siehe 3. Screenshot), sehen also aus wie ein Negativ. Sie wurden ursprünglich mit dem iPhone aufgenommen und dann mit Photoshop bearbeitet.
Hat jemand einen Tipp, wie ich das lösen kann?
 

Anhänge

  • Safari-Screenshot Mac.jpg
    Safari-Screenshot Mac.jpg
    48,4 KB · Aufrufe: 64
  • Safari-Screenshot iPhone.jpeg
    Safari-Screenshot iPhone.jpeg
    21,5 KB · Aufrufe: 64
  • Firefox-Screenshot iPhone.jpeg
    Firefox-Screenshot iPhone.jpeg
    294,8 KB · Aufrufe: 64
Mit PS bearbeitet… zufällig in cmyk abgespeichert? Denn zumindest so kenne ich das Problem von früher, dass die Bilder an nicht kompatible Ausgabegeräte negativ angezeigt wurden!
Ansonsten… wie hochgeladen? Als .jpg, .png…? Mal alle Parameter durchgecheckt? Pixel, Größe, Auflösung, Bit-Farbtiefe usw.
Neu abspeichern und erneut hochladen...
 
Sind RGB 8bit. Ich habe sogar schon einen Screenshot davon gemacht und eingebaut, hilft nix.
 
Ok, ist dann vielleicht am iPhone irgend ein Adblocker aktiv?
 
Irgendwelche Einstellungen/Addons bez. "Dark Mode" aktiv?
 
Wenn es .png Dateien sind, könnten auch CSS Filter-Effekte dafür verantwortlich und im styles.css des Website-Templates zu finden sein.
Desweiteren gibt es im CSS auch diverse Ansprachen auf den Dark-Mode, womit unterschiedliche Auszeichnungen der Inhalte möglich sind.

Mit Einsicht des Sourcecodes der Website, bzw. des Quelltextes, wäre man schlauer, ob da CSS die Ursache sein könnte.
Alternativ mal .jpg oder .gif Bilder reinsetzen, statt .png.
CSS Filter-Effekte funktionieren nur mit .png Dateien.
 
camaso schrieb:
Hallo Forunauten

Ich habe eine kleine Webseite gestaltet, welche auf den div. Geräten unterschiedlich dargestellt wird. Safari und Firefox haben auf dem Mac kein Problem damit (siehe 1. Screenshot Mac, gilt für alle Browser), ebensowenig Edge und Chrome auf dem PC. Auf dem iPhone hingegen sind die Bilder entweder unsichtbar (siehe 2. Screenshot iPhone) oder gleich die ganze Seite invertiert (siehe 3. Screenshot), sehen also aus wie ein Negativ. Sie wurden ursprünglich mit dem iPhone aufgenommen und dann mit Photoshop bearbeitet.
Hat jemand einen Tipp, wie ich das lösen kann?
Zum Vergrößern anklicken....
womit „gestaltet“? Wenn das Bild als sRGB 72 dpi korrekt benannt ist, keine Leer- und Sonderzeichen, Großbuchstaben (!?), sehe ich keinen Grund, weshalb es nicht in allen Browsern angezeigt wird. Quelltext wäre hilfreich, Safari ist ein recht anspruchsvoller Browser, der die Regeln des W3C sehr ernst nimmt.
 
Mit RocketCake. Das Problem lag aber nicht dort, sondern wohl beim Ursprungsbild. Das war ein .heic aus dem iPhone, welches ich mit Photoshop in .jpg umgewandelt hatte. Möglicherweise habe ich dabei übersehen, dass es RGB 16bit war, aber vielleicht war es auch was anderes, denn trotz Umwandlung in RGB 8bit blieb das Bild invertiert. Nun ist das Problem jedoch gelöst, wenn auch auf andere Art, als gedacht. Das iPhone hat schlicht und einfach den Cache abgefragt und das Bild nicht erneut geladen. Daher blieb immer alles gleich falsch. Textänderungen wurden aber übernommen, weshalb ich zunächst nicht auf den Cache kam. Danke euch, für die Unterstützung!
 
  • Gefällt mir
Reaktionen: blue apple
camaso schrieb:
...


In der Tat war bei Firefox der "night mode" aktiv! Deaktiviert wird das Bild korrekt angezeigt.

...
Zum Vergrößern anklicken....

... ich weiß nicht genau, was der "night mode" beim FireFox ist. Ich nehme an, gemeint ist der "Dark Mode" oder etwas Ähnliches, das möglicherweise durch ein Plugin gesteuert wird.

In jedem Fall sollten aber Bilder, die in einem korrekten Format auf einer Website eingebunden sind, völlig unabhängig von Dark- oder Light-Mode immer(!) mit ihren korrekten Farben dargestellt werden.
Der Dark-Mode verändert ja nicht den Inhalt einer Website, sondern nur den FireFox-Frame, der darum herum liegt.

Deshalb würde ich auch mal vermuten, dass deine Bilder aufgrund ihres Formats oder irgendwelcher Filter dieses Problem haben.
Bei mir läuft der FF auch im Dark-Mode und sämtliche Bilder werden immer korrekt angezeigt.
 
  • Gefällt mir
Reaktionen: dg2rbf
MilesVorkosigan schrieb:
Der Dark-Mode verändert ja nicht den Inhalt einer Website, sondern nur den FireFox-Frame, der darum herum liegt.
Zum Vergrößern anklicken....
Nuja, kommt ganz darauf an, was der Webdesigner dann anzeigen lässt, wenn der Dark Mode angesprochen wird:

Code: 
@media (prefers-color-scheme: dark) {
#main-content  { display: none; }
}

Damit kann man halt komplett unterschiedliche Inhalte und Layouts fahren – wenn man will.

https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
 
MilesVorkosigan schrieb:
... ich weiß nicht genau, was der "night mode" beim FireFox ist. Ich nehme an, gemeint ist der "Dark Mode" oder etwas Ähnliches, das möglicherweise durch ein Plugin gesteuert wird.

In jedem Fall sollten aber Bilder, die in einem korrekten Format auf einer Website eingebunden sind, völlig unabhängig von Dark- oder Light-Mode immer(!) mit ihren korrekten Farben dargestellt werden.
Der Dark-Mode verändert ja nicht den Inhalt einer Website, sondern nur den FireFox-Frame, der darum herum liegt.

Deshalb würde ich auch mal vermuten, dass deine Bilder aufgrund ihres Formats oder irgendwelcher Filter dieses Problem haben.
Bei mir läuft der FF auch im Dark-Mode und sämtliche Bilder werden immer korrekt angezeigt.
Zum Vergrößern anklicken....
Man möge mir das Englisch verzeihen. Siehe Screenshot. 🙂

IMG_600A9D472C1B-1.jpg

Im übrigen bin ich Deiner Meinung.
 
  • Gefällt mir
Reaktionen: dg2rbf
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben Unten