Bildformate – JPEG, PNG, GIF, TIFF

JPEG, PNG, GIF, TIFF, … es gibt so viele Bildformate. Doch wann ist welches Bildformat geeignet? Du willst auf allen Kanälen und Geräten die bestmögliche Bildqualität gewährleisten, ohne die Qualität oder die Ladezeit zu beeinträchtigen. Welches Format sollst du z.B. für ein Logo oder Druckerzeugnis verwenden? Was sind die Vor- und Nachteile all dieser Bildformate? Was ist der Unterschied zwischen Raster und Vektor Grafiken? All diese Fragen werden wir in diesem Artikel beantworten.

Vergleich der wichtigsten Bildformate

Weiter unten findest du unsere Liste mit den 11 bekanntesten Bildformaten und ihrem besten Einsatzzweck. Hier aber schon einmal ein kurzer Überblick für die, die es eilig haben.

	Vektor/Pixel	Komprimierung	Pro	Kontra	Anwendung
JPEG	Pixel	Mit Verlust	Das JPEG-Bildformat wird von allen Betriebssystemen unterstützt. Es ist eines der am meisten verbreiteten Bildformate. Das Verhältnis von Bildqualität zu Dateigröße ist gut.	JPEG unterstützt keine Transparenzen und keine Animationen. Zudem kann es Qualitätsverluste nach mehrfachem Speichern geben.	Grosse, detailreiche Bilder zum Versenden, Abspeichern oder auf Websites
GIF	Pixel	Ohne Verlust	Das GIF-Format hat eine sehr kleine Dateigröße. Dabei unterstützt es auch noch Animationen.	Es gibt heute bessere und neuere Bildformate. Auch werden nur 256 Farben unterstützt.	Websites, Chats, Schaltflächen, Navigationsmenüs, Symbole und grafische Texte
PNG	Pixel	Ohne Verlust	Das PNG-Format unterstützt den Alpha-Kanal bei der Transparenz. Dieser ist neuer und moderner als der des GIF-Formats. Zudem verwirft das Bildformat, im Vergleich zu anderen Bildformate, beim erneuten Speichern keine Informationen.	Der grösste Nachteil steckt in der Dateigrösse. Diese ist im Vergleich zum JPEG-Format riesig. Zudem wird das Format nicht überall unterstützt.	Icons, transparente oder halbtransparente Bereiche bei Bildern oder Logos – dies auch wieder speziell bei Webseiten.
TIFF	Pixel	Normalerweise nicht komprimiert: ohne Verlust. Aber wenn komprimiert: mit Verlust	Keine Qualitätsverluste, da nicht komprimiert. Qualitativ hochwertig und genau. Zudem wird auch wieder die Kanaltransparenz unterstützt.	Format nicht überall unterstützt wird und es nicht mit Webbrowsern kompatibel ist, was eine Verwendung auf Webseiten ausschließt. Zudem sind die Dateigrößen sehr groß.	Druck
SVG	Vektor	Ohne Verlust	Das SVG-Format bietet eine sehr hohe Qualität. Durch das Verwenden von Vektoren gibt es nach der Skalierung oder nach dem Zoomen keinen Qualitätsverlust.	Braucht spezielle Software zur Bearbeitung oder HTML Kenntnisse.	Druck, Logos und für Webseiten.

Verlustreiche und verlustfreie Komprimierung

Einige Eigenschaften der Bildformate mit Begriffen wie «verlustbehaftete und verlustfreie Kompression» oder «Raster» und «Vektor» mögen für dich ungewohnt klingen. Daher erklären wie dir als erstes, was es damit auf sich hat. Das Komprimieren von Dateien spart viel Speicherplatz und erleichtert auch die gemeinsame Nutzung von Dateien. Welche Dateikomprimierung du verwenden solltest, hängt davon ab, ob du die Originaldaten einer Datei behalten möchtest.

