Wie kann ich eine korrekte Farbwiedergabe mit Browsern auf Wide-Gamut-Displays sicherstellen?

Bei der Bearbeitung für das Web wird Ihnen jeder empfehlen, sRGB zu verwenden, da viele Browser kein Farbmanagement bieten und die meisten Browser sowieso alle Bilder als sRGB interpretieren.

Dies ist korrekt für Browser, die auf normalen Gamut-Displays verwendet werden, die selbst in sRGB leben.

Geben Sie nun Wide-Gamut-Displays ein. Diese leben im AdobeRGB-Farbraum, und zu meiner Bestürzung interpretieren Browser ohne Farbmanagement auf einem breiten Farbraum auch Bilddaten als im AdobeRGB-Farbraum. Was passiert, wenn sRGB-Bilddaten als AdobeRGB interpretiert werden? Die Farben sind aus, zu kräftig, es sieht knallig aus.

Auch bei Verwendung eines Browsers mit Farbmanagement wie FireFox, aber beim Betrachten von Bildern ohne eingebettetes Profil, besteht das Problem weiterhin: Die Bilder werden als AdobeRGB statt sRGB interpretiert.

Kurz gesagt: seit ich mein Wide-Gamut-Display habe, sieht flickr furchtbar aus.

Irgendwelche Ideen, wie ich meine Browser (Internet Explorer und FireFox) dazu bringe, standardmäßig sRGB anstelle von AdobeRGB für die Farbwiedergabe zu verwenden?

Ich verwende Windows 7.

Lustige Sache, wenn ich die Bilder auf das lokale Laufwerk herunterlade und einen Dateibetrachter verwende, um sie anzuzeigen, wird die Farbe korrekt als sRGB interpretiert.

Ich würde vermuten, dass Flickr das Farbprofil möglicherweise nicht enthält, wenn es auch seine kleineren Größen generiert.
Die Dateien mit Profilen sind nicht mein Hauptproblem. Mein Hauptproblem sind die Bilder, die kein Profil enthalten.
@Rowland Flickr behält das Farbprofil in Bildern mit geänderter Größe bei.
Diese "komische Sache", die Sie in Ihrem letzten Satz erwähnen, liegt nur daran, dass der Bildbetrachter die nicht profilierten Bilder als sRGB behandelt und Firefox nicht. Siehe meine Antwort, wie man Firefox dazu bringt, dies auch zu tun.

Antworten (7)

Leider kann man da nichts praktisches machen. Um das zu bekommen, was Sie wollen, müssen Sie Ihr Systemprofil auf sRGB einstellen.

Das Verhalten der Bildfarbwiedergabe für Bilder ohne angehängte Profile ist undefiniert. Browser erraten nicht, in welchem ​​Farbraum sich ein Bild befindet, wenn kein Profil angehängt ist. Das übernimmt das Betriebssystem.

Der richtige Weg, um eine korrekte Farbwiedergabe zu erhalten, besteht darin, ein Profil an das Bild anzuhängen. Flickr (und selbstgefällige Thumbnails) bieten Ihnen diese Option offensichtlich nicht.

Sie haben also zwei Möglichkeiten: Erstens stellen Sie Windows so ein, dass es sRGB als Monitorprofil verwendet; dann sehen alle nicht getaggten Bilder wie sRGB aus, aber getaggte Bilder sehen wie Mist aus, und Ihr Farbmanagement wird verrückt sein. (Hinweis: Dies ist eine schlechte Wahl)

Oder gehen Sie einfach mit der Tatsache um, dass nicht verwaltete Bilder der Teufel sind und Sie nichts dagegen tun können.

Vielleicht gibt es ein Firefox-Plugin, das automatisch ein Farbprofil anhängen kann, aber abgesehen davon ist es nur ein einfacher alter Mist, der als Farbmanagement bekannt ist.

Ich musste mich mit dem gleichen Problem mit Smugmug befassen. Meine Bilder haben alle angehängte sRGB-Profile, sodass sie großartig aussehen (in farbverwalteten Browsern), aber Miniaturansichten sehen übersättigt aus. Das liegt daran, dass die Thumbnails automatisch generiert werden und smugmug sich weigert, ihnen ein Farbprofil hinzuzufügen, weil es die Größe des Thumbnails verdoppelt. Die Daumen werden also so gerendert, wie das Betriebssystem sie rendert.

