Privacy Policy Cookie Policy Terms and Conditions Benutzer:AlterVista/JPGPNGGIF - Wikipedia

Benutzer:AlterVista/JPGPNGGIF

aus Wikipedia, der freien Enzyklopädie

Dieses Bild ist das Original für die Vergleiche. Es wurde von einer Powershot A70 von Canon im JPG Format aufgenommen. Dateigröße = 1273 KB
vergrößern
Dieses Bild ist das Original für die Vergleiche. Es wurde von einer Powershot A70 von Canon im JPG Format aufgenommen. Dateigröße = 1273 KB

Diese Seite soll ein etwas ausführlicherer Vergleich der drei in der Wikipedia verwendeten Grafikformate JPG, PNG und GIF sein, da sich immer noch Gerüchte und Vorurteile über die einzelnen Formate halten. Gleichzeitig soll diese Seite Optimierungstipps geben.
DIESE SEITE IST EXPLIZIT ZUM UNDOGMATISCHEN (!) BEARBEITEN FÜR ALLE ANGEMELDETEN WIKIPEDIANER FREIGEGEBEN.

Inhaltsverzeichnis

[Bearbeiten] Einzelbeschreibungen

[Bearbeiten] JPG

JPG ist ein verlustbehaftetes Format. Durch jedes weitere Speichern wird verliert ein Bild an Qualität. Der Grad an Qualitätsverlust (Kompressionsgrad) kann jedoch kontrolliert werden. JPG nutzt die Stärken und Schwächen des menschlichen Auges, um bei möglichst geringer Dateigröße ein subjektiv möglichst verlustfreies Bild abzuspeichern. Die (verlustbehafteten) Kompressionsalgorithmen eignen sich besonders für sanfte Farbübergänge, wie sie häufig auf Fotos existieren. Besonders harte Farbübergänge, wie sie besonders in Grafiken, Cartoons etc. vorkommen, führen nach starker JPG-Kompression zu sogenannten Kompressionsartefakten. Da JPG von Anfang an für Fotografien entworfen wurde, speichert es konsequenterweise bis zu 256*256*256 = ca 16,7 Mio. Farben1. Das Format JPG kennt keine Transparenzen. Zu beachten ist, dass (außer in einigen pathologischen Fällen) JPG immer mit einem Qualitätsverlust einhergeht (selbst bei Programmeinstellungen wie "Qualität=100"). Bei für JPG geeigneten Bildtypen und einer ausreichenden Qualitätsstufe ist dieser Qualitätsverlust allerdings kaum sichtbar.

Galerie von Bildern in unterschiedlicher JPG-Kompression:

Orginal
Qualität 90 70 50 30 10
Kompression 10 30 50 70 90
Dateigröße 567KB 268KB 187KB 134KB 66KB

1) Bei Graustufen-JPGs sind es nur 256 Graustufen. Es gibt auch JPG-Varianten, die eine Farbtiefe von 16 Bit (und damit maximal 216 Farben) haben, aber diese werden kaum genutzt.

[Bearbeiten] GIF

Die GIF Version des Originals, Dateigröße=1938KB
vergrößern
Die GIF Version des Originals, Dateigröße=1938KB

GIF ist ein verlustfreies Format. GIF-Bilder können maximal 256 Farben haben, diese kann man jedoch aus 256*256*256 Farben wählen und in der Palette des Bildes (indiziert) festschreiben. Bis Juni 2005 gab es Länder, in denen der GIF Kompressionsalgorithmus (LZW) patentrechtlich geschützt war. Diese Tatsache hat zur Entwicklung von PNG geführt. GIF-Bilder können animiert werden, d.h. in einer Datei können mehrere Bilder gespeichert werden, die nacheinander angezeigt werden. Dies wird exzessiv z.B. bei animierten Smileys genutzt. GIF kennt im Gegensatz zu JPG Transparenz, allerdings nur binäre Transparenz, d.h., nur "an/aus"-Transparenz.

[Bearbeiten] PNG

Die schwarz-weiß PNG Version des Originals, Dateigröße=1291KB
vergrößern
Die schwarz-weiß PNG Version des Originals, Dateigröße=1291KB

