Das richtige Dateiformat für Facebook (Titel-)bilder

Das richtige Dateiformat für Facebook (Titel-)bilder

Was ist besser PNG (Portable Network Grafik) oder JPEG (Joint Photographic Experts Group)? Und wann verwendet man/Frau idealerweise GIF (Graphics Interchange Format), um Bilder für Facebook optimal zu sichern?

Es wäre gut, wenn Sie sich überhaupt diese Frage stellen, denn das Dateiformat beeinflusst das Ergebnis, ob Ihr Titelbild qualitativ gut oder schlecht aussieht.

Ich speichere meine Dateien als PNG ab, das machen alle so!

Hartnäckig hält sich das Gerücht, dass das beste Bildformat für Facebook generell PNG sei… Was ist da dran?
Bis vor ca. 4,5-5 Jahren gab es anscheinend* den Vorteil, dass Bilder, die als *.png-Dateien gespeichert wurden, nicht (nochmals) von Facebook kleiner gerechnet wurden und daher besser aussahen als *.jpg-Dateien, die nochmals komprimiert wurden… Da ich mich damals noch nicht intensiv mit Facebook beschäftigt habe, habe ich anno dazumal auch keine Testreihen erstellt…

Was sagt Facebook heute, im Jahr 2018 dazu?

Das ist die Herausforderung, es gibt keine genaue Aussage. Es gibt einmal die Bemerkung „Schnellste Ladezeit bei Verwendung als sRGB-JPG-Datei mit einer Abmessung von 851 x 315 Pixel und einer Dateigröße von unter 100 KB“, gefolgt von einer verschwommen Formulierung, die lautet „Bei Profil- und Titelbildern mit deinem Logo oder Text kannst du durch Verwendung einer PNG-Datei möglicherweise die Qualität verbessern.“

Screenshot von dem Facebook Hilfebereich

Screenshot Facebook Hilfebereich, Link s. unten bei Weiterführende Links

Informationen zu den optimalen Abmessungen in Pixel für Titelbilder entnehmen Sie bitte NICHT dem Screenshot, sondern lesen sich idealerweise meinem Blogartikel „Facebook Titelbilder 2018 – Neue Maße in Pixel“ durch.

Also was nun JPEG oder PNG?

Die Antwort: Nutzen Sie das Dateiformat JPEG für ALLES, für normale Bilder und/oder für Bildcomposings, Bild & Textkombinationen, die KEINE großen einheitlichen farbigen Flächen haben.

Für Bilder MIT einfarbigen Flächen + Text nutzen Sie bevorzugt PNG und zwar eher das Format PNG 8 anstelle von PNG 24. Ganz wichtig: Achten Sie darauf mit ihrer PNG-Datei unter 1 MB Dateigröße zu bleiben. Weitere Details weiter unten bei Das Dateiformat PNG.

Im Vergleich: Oben links das Original, oben rechts die JPG, unten Links eine PNG, unten rechts eine GIF

Oben links das Original, oben rechts eine JPG (378,7 KB), u. l. eine PNG (1.009 MB), u. r. eine GIF (368,7 KB)

Darum das Dateiformat JPG:

  1. Es komprimiert Bilder auf eine relativ kleine Größe im Verhältnis zu einer sehr guten bzw. guten Darstellungsqualität.
  2. Eine PNG-Datei ist meist größer, ohne ein visuell besseres Ergebnis zu liefern!
  3. Und bei einer GIF-Datei erscheinen oft durch die starke Reduktion der Anzahl von Farben unschöne (Farb-)Abrisse in Verläufen.

Finger weg von einfarbigen Hintergründen + Text in Facebook Titelbilder!

Diese Konstellation ist problematisch! In einer Facebook Marketing Gruppe habe ich die Vermutung gelesen, dass es an der Farbe Rot liegt, denn bei einfarbigen roten Hintergründen, da sei diese Problematik besonders auffällig … Böses Rot ;-)

Oben links das Original, o. r. JPEG Qualitätstufe Hoch, u. l. JPEG Qualitätsstufe Mittel & u. r. JPEG Qualitätsstufe Niedrig. So sehen diese Dateien aus BEVOR sie zu Facebook hochgeladen werden. Da Facebook Dateien über 100 kB nochmals komprimiert, wird die Darstellung noch verschlechtert-