Verlustreiche Kompression bedeutet, dass Daten aus dem Bild teilweise entfernt, oder Informationen zu Bildpunkten reduziert werden. Die Farben werden dann durch eine mathematische Formel neu berechnet. Es kann ein sichtbarer Qualitätsverlust entstehen. Oft spielt aber die Bildqualität keine sehr grosse Rolle – z.B. auf social Media, wo die Bilder sowieso nur überflogen werden.

Die verlustfreie Komprimierung erhält die Bildqualität und versucht gleichzeitig, die geringe Dateigröße zu erhalten. Sie gruppiert alle Pixel in die gleiche Farbkategorie, was die Indexierung erleichtert und entfernt oft auch die Meta Daten eines Bildes.

Wann brauchst du also eine verlustreiche – und wann eine verlustfreie Kompression?

Wenn es dir egal ist, dass du ein Teil der Qualität der Datei verlierst um Speicherplatz zu sparen, dann wähle ein Bildformat mit verlustreicher Kompression. Wenn das Sparen von Speicherplatz nicht deine Priorität ist und du deine Datei im Originalzustand halten möchtest, entscheide dich für eine verlustfreie Kompression.

Bildformate mit Vektoren und Rastern

Bildformate mit Raster

Rasterbilder werden aus einer Reihe von Pixeln oder einzelnen Blöcken zusammengesetzt, um ein Bild zu erzeugen. JPEG, GIF und PNG sind alles Bildformate mit Rasterbilderweiterungen. Pixel haben aufgrund ihrer definierten Größe einen fixen Anteil am Bild. Wenn du nun ein Bild vergrößert oder verziehst, werden die Pixel gestreckt, um den Raum zu füllen. Damit werden sie verzerrt, was zu verschwommenen oder unscharfen Bildern führt.

Um die Pixelqualität zu erhalten, kannst du die Größe von Rasterbildern nicht ändern, ohne die Auflösung zu beeinträchtigen. Daher ist es wichtig, daran zu denken, Rasterdateien genau in den für die Anwendung erforderlichen Abmessungen zu speichern. Du kannst das Bild natürlich jederzeit ohne Qualitätsverlust in einer kleineren Abmessung (aber im gleichen Bildformat) speichern. Vergrößern geht jedoch nicht ohne spürbaren Verlust. Das hast du sicher auch schon einmal festgestellt.

Vektor-Bildformate

Vektorbilder sind wesentlich flexiblere Bildformate. Sie sind aus proportionalen Formen und nicht aus Pixeln aufgebaut. EPS, AI und PDF sind perfekt für die Erstellung von Grafiken, die eine häufige Grössenänderung erfordern. Dein Logo und deine Markengrafiken sollten als Vektor erstellt worden sein und du solltest immer eine Masterdatei zur Hand haben. Die wahre Schönheit von Vektoren liegt in ihrer Fähigkeit sich beliebig in der Grösse zu wandeln. So klein wie eine Briefmarke oder gross genug, um auf eine Hauswand zu passen. Alles immer in der gleichen Qualität.

Wenn du dir nicht sicher bist, ob du eine Vektor-Version deines Logos hast, ist hier ein kleiner Trick für dich: Rufe das Unternehmen an, das deine Visitenkarten gedruckt hat, oder den Lieferanten, der dein Logo auf ein Hemd gestickt hat. Oftmals haben sie eine Vektor-Datei deines Logos noch, die sie dir für deine Unterlagen zusenden können.

Hohe vs. geringe Auflösung

Hast du je einen Designer über DPI oder PPI sprechen hören? DPI steht für „dots per inch“ und PPI bedeutet „pixels per inch“. Diese Maßeinheiten sind unerlässlich, um festzustellen, ob die Dichte der Pixel in einem Bild für die von dir verwendete Anwendung geeignet ist. Das Wichtigste, was du bei der Bestimmung der benötigten DPI oder PPI beachten solltest, ist, ob du das Bild für Druck oder Web verwendest.