PNG ist ein verlustfreies Format (vereinfacht: BMP&ZIP) und wurde als Reaktion auf den Patentschutz bei GIF entworfen. PNG-Bilder können bis zu 256*256*256 = ca. 16,7 Mio. Farben enthalten. PNG-Bilder können nicht animiert sein. Mit MNG gibt es aber einen Animationsabkömmling von PNG, der derzeit jedoch von kaum einem Browser unterstützt wird. Bei PNG-Bildern gibt es wie bei GIF, aber im Gegensatz zu JPG die Möglichkeit das Bild indiziert, d.h. mit bis zu 256 in einer Palette eingetragenen Farben, abzuspeichern. Wann immer man PNG und GIF die Dateigröße betreffend vergleichen will, muss man das PNG-Bild indiziert abspeichern, da dieses sonst entweder mehr Farben enthält (bessere Qualität) oder nicht optimiert ist (falls das Original weniger als 256 Farben enthält).

Wie GIF kennt PNG Transparenz, zusätzlich ermöglicht PNG allerdings optional auch bis zu 256 Transparenzstufen. Bei Bildern mit Farbtabelle werden die Farbeinträge der Farbtabelle mit einem Transparenzwert verknüpft (1). Bei Bildern mit mehr als 256 Farben werden die Transparenzwerte in einem Alphakanal, also direkt in jedem Pixel, abgelegt (2). PNG-Bilder mit mehr als binärer Transparenz (d.h., 3 oder mehr Transparenzstufen) werden im Internet Explorer von Microsoft in der gegenwärtigen Version jedoch nicht korrekt dargestellt. Im Falle (1) wird die Transparenz vom Internet Explorer in binäre Transparenz umgewandelt, wobei Transparenzwerte unter 50% als undurchsichtig und über 50% als durchsichtig betrachtet werden. Im Falle (2) wird das gesamte Bild standardmäßig mit einem grauen Hintergrund hinterlegt. Diese Hintergrundfarbe kann durch das Hinzufügen eines so genannten bKGD-Chunks, z.B. mit TweakPNG, geändert werden. Für die nächste Version des IE sollen jedoch alle PNGs korrekt angezeigt werden.

[Bearbeiten] Vergleich der Dateigrößen

Bei PNG kommt es sehr auf den Grad der Optimierung an. Die oftmals unzureichende PNG-Komprimierung durch Programme liegt an zwei Dingen: (1) bei Bildern mit Farbtabelle die Verwendung einer höheren Farbtiefe als nötig (z.B. bei einem Bild mit 16 Farben 8 bpp anstatt 4 bpp), und (2) die Verwendung eines nicht optimierten Komprimierungsmoduls. Programme zur Optimierung von PNGs erfüllen meist entweder den einen oder den anderen Zweck.

pngrewrite: (1)
pngcrush, OptiPNG, PNGOUT: (2)

pngrewrite mit nachfolgendem OptiPNG ist zur Optimierung eine gute Allround-Lösung. Wirklich das letzte Byte kann man jedoch mit pngrewrite+PNGOUT herausquetschen, allerdings benötigt PNGOUT bei zu großen Dateien unerträglich lange zur Optimierung.

Angegeben wird hier die Größe des PNG Bildes nach dem Speichern mit GIMP (Kompressionsgrad 9), sowie die Größe, wenn die Datei anschließend mit dem Programm pngcrush optimiert wird. (Hinweis: hier wurde es versäumt, vorher pngrewrite zu benutzen, weshalb die PNG-Dateigrößen womöglich höher sind als nötig. Bei korrekter Optimierung ist PNG bei jedem Bild mit Farbtabelle kleiner als GIF.)

Art des Bildes JPG Dateigröße GIF Dateigröße PNG Dateigröße (GIMP) PNG Dateigröße (GIMP & pngcrush)
original 1273 KB - 3767 KB 3400 KB
indiziert (256 Farben) - 1938 KB 1726 KB 1701 KB
schwarz-weiß 506 KB' 2236 KB 1354 KB 1291 KB
indiziert, dann RGB 771 KB' - 4442 KB 2119 KB