Tatsächlich habe ich festgestellt, dass mein Display (Eizo CG303w) einen Modusschalter bietet, mit dem zwischen AdobeRGB und sRGB umgeschaltet werden kann, was beim Surfen sehr praktisch ist.
"Um das zu bekommen, was Sie wollen, müssen Sie Ihr Systemprofil auf sRGB einstellen." - das ist völlig falsch. Sie sollten Ihr Systemprofil niemals auf sRGB einstellen, Sie sollten Ihren Monitor mit einem Kalibrierungsgerät profilieren.
Entschuldigung, -1, da fast alles in dieser Antwort falsch ist! Sie dürfen Ihr Anzeigeprofil nicht auf sRGB einstellen, Sie können ein Profil an ein Bild auf Flickr anhängen, Firefox kann Bilder ohne Tags als sRGB rendern, und der richtige Weg, um eine Farbwiedergabe zu erhalten, besteht nicht (nur) darin, Ihr Bild zu taggen, es ist zu Profilieren Sie Ihren Monitor! Kurz gesagt, man kann etwas dagegen tun!
Entschuldigung, der erste Teil „Ihren Monitor auf RGB einstellen“ war ein schlechter Rat „Bilder werden wie sRGB aussehen, aber andere Bilder werden wie Mist aussehen.“ Ich hätte es als solches markieren sollen, aber ich dachte, es würde implizieren, dass es sich um einen schlechten Rat handelt. Außerdem wird in der Einstellung in Firefox nicht angegeben, als welches Profil das Bild markiert wird. Drittens: Das Korrigieren der Farbkalibrierung und das Einstellen Ihres Firefox-Browsers funktioniert gut für Sie selbst, aber versuchen Sie, alle, die Ihre Galerie besuchen werden, dazu zu bringen, dasselbe zu tun. Das ist das eigentliche Problem mit nicht verwalteten Bildern.

Ich hatte genau das gleiche Problem und es ist möglich, zu einer korrekten und praktikablen Lösung zu gelangen . Es gibt viele Missverständnisse sowohl in der Frage als auch in den vorherigen Antworten (und tatsächlich in Bezug auf das Farbmanagement im Allgemeinen), also lassen Sie mich versuchen, sie aufzuklären und Ihnen eine Antwort zu geben.

Zuerst die Missverständnisse...

  1. Normale (nicht breite) Monitore "leben nicht in sRGB", noch "leben" Wide-Gamut-Displays "in AdobeRGB". sRGB und AdobeRGB (zusammen mit ProPhoto RGB) sind als Arbeitsprofile bekannt : Sie stimmen mit keinem realen Gerät überein, sie bieten nur einen Standardsatz von Messungen, die alle Geräte so programmieren können, dass sie sie verstehen. Jeder Monitor (und jeder Drucker) hat sein eigenes Profil, und dieses Profil kann sich im Laufe der Zeit ändern, wenn die Chemikalien im Display altern. Das Profil eines einzelnen Displays kann sich stark mit einem der Standard-Arbeitsprofile überschneiden, aber es ist falsch zu sagen, dass es genau damit übereinstimmt oder sogar vollständig darin passt. Es'

  2. Sie sollten das Profil Ihres Displays niemals auf eines der Arbeitsprofile einstellen (weil dies nicht sein Profil ist!). Die richtige Lösung besteht darin , ein Kalibrierungsgerät zu verwenden, um das richtige Profil Ihres Monitors herauszufinden, und dieses zu verwenden.

  3. Browser sind nicht die einzige Frucht: Sie möchten sicherstellen, dass Ihr Display so profiliert ist, dass andere Imaging-Apps (Photoshop, Lightroom, was auch immer) auch Farben originalgetreu darstellen.

  4. Es gibt etwas, was Sie gegen nicht verwaltete Bilder in Browsern tun können (einige andere Antworten haben darauf hingewiesen). Darauf komme ich weiter unten im Detail zu sprechen.

Eine grobe Anleitung, wie Profile interagieren, wenn Sie ein Bild auf Ihrem Monitor anzeigen

