Auflösung, DPI, PPI, Pixel: Zusammenhänge erklärt

DPI, PPI, Pixel, Auflösung, Bildgröße: Fachbegriffe erklärt

Sicherlich sind Ihnen diese Begriffe schon mal begegnet. Als Sie Bilder zum Druck an einen Verlag oder Copy Shop liefern sollten, mussten Sie sich an Maße in Zentimetern und Druckauflösungen in DPI halten. Wenn Sie ein Foto ins Web laden, wird eine empfohlene "Auflösung" in Pixeln angegeben.

Was ist der Unterschied zwischen den Werten, und welche Risiken bringt es mit sich, wenn man sie verwechselt?

Heute schauen wir uns an, was diese Fachbegriffe bedeuten.

Was sind Pixel?

Pixel sind Bildpunkte.

Schauen wir uns mal ein Foto an, das ich Ende 2020 geschossen habe.

Das folgende Bild ist 600 Pixel breit und 155 Pixel hoch. Seine Bildgröße ist 600x155 Pixel. Diese Pixel können wir ganz klar sehen, wenn wir hereinzoomen.

Animation: Zoom auf Pixel
Durch Hereinzoomen können wir einzelne Pixel in diesem 600x155 Pixel großen Foto sehen.

600 mal 155, das sind 93.000 winzige Bildpunkte, aus denen dieses Raster-Bild zusammengesetzt ist. Sie können sehen, dass diese Bildpunkte auf dem PC quadratischer Form sind.

Was bedeutet "Auflösung"?

Von einer "Auflösung" spricht man interessanterweise sowohl, wenn es um Bilder auf Computern geht, wie auch bei ausgedruckten Bildern.

Das kann für Verwirrung sorgen. Klarer wäre es, wenn man beim PC von der Bildgröße spräche, und beim Druck von der Druckauflösung. Aber so isses nu' mal.

Sie können sich merken, dass der Begriff beides bedeuten kann:

  • Am PC bedeutet (Bild-)Auflösung die Bildgröße in Pixeln, z.B. 6000x4000 Pixel.
  • Im Druck beeinflusst (Druck-)Auflösung die Größe, in der ein Bild gedruckt wird.

Auflösung am Computer: Pixel und Dateigröße

Das Foto, das Sie oben sehen ist im Original 7933 Pixel breit und 2551 Pixel hoch (ich habe das Panorama hinbekommen, indem ich Einzelbilder geschossen und am PC nebeneinander zusammengesetzt habe).

Supergroße Bilder bedeuten auch supergroße Dateien, die am Ende ein armer Smartphonebenutzer mit seinem begrenzten Datentarif laden muss, während seine Mittagspause davontickt.

Die Auflösung (in Computersprache) des Bildes ist im Original also 7933x2551 Pixel. Das gibt eine richtig große Datei. Wenn man es herunterskaliert, werden seine Abmessungen und die Dateigröße wesentlich kleiner.

Bild in 7933x2551 Pixel | Format JPG | Qualität 100%

0 Megabyte

Bild in 600x155 Pixel | Format JPG | Qualität 69%

0 Megabyte

Wenn man das Bild in der Originalgröße abspeichert, kommt eine sehr große Datei heraus. Ich habe es im JPG-Format mit 100% Qualität gespeichert und es ist eine 20 Megabyte (MB) große Datei geworden:

Herunterskaliert auf 600x155 Pixel und als JPG mit 69% Qualität abgespeichert (das sieht für das menschliche Auge immer noch ok aus) ist es nur noch 18 Kilobyte groß. Das sind 0,09 Prozent von 20 Megabyte!

Klicken Sie mal auf die Buttons oben und vergleichen Sie, wie lange es dauert, die beiden Versionen zu laden.

Nun denken Sie mal darüber nach, wenn ein armer Tropf im Wartezimmer beim Arzt über seinen mobilen Datentarif so ein großes Bild laden muss, nur um es dann winzig klein auf seinem Smartphone darstellen zu lassen. Deshalb ist es wichtig, dass Sie Bilder in der richtigen Größe auf Ihre Website laden.

Auflösung am Computer: Bildschirmauflösung

Ihr Smartphone, Ihr Full-HD-Computerbildschirm, Ihr 4K-Fernseher: Sie alle haben eigene Auflösungen, in diesem Fall sind das die Maße in Pixeln, die ein Bildschirm darstellen kann.

Die Bildschirmauflösung gibt an, wie viele Pixel Ihr Bildschirm darstellen kann.

Ein Full-HD-Bildschirm etwa hat eine Auflösung von 1920x1080 Pixeln, auch bekannt als "1080p". Er kann also 1920 Pixel in der Breite darstellen und 1080 Pixel in der Höhe, das sind insgesamt 2.073.600 Pixel, die auf den Bildschirm passen.

Auf einem Full-HD-Bildschirm (1920x1080 Pixel Auflösung, "1080p") lässt sich nur ein kleiner Teil des Fotos in Originalgröße anzeigen. Will man es ganz sehen, muss man es herauszoomen/herunterskalieren.

Bildschirme gibt es in allen möglichen Auflösungen, ob am PC oder Mac, als Fernseher in Ihrem Wohnzimmer, als Tablet (z.B. Ihr iPad), Smartphones oder viele andere Geräte. Zu den typischen Bildschirmauflösungen gibt es Listen im Internet, wie diese Liste aller Bildschirm-Auflösungen bei Touch and Screen.