Websites zeigen Bilder in einer Auflösung von 72 DPI an, was eine niedrige Auflösung ist; Bilder in dieser Auflösung sehen jedoch im Web wirklich scharf aus.
Beim Druck ist dies nicht der Fall. Für das Drucken eines Bildes ist es essenziell, dass es nicht weniger als 300 DPI sind.

Diese Angaben sind essenziell, da sich die Bildformate darin stark unterscheiden können.

Versuche nicht, das System zu hintergehen. In Photoshop oder alternativen Programmen zur Bildbearbeitung kannst du vieles herbeizaubern – das Erstellen von Pixeln aus der Luft gehört aber leider nicht dazu. Ein Bild vom Web zu ziehen und zu versuchen, es an die Dimensionen deines Druckprojekts anzupassen, wird einfach nicht funktionieren. Du wirst am Ende ein verpixeltes Bild erhalten, das gestreckt und verzerrt erscheint.

11 verschiedene Bildformate

JPEG (oder JPG) – Joint Photographic Experts Group

Das JPEG-Bildformat ist das meist verwendete Bildformat. Das 1992 von der „Joint Photographic Experts Groups“ entwickelte Bildformat ist eine verlustbehaftete Kompression für digitale Bilder. Die verwendete Kompression ist die diskrete Cosinus-Transformation, die den Rahmen durch einen mathematischen Prozess in eine 2D-Domäne umwandelt. Durch die verlustbehaftete Komprimierungsmethode verlieren die Bilder bei der Bearbeitung und mehrmaligen Speicherung ihre Qualität. Bildbearbeitungsprogramme geben dem Benutzer die Möglichkeit zu wählen, wie stark das Bild komprimiert werden soll. JPEG ist nicht geeignet für Logos oder Symbole, die eine angemessene Skalierbarkeit erfordern. JPEG Bildformate sind perfekt für farbenfrohe Fotos und Bilder mit überblendenden Farbtönen.

PNG - Portable Network Graphics

Die PNG-Erweiterung ist eine verbesserte Bildformate-Version der GIF-Erweiterung. Da das GIF nur begrenzte Möglichkeiten hatte, wurde das PNG-Format eingeführt. Die begrenzte Farbunterstützung von GIF (siehe nächster Abschnitt) war einer der Gründe, warum man PNG entwickelte. Computer wurden immer fortschrittlicher und waren in der Lage, eine größere Vielfalt an Farben zu erzeugen. PNG-Bilder werden in zwei Stufen komprimiert, nämlich vorkomprimiert und die verlustfreie Datenkompression, auch „deflate“ genannt. Diese Methode, die den Komprimierungsprozess verzögert, verringert die Dateigröße nicht und macht sie größer als die aggressivere Komprimierung bei anderen Bildformaten, wie zum Beispiel dem verlustbehafteten JPEG-Format. PNG und JPEG unterscheiden sich in der Qualität nicht sehr stark, wenn es um detailreiche Fotos geht. Die Dateigröße von PNG ist nur viel größer. PNG eignet sich daher am besten für Bilder mit Bereichen mit viel Vollfarbe und scharfen Übergängen.

GIF - Graphics Interchange Format

Wenn wir an GIF Bildformate denken, geht unser erster Gedanke an lustige Katzenbilder. Das Graphic Interchange Format ist ein Bitmap-Videoformat, das Steve Wilhite 1987 entwickelte. Die verlustfreie Datenkompression wird durch den Lempel-Ziv-Welch-Algorithmus aufgebaut. Der Algorithmus kodiert 8-Bit-Daten als 12-Bit-Codes mit fester Länge. Aufgrund der 24-Bit-RGB-Farbunterstützung (bis zu 256 Farben) ist die GIF-Erweiterung nicht für farbstarke Fotos geeignet. Für diesen Dateityp werden Grafiken mit Volltonfarben empfohlen. Da die GIF-Erweiterung ziemlich alt ist, ist sie nicht wirklich für den modernen Gebrauch geeignet. Da der Dateityp für Bannerwerbung verwendet wird, wird er jedoch durch dynamischere HTML-5-Formate wie SVG ersetzt.

