Zusammenfassung für die Verwendung in Digitalen Medien
Die meisten Bildverarbeitungs- und DTP-Programme wie Adobe Photoshop, InDesign, Illustrator und Acrobat definieren den Punkt als 1/72 Inch. Sobald Sie Ihre Datei in Photoshop (Pixelbasiert) als .jpg ausgeben ignoriert Photoshop Ihre Angabe die Sie im Feld "Auflösung" machen. Also vollkommen egal ob Sie hier 72 ppi oder 144 ppi eingeben. Aus einer Datei mit 1000 x 1000 Pixel wird eine Datei mit 1000 x 1000 Pixel generiert. Noch konkreter: Eine Datei in Photoshop mit 1000 x 1000 Pixel als .jpg mit 72 ppi ausgegeben entspricht einer Datei mit 1000 x 1000 Pixel als .jpg mit 144 ppi ausgegeben. Beide haben genau die gleiche Dateigrösse (KB). Sie können die Grösse in Pixeln Ihres Bildes sehr einfach prüfen, indem Sie das Bild per drag and drop in Ihren Browser (z. B. Firefox) ziehen und sich dort die Informationen zum Bild anzeigen lassen.
Adobe InDesign hingegen legt bei der Generierung von .jpg Dateien den DTP-Punkt (pt) als Basis fest. Ein Bild in der Grösse 1000 x 1000 Pixel das sie mit 144 ppi ausgeben (72 ppi x 2) wird als Datei mit 2000 x 2000 Pixel (1000 x 2) gespeichert.
Am Ende zählt also ausschliesslich die Breite und Höhe Ihres Bildes und die Dateigrösse in KB. Ein Bild in der Grösse 1000 x 1000 Pixel wird auf dem Monitor entsprechend mit 1000 x 1000 Pixel dargestellt. Was nicht bedeutet, dass dies bei jedem Monitor in cm den gleichen Wert entspricht, da es auf dem Markt extrem viele unterschiedliche Monitore mit unterschiedlichen Auflösungen gibt.
Die Sache mit der Qualität
Bevor wir über reine Zahlen sprechen ist dieser Punkt enorm wichtig: Ein Bild – egal ob es in Digitalen oder Printmedien Verwendung findet – muss Ihre Zielgruppe ansprechen und möglichst einzigartig sein. Nicht nur Ihre Kundinnen und Kunden, auch Google sieht mit und analysiert ob der Inhalt im Bild zum Content Iherer Internetseite und Ihrer Bildbeschreibung sowie Dateibezeichnung passt und ob das Bild auch auf anderen Seiten verwendet wird. Nutzen Sie um dies zu prüfen die Bildersuche von Google und laden sie hier das betroffene Bild hoch (Rückwärtssuche). Wir empfehlen allen unseren Kundinnen und Kunden insbesondere bei dauerhaftem Content das Geld zu investieren und eigene Bilder zu erstellen bzw. erstellen zu lassen.
Dots per Inch und Pixels per Inch
Dots per Inch (dpi = Punkte pro Zoll) beziehen sich auf Printmedien und Pixels per Inch (ppi = Pixel pro Zoll) auf Digitale Medien. Diese Angaben beschreiben die Auflösung oder Klarheit eines Bildes - man spricht hier auch gerne von Punkt- oder Pixeldichte. Ein Inch, also ein Zoll, entspricht 2,54 cm.
Auflösung von Druckern und Monitoren
Drucker (auch unterschiedliche Druckverfahren und Druckmaschinen in Druckereien) und Monitore können ganz unterschiedliche Auflösungen umsetzen bzw. darstellen. Dabei gilt: Je besser die Auflösung desto näher kann ich an das Gerät (Monitor oder das Display eines Mobiltelefons oder Tablets) oder das Druckergebnis (von der Visitenkarte über den Katalog bis hin zur Plakatwand) herangehen ohne dabei einzelne Bildpunkte oder Pixel zu sehen.
Ein Drucker hat keine 300 dpi und ein Monitor keine 72 dpi
Genau so wenig wie ein Auto 100 PS und ein LKW 500 PS haben, hat ein Drucker 300 dpi und ein Monitor 72 dpi. Ein bestimmtes Auto mit einem bestimmten Motor eines bestimmten Herstellers kann eine bestimmte maximale Leistung abrufen. Ein Drucker, der eine Auflösung von 300 dpi umsetzen kann, kann auch Ihr Bild mit 150 dpi drucken. Es wirkt dann eben je näher Sie an das Bild heran gehen "verpixelt". Ein MacBook Pro mit Retina Display muss hingegen immer 227 ppi darstellen, ein iPhone 11 Pro Max 458 ppi. Wieso "muss" und welche Auswirkungen das auf Ihre Bilder hat, später mehr.
Das feste Mass beim Drucken
An welchem Mass können wir uns denn jetzt orientieren? Bei Druckern ist das recht einfach: Ein Zoll ist ein Zoll. Wenn ich ein Quadrat mit Kantenlänge einem Zoll, also 2,54 cm x 2,54 cm Drucken will, dann bleiben 2,54 cm immer 2,54 cm. Vollkommen egal wie hoch die Punktdichte (dpi) innerhalb des Quadrats definiert ist. Die Punktdichte und der Komprimierungsfaktor haben Auswirkungen auf die Bildqualität und die Dateigrösse (den Speicherplatz den die Datei auf Ihrer Festplatte einnimmt).
Das feste Mass bei Monitoren
Jetzt wird es spannend und hier erfahren Sie auch den Grund wesshalb wir Kundinnen und Kunden die selber Content für Websites erstellen empfehlen Ihre Bilder mit 72 dpi und Komprimierung unter 80 % auszugeben. Der erste Grund ist: Sie haben einfach keine Chance gegen jahrzehnte lang verbreitetes Halbwissen anzukämpfen. Der zweite Grund ist: Es gibt mehr Faktoren, die eine eher dynamische und vor allem dem Verbreitungsmedium als auch der verwendeten Software (Typo3, WordPress, Odoo, etc.) angepasste Bildbearbeitung erfordert. Dazu später mehr.
Ein Computer mit einem 15,4 Zoll Monitor (Bildschirmdiagonale) und einer Auflösung von 2880 x 1800 Pixeln löst 220 Pixel pro Zoll also 220 ppi auf.
Einfache Mathematik: 15,4 inch (39,1 cm) -> bei einem Seitenverhältnis von 16:10 bzw. 8:5 = 13,1 inch x 8,2 inch (33,2 cm x 20,7 cm) -> 2880 px / 13,1 inch = 220 ppi. Das Glleiche gilt für die Höhe und ist am Rande bemerkt eine Elementare Grundlage um Digitale und Printmedien zu erstellen: Sie sollten dazu immer Monitore mit quadratischen Pixeln kaufen.
Der Drucker kann, der Monitor muss
Was der Drucker kann, muss der Monitor. Wenn mein Raster nicht veränderbar, ist, dann haben unterschiedliche Rastergrössen (Pixeldichten) gezwungener Massen Einfluss auf die Darstellungsgrösse. Ein Monitor mus den ihm vorgegeben Raster nutzen, denn er kann diesen physisch nicht verändern. Bleiben wir bei unserem Beispiel: Auf meinem 15,4" Monitor mit 220 ppi wird ein Quadrat mit 2,54 cm (1 Zoll) Kantenlänge auch mit 2,54 cm Kantenlänge nur dann dargestellt, wenn ich es mit genau diesen Werten speichere. Ich generiere also ein Bild mit 220 x 220 Pixeln. Folglich würde das gleiche Bild (2,54 cm x 2,54 cm) aber mit 72 ppi gespeichert nur mit 72 x 72 Pixeln auf meinem Monitor dargestellt. Wer mit Photoshop arbeitet kann das sehr einfach überprüfen: Ansicht -> 100 %. Wer am MAC die Vorschau nutzt, stösst auf einen kleinen Fehler. Zuerst muss in den Einstellungen bei "Bilder" die 100 % Bildschirmgrösse angepasst werden -> Bildschirmgrösse entspricht Druckgrösse. Danach im Menü Darstellung -> Originalgröße auswählen. Hoffen wir, dass dieser "Logikfehler" bald behoben wird.
Das Beispiel
Um diesen Zusammenhang zu veranschaulichen haben wir ein simples Beispiel anahnd zweier Qudrate veröffentlicht:
Alles Interpretationssache
Das schöne Beispiel des zuvor beschriebenen Fehlers in der Vorschau bei MAC Computern zeigt wunderbar auf, dass wir nun noch eine weitere Komponente betrachten müssen: Ihre Darstellende Software manipuliert Ihre Bilder. Sie müssen erst ganz sicher sein, dass auf Ihrem Monitor das Bild wirklich mit 100 % Bildgrösse dargestellt wird – also 1 Pixel in Ihrem Bild auch einem Pixel auf Ihrem Monitor entspricht. Genau das gleiche passiert bei Content Management Systemen wie Typo3, WordPress oder Odoo: Die Software, die auf Ihrem Server installiert ist kann das von Ihnen hochgeladene Bild beim Hochladen verändern (z. B. Komprimieren) und später bei der Darstellung auf unterschiedlichen Engräten auch in unterschiedlichen Formaten, Seitenverhältnissen, Pixelgrössen, Komprimierungsvarianten und somit Dateigrössen ausgeben. Hinzu kommt die Art der Interpretation durch Ihren verwendeten Browser.
72 dpi und PostScript oder: Wie gross ist eigentlich ein Punkt?
Um aus Ihrem Bildbearbeitungs- oder DTP Programm eine veröffentlichbare Datei zu generieren muss dem ganzen ein offizielles Maß zugrunde gelegt werden, mit dem alle Programme arbeiten.
Als Einheit dient der so genannte DTP-Punkt (pt), gelegentlich auch PostScript-Punkt genannt, der als 864te Teil des englischen foot von 1959 definiert wurde. Er misst also exakt 1/72 Zoll. Da ein Zoll (oder Inch) 2,54 cm lang ist, erhalten wir: 1 Punkt = 1/72 Zoll = 2,54 cm/72 = 0,35 mm
Was ist denn nun der richtige ppi Wert für die Monitordarstellung?
Betrachten wir sämtliche vorher gemachte Ausführungen so muss die Antwort lauten:
1. Für Alle, die einen Apple Macintosh aus dem Jahr 1984 mit einem 9 Zoll Monitor (512 x 324 Pixel) haben und Grafiken nur für dieses Gerät erstellen: 72 ppi.
2. Für Alle, die pauschal möglichst hoch auflösende Bilder bei schnellen Ladezeiten im Web verwenden wollen: nicht mer als 2000 Pixel, maximal 144 ppi (2x72 dpi), Grosse Bilder mit ca. 60 % Komprimierung (.jpg), kleine Bilder mit ca. 80 % Komprimierung (.jpg). Achtung: Ihre angelegte Datei sollte, wenn Sie diese mit 144 ppi ausgeben 1000 Pixel betragen und wenn sie diese mit 72 dpi ausgeben 2000 Pixel. Da Ihre Bildbearbeitungs- und DTP Programme im DTP Punkt-Raster arbeiten.
3. Für Alle die hochqualitativen Webcontent generieren wollen empfiehlt es sich genau zu wissen was das verwendete CMS macht und dann die Bilder individuell in Grösse, Auflösung, Komprimierung, Dateigrösse und unterschiedliche Darstellungsvarianten anzupassen. Wir haben hier enorme Erfahrungswerte mit Odoo gesammelt und haben den Anspruch so zu arbeiten, dass wir auch zukünftige neue Versionen einzuschätzen versuchen und Ihre Bilder so generieren, dass diese auch in 2 Jahren noch klar und scharf auf Endnutzendengeräten dargestellt werden.
dpi oder ppi und RGB oder CMYK?
Ein Inch (Zoll) ist ein Inch, ein Pixel ein Pixel und ein Punkt (Dot) ein Punkt. Sie sollten Bilder für den Druck immer in Zentimetern (Farbraum CMYK) und Bilder für Digitale Medien immer in Pixeln (Frabraum RGB) be- und verarbeiten. Verwenden Sie dabei immer das Originalbild, denn das hin- und herwandeln unterscheidlicher Farbräume verändert jedesmal Ihr Bild. Ihre Digitalkamera oder Ihr Mobiltelefon generiert Bilder im RGB Farbraum. Also verwenden Sie auch dieses Bild für Digitale Medien. Die Komprimierungsmethode .jpg führt hinzu bei Bildern im CMYK Farbraum oft zu Fehlern oder nicht lesbaren Dateien. Ein Thema das es in einem weiteren Blogbeitrag zu beleuchten gilt.
Welche Auflösungen sind sonst noch relevant?
Grundsätzlich hat sich bei Druckereien der Wert 300 dpi und für Grossformate wie Plakatwände oder Banner 150 dpi "durchgesetzt". Meist erhalten Sie die notwendigen Angaben bei Angebotserstellung von Ihrer Druckerei. Wichtig ist, dass Sie Schriften entweder in den Dateien einbetten oder als Vektordaten umwandeln, denn wenn Sie diese als Bilddatei ausgeben wollten, müssten Sie diese mit 1.400 dpi rastern um ein sauberes Druckbild zu erhalten. Auch zu diesem Thema erstellen wir einen eigenen Blogbeitrag. Wir empfehlen, um Präsentationen z. B. in PowerPoint nicht zu gross werden zu lassen, Bilder mit 150 dpi / ppi einzufügen. So kann die Datei noch per E-Mail versendet und auch gedruckt werden. Eine Alternative ist natürlich die Bilder mit 300 dpi einzubinden und die Präsentation als PDF auszugeben und danach zu komprimieren.