In einer idealen Welt kommen beim Betrachten eines Bildes nicht nur ein, sondern zwei Profile ins Spiel . Das erste ist das in das Bild eingebettete Profil: Nennen wir es Eingabeprofil . Denken Sie daran, dass digitale Bilder aus Pixeln bestehen, die jeweils eine Kombination aus Rot, Grün und Blau enthalten. Bei einem einfachen roten Quadrat ist also jedes Pixel auf 100 % Rot, 0 % Grün und 0 % Blau eingestellt. Aber was meinen wir mit 100 % rot?Es ist, als würde man am Straßenrand ein Schild sehen, auf dem steht: „Sie dürfen jetzt mit Höchstgeschwindigkeit fahren“. Welche Höchstgeschwindigkeit? So schnell wie das Auto fahren wird? Das Schild sagt es nicht, also wird die tatsächliche Geschwindigkeit von Auto zu Auto variieren. Das Eingabeprofil sagt uns, wozu dieser 100 %-Wert relativ ist: Bei einem Bild, das mit einem eingebetteten Profil gekennzeichnet ist, weiß Ihr Computer jetzt, dass „100 % Rot“ den maximalen Rotwert bedeutet, der durch dieses spezifische Profil definiert ist. (Um die Analogie zu vervollständigen, sagt unser Straßenschild jetzt: "Höchstgrenze 70 mph. Sie dürfen jetzt maximal fahren.")

Sobald also ein Bild mit einem eingebetteten Profil getaggt ist , wissen wir genau, was wir anzeigen müssen : genau welche Schattierung von Rot, Gelb oder was auch immer. Die nächste Frage ist: Wie zeigen wir es an? Betrachten Sie dasselbe Bild auf ein paar verschiedenen Computern (oder nur Ihrem Computer und Ihrem Telefon) und Sie werden sehen, dass keine zwei Displays Farben auf genau die gleiche Weise wiedergeben. Hier müssen wir unseren Monitor kalibrieren, um ein Anzeigeprofil – das Ausgabeprofil – zu erstellen, das uns genau sagt, wie dieses spezielle Gerät Farben wiedergibt. Jetzt haben wir beide Informationen, die wir brauchen:

  • Eingabeprofil: Was bedeutet dieses Bild, wenn es "rot" sagt?
  • Ausgabeprofil: Wie bringe ich diese Hardware dazu, diesen Rotton (so nahe wie möglich) anzuzeigen?

Und was ist, wenn das Bild nicht getaggt ist? Für alle bis auf die spezialisiertesten Benutzer kann man davon ausgehen, dass ein Bild ohne Tags das sRGB-Profil verwendet.

Und nun zur Beantwortung Ihrer Frage

Der erste Schritt bei jedem Monitor – aber besonders wichtig bei einem Wide-Gamut-Display – ist die korrekte Kalibrierung Ihres Monitors . Dies erfordert die Verwendung eines Kalibrators: eine Hardware, die über dem Bildschirm sitzt und Farbmessungen vornimmt, während eine Reihe von Testbildern angezeigt werden, um festzustellen, welche Farben Ihr Monitor tatsächlich anzeigt. Für eine Anzeige mit großem Farbraum müssen Sie sicherstellen, dass Sie einen geeigneten Kalibrator verwenden: Ich verwende einen Spyder Pro 3 und er funktioniert einwandfrei.

Sobald Sie Ihren Monitor kalibriert haben, sollten Sie feststellen, dass jede farbverwaltete Anwendung jetzt Farben originalgetreu anzeigt. Vor der Kalibrierung zeigte mein Wide-Gamut-Monitor alles übersättigt an: Hauttöne waren tomatenrot und sowohl Photoshop als auch Lightroom waren unbrauchbar. Nach der Kalibrierung sahen beide perfekt aus. Verwenden Sie also eine farbverwaltete App, um Ihre Kalibrierung zu testen.

Und jetzt zu den Browsern! Firefox ist der einzige Browser, der für mich auf einem kalibrierten Wide-Gamut-Display gut funktioniert. Standardmäßig verwendet es das eingebettete Farbprofil in Bildern, um sie korrekt anzuzeigen, aber Bilder ohne Tags erscheinen immer noch übersättigt. Aber keine Sorge, es ist noch nicht alles verloren!

  • Geben Sie about:config in Ihre Adressleiste ein.
  • Scrollen Sie nach unten und suchen Sie nach gfx.color_management.mode .
  • Ändern Sie den Wert auf 1 .