Oben links das Original, o. r. JPEG Qualitätsstufe Hoch, u. l. JPEG Qualitätsstufe Mittel & u. r. JPEG Qualitätsstufe Niedrig.

Die Wahrheit ist, es ist auch mit anderen Farben grausam, wenn eben das Dateiformat JPEG im Spiel ist. Das ist nun einmal nicht die Stärke dieses Dateiformats einfarbige „bunte“ Flächen ohne Artefakte darzustellen.

Oben links das Original, o. r. JPEG Qualitätstufe Hoch, u. l. JPEG Qualitätsstufe Mittel & u. r. JPEG Qualitätsstufe Niedrig. So sehen diese Dateien aus BEVOR sie zu Facebook hochgeladen werden. Da Facebook Dateien über 100 kB nochmals komprimiert, wird die Darstellung noch verschlechtert-

Oben links das Original, … das Gleiche in Grün: Sieht auch nicht besser aus.

Bei schwarzen Flächen taucht das Phänomen der Artefakte hingegen nicht auf, bei weißen Flächen ist es nicht so extrem, wie bei „bunten“ Farben. Das ist keine Neuigkeit, das ist erfahrenen Webdesigner/innen schon seit vielen Jahren bekannt.

Facebook verstärkt diesen Effekt der JPEG-Artefakte, da Bilder von Facebook nochmals kleiner gerechnet werden. Das betrifft im Übrigen nicht nur JPEG Bilder, die größer als 100 KB sind, auch Bilder mit „nur“ 66 KB werden etwas kleiner gerechnet. Ich habe dies sicherheitshalber intensiv getestet…
– Diese nochmalige JPEG-Kompression verursacht eine weitere Verschlechterung der Darstellung. Einige versuchen daher JPEG in einer besonders hohen Qualität (Sehr Hoch) hochzuladen, um diesen Effekt nicht zu erzielen, aber das klappt so nicht…

Also, was macht man/Frau in so einem Fall?

Verwenden Sie anstelle von komplett einfarbigen Hintergründen, solche, die „überwiegend einfarbig“ sind. Sprich: Ein Bild, dass z.B. semitransparent in einen einfarbigen Hintergrund eingefügt wird, sorgt dafür, dass viele Farbschattierungen erzeugt werden. Das verbessert die Optik enorm, es entstehen wesentlich weniger JPEG-Artefakte.

Funktioniert besser: Der Hintergrund ist zwar einfarbig aber nicht ganzflächig in einer Farbe.

Funktioniert besser: Der Hintergrund ist optisch Rot aber nicht ganzflächig in einer Farbe.

Oder Sie nutzen eben das Dateiformat PNG, bleiben aber mit der Dateigröße diesem Dateiformat unter 1 MB, siehe unten, weitere Informationen bei Das Dateiformat PNG.

Wenn ich JPEG verwende, welche Qualität ist dann „die Beste“?

Kurz und knapp: Verwenden Sie NIE JPEG in der Qualitätsstufe Niedrig. Das macht Dateien zwar schön klein (von der Datenmenge), aber sieht IMMER schlecht aus!

In der Regel ist bei Bildern mit etwas unscharfen oder unruhigen Hintergründen die Kompressionsstufe Mittel ausreichend. (Anmerkung: ein unruhiger Hintergrund = wenige bzw. keine einfarbige Bereiche, viele kleine Flächen mit Farbabstufungen, z.B. ein Landschaftsbild, ein „normales“ Foto, …).

Befindet sich in den (Titel-)Bilder auch Text, dann sollten Sie als Qualitätsstufe Hoch verwenden.

Die Qualitätsstufe Sehr Hoch brauchen Sie nicht zu verwenden. Das sieht zwar bei Ihnen VOR dem Hochladen sehr gut aus, aber Facebook komprimiert das Bild in der Regel sowieso noch einmal… Und dann haben Sie schon mal die realistischere Vorschau, wenn Sie das Bild nicht mit der Qualitätsstufe Sehr Hoch sichern, sondern gleich mit Hoch.

Oben links das Original, o. r. JPEG Hoch, u. l. JPEG Mittel, u. r. JPEG Niedrig