(') JPG-Qualität=90

Man sieht, wie die PNG-Bilder jeweils weniger Speicherplatz benötigen als die GIF-Bilder, wie jedoch die RGB-PNG-Versionen allesamt viel größer sind als die GIF-Bilder. Dies liegt jedoch einzig daran, dass für das Foto beim Abspeichern als GIF eine Farbquantisierung vorgenommen, d.h., die Anzahl der Farben künstlich verringert wurde.

ACHTUNG: Die jeweiligen Resultate variieren von Bild zu Bild. Insbesondere für Grafiken und da vor allem für solche mit weniger als 256 Farben können sich ganz andere Reihenfolgen bei den Dateigrößen ergeben. Ich denke jedoch, dass das ausgewählte Bild in gewisser Weise repräsentativ für Fotografien vieler Arten ist. Einwände gegen diese Aussage bitte auf die Diskussionsseite.

[Bearbeiten] Vergleich von JPG und PNG

JPG-Version (Q=95) minus PNG-Version von Bild:Chromosom.svg Mit stark erhöhten Kontrasten
vergrößern
JPG-Version (Q=95) minus PNG-Version von Bild:Chromosom.svg Mit stark erhöhten Kontrasten

Bei Grafiken, die häufig im Gegensatz zu Fotografien harte Kantenübergänge haben, gibt es bei JPG-Bildern das Problem des Gibbsschen Phänomens. Im nebenstehenden Bild hatten vor der Kontrasterhöhung 95,1% aller Pixel eine Helligkeit von 3 (von 255) oder weniger. Einzelne Pixel hatten jedoch Helligkeitswerte bis zu 40.

[Bearbeiten] Weblinks

THIS WEB:

aa - ab - af - ak - als - am - an - ang - ar - arc - as - ast - av - ay - az - ba - bar - bat_smg - be - bg - bh - bi - bm - bn - bo - bpy - br - bs - bug - bxr - ca - cbk_zam - cdo - ce - ceb - ch - cho - chr - chy - closed_zh_tw - co - cr - cs - csb - cu - cv - cy - da - de - diq - dv - dz - ee - el - eml - en - eo - es - et - eu - fa - ff - fi - fiu_vro - fj - fo - fr - frp - fur - fy - ga - gd - gl - glk - gn - got - gu - gv - ha - haw - he - hi - ho - hr - hsb - ht - hu - hy - hz - ia - id - ie - ig - ii - ik - ilo - io - is - it - iu - ja - jbo - jv - ka - kg - ki - kj - kk - kl - km - kn - ko - kr - ks - ksh - ku - kv - kw - ky - la - lad - lb - lbe - lg - li - lij - lmo - ln - lo - lt - lv - map_bms - mg - mh - mi - mk - ml - mn - mo - mr - ms - mt - mus - my - mzn - na - nah - nap - nds - nds_nl - ne - new - ng - nl - nn - no - nov - nrm - nv - ny - oc - om - or - os - pa - pag - pam - pap - pdc - pi - pih - pl - pms - ps - pt - qu - rm - rmy - rn - ro - roa_rup - roa_tara - ru - ru_sib - rw - sa - sc - scn - sco - sd - se - searchcom - sg - sh - si - simple - sk - sl - sm - sn - so - sq - sr - ss - st - su - sv - sw - ta - te - test - tet - tg - th - ti - tk - tl - tlh - tn - to - tokipona - tpi - tr - ts - tt - tum - tw - ty - udm - ug - uk - ur - uz - ve - vec - vi - vls - vo - wa - war - wo - wuu - xal - xh - yi - yo - za - zea - zh - zh_classical - zh_min_nan - zh_yue - zu

Static Wikipedia 2008 (no images)

aa - ab - af - ak - als - am - an - ang - ar - arc - as - ast - av - ay - az - ba - bar - bat_smg - bcl - be - be_x_old - bg - bh - bi - bm - bn - bo - bpy - br - bs - bug - bxr - ca - cbk_zam - cdo - ce - ceb - ch - cho - chr - chy - co - cr - crh - cs - csb - cu - cv - cy - da - de - diq - dsb - dv - dz - ee - el - eml - en - eo - es - et - eu - ext - fa - ff - fi - fiu_vro - fj - fo - fr - frp - fur - fy - ga - gan - gd - gl - glk - gn - got - gu - gv - ha - hak - haw - he - hi - hif - ho - hr - hsb - ht - hu - hy - hz - ia - id - ie - ig - ii - ik - ilo - io - is - it - iu - ja - jbo - jv - ka - kaa - kab - kg - ki - kj - kk - kl - km - kn - ko - kr - ks - ksh - ku - kv - kw - ky - la - lad - lb - lbe - lg - li - lij - lmo - ln - lo - lt - lv - map_bms - mdf - mg - mh - mi - mk - ml - mn - mo - mr - mt - mus - my - myv - mzn - na - nah - nap - nds - nds_nl - ne - new - ng - nl - nn - no - nov - nrm - nv - ny - oc - om - or - os - pa - pag - pam - pap - pdc - pi - pih - pl - pms - ps - pt - qu - quality - rm - rmy - rn - ro - roa_rup - roa_tara - ru - rw - sa - sah - sc - scn - sco - sd - se - sg - sh - si - simple - sk - sl - sm - sn - so - sr - srn - ss - st - stq - su - sv - sw - szl - ta - te - tet - tg - th - ti - tk - tl - tlh - tn - to - tpi - tr - ts - tt - tum - tw - ty - udm - ug - uk - ur - uz - ve - vec - vi - vls - vo - wa - war - wo - wuu - xal - xh - yi - yo - za - zea - zh - zh_classical - zh_min_nan - zh_yue - zu -

Static Wikipedia 2007:

aa - ab - af - ak - als - am - an - ang - ar - arc - as - ast - av - ay - az - ba - bar - bat_smg - be - bg - bh - bi - bm - bn - bo - bpy - br - bs - bug - bxr - ca - cbk_zam - cdo - ce - ceb - ch - cho - chr - chy - closed_zh_tw - co - cr - cs - csb - cu - cv - cy - da - de - diq - dv - dz - ee - el - eml - en - eo - es - et - eu - fa - ff - fi - fiu_vro - fj - fo - fr - frp - fur - fy - ga - gd - gl - glk - gn - got - gu - gv - ha - haw - he - hi - ho - hr - hsb - ht - hu - hy - hz - ia - id - ie - ig - ii - ik - ilo - io - is - it - iu - ja - jbo - jv - ka - kg - ki - kj - kk - kl - km - kn - ko - kr - ks - ksh - ku - kv - kw - ky - la - lad - lb - lbe - lg - li - lij - lmo - ln - lo - lt - lv - map_bms - mg - mh - mi - mk - ml - mn - mo - mr - ms - mt - mus - my - mzn - na - nah - nap - nds - nds_nl - ne - new - ng - nl - nn - no - nov - nrm - nv - ny - oc - om - or - os - pa - pag - pam - pap - pdc - pi - pih - pl - pms - ps - pt - qu - rm - rmy - rn - ro - roa_rup - roa_tara - ru - ru_sib - rw - sa - sc - scn - sco - sd - se - searchcom - sg - sh - si - simple - sk - sl - sm - sn - so - sq - sr - ss - st - su - sv - sw - ta - te - test - tet - tg - th - ti - tk - tl - tlh - tn - to - tokipona - tpi - tr - ts - tt - tum - tw - ty - udm - ug - uk - ur - uz - ve - vec - vi - vls - vo - wa - war - wo - wuu - xal - xh - yi - yo - za - zea - zh - zh_classical - zh_min_nan - zh_yue - zu

Static Wikipedia 2006:

aa - ab - af - ak - als - am - an - ang - ar - arc - as - ast - av - ay - az - ba - bar - bat_smg - be - bg - bh - bi - bm - bn - bo - bpy - br - bs - bug - bxr - ca - cbk_zam - cdo - ce - ceb - ch - cho - chr - chy - closed_zh_tw - co - cr - cs - csb - cu - cv - cy - da - de - diq - dv - dz - ee - el - eml - en - eo - es - et - eu - fa - ff - fi - fiu_vro - fj - fo - fr - frp - fur - fy - ga - gd - gl - glk - gn - got - gu - gv - ha - haw - he - hi - ho - hr - hsb - ht - hu - hy - hz - ia - id - ie - ig - ii - ik - ilo - io - is - it - iu - ja - jbo - jv - ka - kg - ki - kj - kk - kl - km - kn - ko - kr - ks - ksh - ku - kv - kw - ky - la - lad - lb - lbe - lg - li - lij - lmo - ln - lo - lt - lv - map_bms - mg - mh - mi - mk - ml - mn - mo - mr - ms - mt - mus - my - mzn - na - nah - nap - nds - nds_nl - ne - new - ng - nl - nn - no - nov - nrm - nv - ny - oc - om - or - os - pa - pag - pam - pap - pdc - pi - pih - pl - pms - ps - pt - qu - rm - rmy - rn - ro - roa_rup - roa_tara - ru - ru_sib - rw - sa - sc - scn - sco - sd - se - searchcom - sg - sh - si - simple - sk - sl - sm - sn - so - sq - sr - ss - st - su - sv - sw - ta - te - test - tet - tg - th - ti - tk - tl - tlh - tn - to - tokipona - tpi - tr - ts - tt - tum - tw - ty - udm - ug - uk - ur - uz - ve - vec - vi - vls - vo - wa - war - wo - wuu - xal - xh - yi - yo - za - zea - zh - zh_classical - zh_min_nan - zh_yue - zu