Dies veranlasst Firefox, alle Bilder ohne Tags als sRGB zu behandeln : genau das, was wir wollen. Es funktioniert sogar mit Symbolen in Ihrer Lesezeichenleiste! Leider funktioniert es immer noch nicht auf Flash-Videoplayern.

Sowohl Safari als auch Chrome sind ebenfalls farbverwaltet, aber beide haben ihre Nachteile. Safari (zumindest unter Windows) behandelt Bilder ohne Tags nicht als sRGB; Chrome tut es, aber sein Farbmanagement ist standardmäßig deaktiviert und es ist umständlich, es einzuschalten .

Zum Zeitpunkt des Schreibens hat Opera überhaupt kein Farbmanagement und IE9 ist geradezu idiotisch: Es respektiert das Eingabeprofil (das in das Bild eingebettet ist), ignoriert aber das Anzeigeausgabeprofil ! Dies macht IE9 auf einem Wide-Gamut-Display so gut wie nutzlos.

Also: kalibrieren + Firefox verwenden + gfx.color_management.mode auf 1 setzen = gut. :)

Ein nützlicher Link: Browser-Check-Bilder

Dies ist wahrscheinlich eine ähnliche Frage wie diese: Lightroom-Exporte sind in Flickr zu dunkel . Ich habe zwei Wide-Gamut-Displays (Desktop, Laptop). Vielleicht möchten Sie neuere Versionen von Firefox ausprobieren, aber ich würde nicht den Atem anhalten. Vor einem Jahr habe ich dieses Problem im Firefox-Bug-Tracker hin und her gemeldet (Problem 497363 und 509710 ). Das Farbmanagement in Firefox ist nicht so einfach wie das Aktivieren einer Option. ICC-Profile unterscheiden sich in Struktur und Fähigkeiten. Einige von uns mit Wide-Gamut-Displays bemerkten, dass Firefox das entsprechende ICC-Profil nicht richtig interpretieren konnte.

Vielleicht verschwindet dieses Problem, wenn ich ein anderes Kalibrierungstool verwende, um ein anderes ICC-Profil zu generieren, oder einen Monitor mit Hardware-LUT (dh einen, der direkt mit Ihrem Kalibrierungstool kommunizieren und die Kalibrierungsparameter in seiner Hardware speichern kann). Sie können den kostenlosen ICC Profile Inspector verwenden , um mit Ihrem Profil herumzuspielen und es mit einem anderen Profil zu vergleichen, von dem bekannt ist, dass es funktioniert. Hier ist die ICC-Profilspezifikation . Unten ist ein Screenshot meines Profils, sehen Sie, ob es etwas mit Ihrem gemeinsam hat.

Ich habe seitdem keine Firefox-Beta-Version mehr ausprobiert, ich habe mich nur an dieses Problem gewöhnt. Wenn Sie eine neuere Version ausprobieren, würde ich gerne davon hören. Hellen Sie Ihre Fotos nicht auf und verwenden Sie niemals AdobeRGB in Ihren Flickr-Fotos, sondern bleiben Sie beim webfreundlichen sRGB-Farbraum.

Alt-Text

Moderne Versionen von Firefox haben eine Einstellung, um zu versuchen, Bilder ohne Profil sowie Bilder mit Profil zu verwalten. Sie können in about:config gehen und gfx.color_management.mode auf '1' ändern. (Der Standardwert ist 2.) Ein bisschen Googeln könnte eine bessere Erklärung liefern, aber es hat mir beim Anzeigen von SmugMug-Miniaturansichten usw. geholfen.

Es ist immer noch keine systemweite Lösung für übersättigte Rottöne in Win7, aber zumindest ist mein Browser normal.

Die "Win7 übersättigten Rottöne" haben nichts mit Windows 7 zu tun, es ist ein Monitorproblem. Sie haben jedoch Recht mit der Firefox-Einstellung.