TIFF - Tagged Image File

Ein TIFF ist eine große Rasterdatei, die keine Qualitätseinbussen erleidet. Dieser Dateityp ist bekannt für die Verwendung von „verlustfreier Komprimierung“, d.h. dass man die Originalbilddaten beibehält, unabhängig davon, wie oft du die Originaldatei kopierst, erneut speicherst oder komprimierst. Obwohl TIFF Bildformate nach der Manipulation ihre Qualität wiederherstellen können, solltest du es vermeiden, diesen Dateityp im Web zu verwenden – das Laden kann nämlich ewig dauern. Ein Albtraum für jede professionelle Fotografen-Website. TIFF-Dateien werden auch häufig beim Speichern von Fotos zum Drucken verwendet.

SVG - Scalable Vector Graphics

Vektorbasierte Bildformate helfen Designern, Bilder zu erstellen, die für eine unbegrenzte Skalierung geeignet sind. Das SVG, ein vom W3C entwickeltes XML-basiertes Vektorformat, unterstützt Designer bei der Erstellung von Designs, die ohne Qualitätsverlust einfach skaliert werden können. Das SVG-Dateiformat wird von den meisten modernen Webbrowsern unterstützt. SVG-Erweiterungen werden durch gzip komprimiert. Da die Dateien XML-basiert sind, können sie von vielen verlustfreien Datenkompressionsalgorithmen analysiert werden. Dies macht das Dateiformat sehr vielseitig und macht es bei vielen Designern zur Erstellung von Drucksachen und Logos beliebt.

Beispielbilder mit Vektoren

PSD - Photoshop Document

PSDs sind Dateien, die Adobe Photoshop, die beliebteste Grafikbearbeitungssoftware aller Zeiten, erstellt und speichert. Diese Art von Datei enthält „Ebenen“, die das Ändern des Bildes wesentlich einfacher machen. Dies ist auch das Programm, das die oben genannten Rasterdateitypen erzeugt. Der größte Nachteil der Photoshop Bildformate ist, dass Photoshop mit Rasterbildern und nicht mit Vektorbildern arbeitet.

PDF - Portable Document Format

PDFs wurden von Adobe mit dem Ziel entwickelt, umfangreiche Informationen aus jeder Anwendung, auf jedem Computer, mit jedem und überall zu erfassen und zu überprüfen. Ich würde sagen, sie waren bisher ziemlich erfolgreich. Wenn ein Designer deine Vektor-Dateien in PDF-Formaten speichert, kannst du sie ohne jegliche Designbearbeitungssoftware ansehen (sofern du die kostenlose Acrobat Reader-Software heruntergeladen hast). Zudem hat er die Möglichkeit, diese Datei für weitere Bearbeitungen zu verwenden. Dies ist bei weitem das beste universelle Werkzeug zum Teilen von Grafiken.

EPS - Encapsulated Postscript

EPS ist eine Datei im Vektorformat, die man für die Erstellung hochauflösender Grafiken für den Druck entwickelt hat. Fast jede Art von Designsoftware kann ein EPS erstellen. Die EPS-Erweiterung ist eher ein universeller Dateityp (ähnlich wie das PDF), mit dem du vektorbasierte Grafiken in jedem Design-Editor öffnen kannst – nicht nur in den gängigsten Adobe Produkten. Dadurch wird sichergestellt, dass man Dateien an Designer übertragen kann, die keine Adobe-Produkte, aber möglicherweise Corel Draw oder Quark verwenden.

AI - Adobe Illustrator Document