Oben links das Original, o. r. JPEG Hoch, u. l. JPEG Mittel, u. r. JPEG Niedrig

Das Dateiformat PNG

Es gibt zwei Arten von PNG: PNG 24 und PNG 8. Diese haben verschiedene Eigenschaften und dadurch unterschiedliche Einsatzmöglichkeiten. Um es gleich vorneweg zu nehmen: Facebook mag das Dateiformat PNG 24 nicht sonderlich …

Ein besonderer Vorteil von PNG 24 ist, das es Transparenz & Semitransparenzen unterstützt. Es ist daher ein Top-Dateiformat um z.B. Logos ohne Hintergrund für PowerPoint-Präsentationen abzuspeichern…

Bilder für Facebook benötigen keine Transparenz oder gar Semitransparenz, daher ist dies Dateiformat in der Regel für Bilddateien, die Sie hochladen werden nicht sinnvoll. – Außer Sie haben Titelbilder mit großen farbigen Flächen, kombiniert mit Text … Allerdings ist in solchen Fällen meist das Dateiformat PNG 8 besser geeignet.

PNG 8 setzt kennt „nur“ Transparenz, keine Semitransparenz und ähnelt daher eher dem GIF-Format. Es generiert eine wesentlich geringere Dateigröße als PNG 24, kann aber ebenso sehr gut einfarbige „bunte“ Flächen, mit sich darauf befindendem Text, sichern.
– Ein kleiner Nachteil von PNG 8 zu PNG 24 und auch zu JPG: Es kann, so wie eine GIF-Datei, nur maximal 256 Farben sichern.

PNG 24 und Facebook

Jedes PNG wird von Facebook garantiert in eine JPEG umgewandelt, wenn die Größe 1 MB überschreitet. PNG-Dateien, die unterhalb von 1MB sind, bleiben als PNG erhalten. Da PNG 24 größere Dateien generieren als PNG 8, sind die von Ihnen gesicherte PNG 24 Dateien ganz schnell größer als 1 MB und werden dadurch „abgestraft“.

Wenn Sie also eine PNG mit mehr als 1 MB hochladen und Facebook generiert sowieso ein JPEG daraus, dann gehen sämtliche Vorteile der PNG-Datei verloren. Der wichtigste Vorteil von dem Dateiformat PNG für Facebook: einfarbige Flächen werden nicht so schnell optisch fragmentiert.

Entscheiden Sie sich (fast) immer für JPEG! Oben links das Original, o.r. PNG 24 (1,238 MB), u.l. PNG 8 (396,7 KB), u. r. JPEG Hoch (197,3 KB)

Entscheiden Sie sich (fast) immer für JPEG! Oben links das Original, o.r. PNG 24 (1,238 MB), u.l. PNG 8 (396,7 KB), u. r. JPEG Hoch (197,3 KB)

In dem Screenshot oben sehen die Fische optisch bei PNG 24 und beim JPEG, gesichert in der Qualitätsstufe Hoch, gleich gut aus.
– Der kleine Unterschied: Die PNG 24 ist 6,3 x größer als die JPEG-Datei. Da die Größe außerdem 1 MB überschreitet, wird sie durch Facebook garantiert in eine JPEG-Datei umgerechnet und verkleinert.
– Die PNG 8-Datei zeigt hingegen an einigen Stellen bereits Farbabrisse, z.B. im dunklen Bereich oberhalb des rechten Fischkopfes. Hier kann der Farbverlauf von Hell zu Dunkel nicht sauber dargestellt werden und wirkt pixelig.

Das Dateiformat GIF

Die Komprimierung von Bilddaten mit dem Dateiformat GIF funktioniert über eine Reduktion der Anzahl von Farben. Eine GIF-Datei kann maximal 256 Farben haben und Transparenz, wie dies auch beim PNG 8 der Fall ist. Semitransparenz, wie es dem PNG 24-Dateiformat möglich ist, kann das GIF-Format nicht darstellen … Durch die starke Farbreduktion können viele Arten von Bildern, z.B. Landschaftsaufnahmen mit einem tollen Sonnenuntergang (viele Farbschattierungen & Verläufe) überhaupt nicht schön dargestellt werden.

Oben links Original, o. r. GIF mit Dithering (155,2 KB), u. l. GIF ohne Dithering (87,14 KB), u. r. PNG 6 ohne Dithering (78,5 KB)