Ich glaube, Sie haben Pech mit IE, obwohl das vielleicht in IE 9 korrigiert wird. Wie Sie bereits wissen, gibt es für Firefox eine gewisse Unterstützung für Profilinformationen, und Sie können einige Anweisungen zu verschiedenen Einstellungen erhalten, die das Problem lindern können du hast damit zu tun. Ihre andere Option ist die Verwendung von Safari, das eigentlich farbbewusst sein soll.

Die letzte Option, wenn man es wirklich so nennen kann, ist, Ihren Monitor auf den sRGB-Farbraum umzustellen, wenn er ihn unterstützt.

Unser eigener jrista scheint hier der Farbexperte zu sein, also meldet er sich vielleicht mit einer Korrektur oder weiteren Ideen.

Wie ich oben geschrieben habe, unterstützt mein FireFox Farbprofile, aber das Problem besteht weiterhin bei Bildern ohne Farbprofile (was ungefähr 99% des Internets ausmacht).

Hier ist der aktuelle Stand des Farbmanagements in Firefox und IE (11.10.2010).

Firefox v3.5.x - unterstützt vollständiges Farbmanagement, versteht aber nur ICCv2-Profile. Wenn Ihre Bildschirmkalibrierungs-/Profilierungssoftware das Erstellen von v2-Profilen unterstützt (suchen Sie irgendwo in den Programmeinstellungen nach einer Option), sollten Sie in der Lage sein, Bilder korrekt anzuzeigen. Beachten Sie, dass Firefox das Farbmanagement standardmäßig nur für Bilder verwendet, die mit einem Farbprofil gekennzeichnet sind. Da es im Web viele sRGB-Bilder ohne Tags gibt, möchten Sie Firefox wahrscheinlich so konfigurieren, dass die Farbe für alle Bilder verwaltet wird. Der einfachste Weg, diese Änderung vorzunehmen, ist die Verwendung der Color Management-Erweiterung für Firefox.

FireFox v4 (derzeit in Beta) – FireFox4 wird endlich ICCv4-Farbprofile unterstützen, sowohl für Bilder als auch für Ihr Anzeigeprofil. Aktuelle Betas sind aufgebläht, fehlerhaft und langsam, daher empfehle ich sie nicht für den allgemeinen Gebrauch, aber zumindest wissen wir, dass ein korrektes Farbmanagement auf dem Weg ist.

Internet Explorer 8.x - überhaupt kein Farbmanagement. zip, nein.

Internet Explorer 9 (derzeit in der Beta-Version) - Die öffentliche Beta-Version bietet eine eingeschränkte Unterstützung für das Farbmanagement, ist jedoch auf Monitoren mit großem Farbumfang nicht wirklich nützlich. IE9 (Beta) erkennt Bilder, die mit anderen Profilen als sRGB gekennzeichnet sind, und konvertiert sie in sRGB. Leider ignoriert es das Anzeigeprofil vollständig, was bedeutet, dass bei einem Wide-Gamut-Monitor immer noch alles übersättigt ist. Ob MS dieses Verhalten beheben wird, oder ob es eine bewusste Entscheidung war, die Rendergeschwindigkeit zu verbessern, bleibt abzuwarten. Wenn einer von Ihnen IE9 in der Beta-Version testet, schlage ich vor, diesen Fehler zu melden, damit MS weiß, dass es Leute gibt, die darüber unglücklich sind.

Ich hatte das gleiche Problem. Ich denke, Sie werden feststellen, dass Ihre Flickr-Bilder gut aussehen, wenn Sie Safari installieren, da es Farbprofile unterstützt.

Wie ich oben geschrieben habe, selbst in FireFox, das Farbprofile unterstützt (ja, ich habe es getestet), bleibt das Problem bei Bildern bestehen, die keine Farbprofile enthalten (was etwa 99 % des Webs ausmacht).
Während standardmäßig nur getaggte Bilder mit Farbmanagement verwendet werden, kann Firefox so konfiguriert werden, dass Farbmanagement für alle Bilder verwendet wird.
Ich denke nicht, dass "allen sagen, dass sie Safari installieren sollen" eine sehr praktische Lösung ist!
Ich sage nicht jedem, dass er Safari installieren soll. Mir ist gerade aufgefallen, dass sie gut aussehen, nicht mehr und nicht weniger.