AI ist das von Designern bei Weitem am häufigsten bevorzugte Bildformat. Warum? Es hat sich zu so etwas wie einem Standard in der Grafikerszene etabliert. So können auch verschiedene Agenturen an einem Projekt arbeiten. Adobe Illustrator ist der Industriestandard für die Erstellung von Artwork. Daher ist es höchstwahrscheinlich das Programm, in dem dein Logo ursprünglich erstellt wurde. Illustrator erstellt Vektorgrafiken, den einfachsten Dateityp, den man bearbeiten kann. Adobes Illustrator kann auch alle oben genannten Dateitypen erzeugen. Ziemlich cooles Zeug! Es ist bei Weitem das beste Werkzeug im Arsenal aller Designer.

INDD - Adobe Indesign Document

INDDs (Indesign Document) sind Dateien, die Adobe Indesign erstellt und speichert. Mit Indesign werden häufig größere Publikationen wie Zeitungen, Zeitschriften und E-Books erstellt. Du kannst Dateien aus Adobe Photoshop und Illustrator in Indesign kombinieren, um inhaltsreiche Designs zu erstellen, welche erweiterte Typografie, eingebettete Grafiken, Seiteninhalte, Formatierungsinformationen und andere anspruchsvolle Layoutoptionen enthalten.

Ein RAW-Bild ist der am wenigsten verarbeitete Bildtyp in dieser Liste. Es ist oft das erste Format, das ein Bild beim Erstellen hat. Wenn du ein Foto mit deiner Kamera aufnimmst, ist es sofort in einem RAW-Bild gespeichert. RAW ist sozusagen das „Negativ“ eines Bildes, das erst noch entwickelt werden muss. Heute geschieht das digital, meist bereits innerhalb der Kamera wird ein entwickeltes JPEG Bild angelegt, damit du es auch gleich betrachten und auf den PC übertragen kannst.

RAW-Bildformate sind wertvoll, weil sie jedes Element eines Fotos erfassen, ohne es zu verarbeiten oder kleine visuelle Details zu verlieren. Irgendwann wirst du sie jedoch in eines der Raster- oder Vektor-Bildformate packen, damit du sie für verschiedene Zwecke übertragen und in der Größe verändern kannst.

Verschiedene RAW Bildformate

Es gibt mehrere RAW Bildformate, in denen du Bilder erstellen kannst. Viele davon sind nativ für bestimmte Kameras. Hier ist eine kurze Beschreibung der vier verbreitetsten RAW Bildformate:

CR2: Diese Dateiendung steht für Canon RAW 2. Sie basieren eigentlich auf dem TIFF Bildformat, wodurch sie von Natur aus, wie andere Bildformate, qualitativ hochwertig sind.
CRW: Diese Dateiendung ist der Vorgänger des CR2.
NEF: Diese Dateiendung steht für Nikon Electric Format. Diese Bildformate ermöglichen tatsächlich eine umfangreiche Bearbeitung ohne Änderung der Bildformate, sofern die Bearbeitung mit einem Nikon-Gerät oder Nikon Photoshop-Plugin erfolgt.
PEF: Diese Dateiendung steht für Pentax Electronic Format.
ARW: Die Dateiendung steht für das Sony RAW-Format.

Zusammenfassung der Bildformate

Es gibt viele verschiedene Bildformate mit underschiedlichen Eigenschaften und optimalen Einsatzgebieten.

Dabei muss man zwischen Raster- und Vektor-Bildformaten unterscheiden. Rasterformate können, im Vergleich zu Vektorformaten, nicht verlustfrei in der Grösse verändert werden.

Das bekannteste der Bildformate ist JPEG, auch JPG genannt. Es braucht wenig Speicherplatz, bietet aber nicht die beste Qualität.

Bildformate – JPEG, PNG, GIF, TIFF

Vergleich der wichtigsten Bildformate

Verlustreiche und verlustfreie Komprimierung

Wann brauchst du also eine verlustreiche – und wann eine verlustfreie Kompression?