Vorteile von GIF sind: Kleine Dateigrößen & sehr gute Darstellung von Logos & einfarbigen Flächen, generell von Bilder und Grafiken mit wenigen Farben.

GIF gilt als veraltetes Dateiformat, dass relativ selten eingesetzt wird, da beim selben Bildausgangsmaterial das PNG 8 Dateiformat die gleichen optischen Ergebnisse liefert, dabei jedoch kleinere Dateigrößen liefert.

Aber: GIF ist das perfekte Dateiformat für (GIF-)Animationen!

Dieser kleine Tipp für Alle, die an Online-Besprechungen, Konferenzen & Webinaren teilnehmen, habe ich als animiertes GIF gesichert. Der Beitrag ist sehr oft auf Facebook geteilt worden.

Zu der Thematik GIF Animationen werde ich bei Gelegenheit einen extra Blogartikel verfassen. In diesem Blogartikel gehe ich dann auf die unterschiedlichen Typen von GIF-Animationen ein. Ich zeige Ihnen obendrein die verschiedenen Optionen zum Sichern & Komprimieren und stelle Ihnen passende Tools vor, mit denen Sie Animationen selbst erstellen können.

Besonders interessant: GIF Animationen wertet Facebook nicht als Bilder sondern als Videos! Da Facebook Videos in gewissen Bereichen bevorzugt, ist die Thematik GIF Animation besonders interessant. Und GIF Animationen haben noch weitere Vorteile. Unter anderem können sie kostengünstig selbst erstellt werden und erfreuen sich hoher Beliebtheit bei Facebook Nutzern …

Weiterführende Links:

* Ich habe lange recherchiert, um einen Nachweis zu finden, ob es tatsächlich vor 4,5-5 Jahren der Fall war, dass das PNG Dateifomat grundsätzlich ideal war, um eine Kompression der Datei durch Facebook zu umgehen. – Ich habe keinen Beweis dafür gefunden. Also kann es sein, dass dies schon immer ein Facebook-Mythos war … Gefunden habe ich bei meiner Recherche einen Blogartikel, der dank Testreihen & Screenshoots nachweist, dass bereits am 05.12.2014 hochgeladene *.png-Dateien stets in *.jpeg-Dateien konvertiert wurden, wenn diese größer als 1 MB waren. Dieses Verhalten ist also schon lange nicht mehr geändert worden.

https://allfacebook.de/allgemeines/pro-tipp-fuer-gute-bildqualitaet-auf-facebook-kommt-es-auch-auf-die-dateigroesse-an – Bitte vergessen Sie nicht beim Lesen, dass dieser Artikel sehr alt ist und einige Angaben nicht mehr gültig ist!

Screenshot, Fundstelle mit Erstellungsdatum. Also schon im Dezember 2014 war das PNG Dateiformat nicht DAS BESTE für Facebook.

Hier finden Sie den Satz „Bei Profil- und Titelbildern mit deinem Logo oder Text kannst du durch Verwendung einer PNG-Datei möglicherweise die Qualität verbessern.“: https://www.facebook.com/help/125379114252045

Abonnieren Sie meinen Newsletter

Verpassen Sie nicht den kommenden Blogartikel, der in ca. 1-2 Wochen erscheinen wird. Der Titel: Die optimale Dateigröße in KB bzw. MB für Facebook Titelbilder

Erhalten Sie von mir Infos, Tipps & Tricks rund um Facebook & Co. und sichern Sie sich das Photoshop Facebook Titelbild-Template 2018, kostenlos! >> Klicken Sie hier!

Hallo, seit 16 Jahren bin ich freiberuflich als Dipl.-Designerin (FH), Creative Direktorin und multimedia­dozentin (Softwaretrainerin) tätig. Ich helfe Ihnen gerne dabei, sich Wissen zu professioneller Grafikdesign-Software anzueignen. – Damit Sie Ihre Projekte souverän selbstständig umsetzen können. Ebenso stehe ich Ihnen bei der Entwicklung & Optimierung Ihrer Werbemaßnahmen zur Verfügung. Fragen Sie einfach an – Ihre, Rosita Fraguela

0 Kommentare

Eine Antwort hinterlassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*