Auflösung im Druck: DPI, die "Dots per Inch"

"DPI", das ist die Druckauflösung und oft der Wert, nach dem verlangt wird, wenn Sie in Bild zum Ausdrucken einreichen. Es steht für "Dots per Inch", also "Punkte pro Zoll". Die DPI-Auflösung gibt an, wie viele Bildpunkte ("Pixel" auf dem Computer) ein Drucker über einen Zoll Papier verteilen soll. Das sind 2,54 Zentimeter.

Wer ein Bild auf DIN A4- oder A3-Papier ausdruckt, kriegt zum Beispiel mit 300 DPI scharfe Ergebnisse. Der Ausdruck wird auf kurze Distanzen betrachtet, etwa wenn man das Bild an die Wand hängt oder in der Hand hält.

Auf größeren Flächen, wie der von der Autobahn aus sichtbaren Werbetafel, kann man mit einer geringeren Anzahl von DPI drucken. Denn in diesen Fällen sind die meisten Betrachter weit von dem Bild entfernt.

Achtung: Die schönste DPI-Auflösung bringt uns gar nichts, wenn ein Bild nur wenige Pixel hat.

Aber Achtung: Die schönste DPI-Auflösung bringt uns gar nichts, wenn ein Bild nur wenige Pixel hat. Ein 600 Pixel breites Bildchen wird nämlich bei 300 DPI gerade mal 5 Zentimeter breit! So sieht das dann auf einem Blatt DIN A4-Papier aus:

Wenn Sie ein 600 Pixel Bild in 300 DPI (dots per inch) ausdrucken, wird es nur 2 Zoll (Inches) breit.

So. Super. Jetzt haben wir gefühlt eine Briefmarke ausgedruckt. Aber wir wollten doch, dass das Bild das ganze Blatt füllt! Was machen wir denn nun? Einfach die DPI runterschrauben macht das Bild zwar größer: Bei 60 DPI werden schließlich nur noch 60 Bildpunkte auf ein Zoll gedruckt, und wir haben ja 600 Bildpunkte zur Verfügung, also kriegen wir ein 10 Zoll breites Bild. Toll, oder?

Wenn Sie ein 600 Pixel Bild in 60 DPI (dots per inch) ausdrucken, wird es 10 Zoll (Inches) breit und unscharf.

Leider ist das auch nicht das Gelbe vom Ei. Wie Sie oben z.B. an den Zweigen des Baumes sehen können, wird so ein kleines Bild leider echt unscharf, wenn man es so weit aufzerrt. Klicken Sie auf das Bild oben, um die Tragödie in voller Größe zu betrauern.

Da bleibt Ihnen nichts anderes übrig: Um bei 300 DPI ein scharfes Bild auf 10 Zoll Breite zu kriegen, muss das Bild ausreichend hochauflösend sein. Nehmen Sie eine Version des Originalfotos, die 3000 Pixel oder mehr breit ist.

Wenn wir eine Bilddatei in 3000 Pixeln Breite haben, können wir das Foto in 300 DPI 10 Zoll (25,4 cm) breit ausdrucken und alles ist knackig scharf.

Ein Hinweis für Bilder im Web.

Panoramafoto in 600x155 Pixeln

Wenn Sie Bilder für das Web vorbereiten, müssen Sie sich überlegen, wie und wo Sie sie einsetzen wollen. Ein kleines Bildchen kann man gut als Illustration oder Ausschmückung in einen Text einbinden (siehe das kleine Bildchen hier).

Wenn Sie es aber in voller Breite über den ganzen Bildschirm strecken wollen, dann müssen Sie es in einer angemessenen Größe und in der richtigen Ausrichtung bereitstellen. Wir haben ja oben gesehen, was passiert, wenn man ein kleines Bildchen auf übergroße Maße streckt. Das ist kein schöner Anblick.

Damit auch auf hochauflösenden Bildschirmen (auch noch in 4K) Hintergrundbilder in Vollbreite noch scharf genug aussehen, haben sich meiner Erfahrung nach rund 2000 bis 2300 Pixel Breite immer gut gemacht:

Klarer Blick im DPI und PPI-Dschungel.

Also noch mal zum mitschreiben:

  • Pixel sind Bildpunkte.
  • "Auflösung" am Computer ist die Bildgröße in Pixeln, z.B. 1600x1200 Pixel. Dies ist ein absoluter Wert.
  • "Auflösung" im Druck ist die Anzahl an Bildpunkten per Zoll, die "dots per inch" (DPI). Der Wert ist allein nichtssagend, er ist erst in Relation zu intendierter Bildgröße auf dem Papier und absoluter Bildgröße in Pixeln von Nutzen.

Hilft Ihnen diese Einführung in Bildgrößen, Auflösungen und Co. weiter? Haben Sie Fragen? Schreiben Sie mir einen Kommentar!

Wenn Sie sich weiter mit dem Thema beschäftigen wollen, können Sie sich auch meine beiden englischsprachigen Serien auf YouTube anschauen: "Understanding Image Size & Quality", und "Optimizing Images for the Web". Außerdem könnte Sie mein sechsminütiges Video "Wie bereite ich Bilder fürs Web vor?" interessieren.

Und hey, wenn Sie jemanden suchen, der den Job mit der Bildbearbeitung einfach für Sie macht...

Schreiben Sie einen Kommentar