http://www.sieben-und-achtzig.de/wp-content/themes/press
Screendesign: Die DPI-Lüge

20 Mai 2010, Geschrieben von Rene Haas in Gestaltung, 5 Kommentare

Screendesign: Die DPI-Lüge


DPI — Wenn wir für die Aus­gabe im Druck arbei­ten, sind uns diese drei Buch­sta­ben bes­tens bekannt. Die DPI (Dots per Inch) geben an, wie viele Druck­punkte auf einer klar defi­nier­ten Stre­cke plat­ziert wer­den. Je höher die­ser Wert, desto mehr Punkte wer­den von der Druck­platte auf das Papier über­tra­gen. Mit einem höhe­ren DPI-Wert stei­gert sich dem­ent­spre­chend auch die Bild­qua­li­tät. Was uns hier im Druck alles so logisch erscheint, wirkt im Bezug auf die Aus­gabe an Moni­to­ren mehr als absurd. Und doch hört und liest man immer wie­der Anga­ben wie „72 DPI für die Webaus­gabe“ etc — mal sehen was dahintersteckt!

Grund­be­griffe:

Inch / Zoll: 1″ = 2,54cm

DPI: Dots per Inch / Druck­punkte auf einer Stre­cke von einem Inch.

PPI: Pixel per Inch / Anzahl der Pixel auf einer Stre­cke von einem Inch.

Bit: Kleinste Ein­heit in der Infor­ma­ti­ons­tech­nik. 1Bit kann nur 2 Zustände anneh­men einen für „an“ und einen für „aus“. Im Binärsys­tem würde das der 1 oder 0 entsprechen.

Daten­tiefe: Auch bekannt unter dem Namen „Farbtiefe“.

Phy­si­ka­li­sche Auf­lö­sung: Exakte Anzahl von Bild­ele­men­ten auf einem Län­gen­maß. Diese Auf­lö­sung ist nicht variabel

Rela­tive Auf­lö­sung: Gibt die Größe der Gra­fik in Rela­tion zum Medium an. Bei der rela­ti­ven Auf­lö­sung han­delt es sich immer um die DPI da diese je nach Medium und Druck­ver­fah­ren var­rie­ren können

Auf die Frage, warum man für Screen­lay­outs 72 DPI neh­men sollte, ent­geg­nete mir in der Aus­bil­dung mein Leh­rer unsin­ni­ger­weise mit den Wor­ten: „Wegen der gerin­gen Auf­lö­sung der Moni­tore und der Daten­größe!“. Zu sei­nem Schutz sei gesagt, dass er nicht der ein­zige ist, der die­sem Trug­schluss auf den Leim gegan­gen ist. Um ehr­lich zu sein, sind dies die zwei häu­figs­ten (und zugleich unsin­nigs­ten) Argu­mente in der ewig wäh­ren­den DPI-Frage.

Um eines die­ser zwei Argu­mente (die Daten­größe) sofort zu ent­kräf­ten, muss man sich nur die For­mel zur Berech­nung der Daten­größe einer Ras­ter­gra­fik anschauen. Wie man am unten gezeig­ten Bei­spiel gut erken­nen kann, wer­den die DPI in der Rech­nung nicht berück­sich­tigt und wir­ken sich somit auch nicht auf die Daten­menge aus.

Bei­spiel der Daten­men­gen­be­rech­nung für ein 2000 x 3000 Pixel gro­ßes Bild in RGB/8bit.

2.000px * 3.000px = 6.000.000 Pixel
6.000.000 Pixel / 3 * 8bit = 16.000.000 Byte
(Die 3 steht für die 3 Kanäle R,G & B)
16.000.000 Byte / 1024 / 1024 = 17,166 Mega­byte (1024 Byte sind ein Kilo­byte und 1024 Kilo­byte sind 1 Mega­byte)


Die Größe von 17 Mega­byte ent­spricht der Größe eines unkom­pri­mier­ten (Roh-)Bildes.

Das zweite Argu­ment war die Auf­lö­sung der Moni­tore. Hier sind die 72 DPI immer hoch im Kurs und wer­den immer wie­der gern als DIE Auf­lö­sung von Moni­to­ren ange­prie­sen. Um zu schauen, ob mein Moni­tor die­ser (im Grunde fik­ti­ven) Stan­dar­di­sie­rung ent­spricht, habe ich ihn mal aus­ge­mes­sen, die DPI errech­net und bin auf das Ergeb­nis von 91 DPI gekom­men, bei mei­nem iPhone waren es knappe 160 DPI. Selbst bei mei­nem Zweit­mo­ni­tor sind es knapp 100 DPI und damit fernab der stets gefor­de­ten 72 DPI.

Die Pixel auf einem Moni­tor sind, neben dem soeben bespro­che­nen, auch nicht varia­bel. Sie haben eine fixe Größe und einen fixen Abstand, wel­che durch den Her­stel­ler fest­ge­legt wor­den sind. Wir als Gestal­ter haben auf diese Werte abso­lut kei­nen Ein­fluss! Ob wir ein Bild in 2, 30, 72 oder 9999 DPI anle­gen, ist des­halb von kei­ner­lei Inter­esse und wirkt sich am Moni­tor nicht auf die Bild­qua­li­tät aus. Unten ein Bei­spiel mit den oben gen­an­ten DPI-Werten im Vergleich:

Erschre­ckend, die Qua­li­täts­un­ter­schiede, nicht wahr? ;)

An den Bei­spie­len sieht man deut­lich, dass der DPI-Wert kei­ner­lei Ein­fluss auf die Bild­qua­li­tät eines Bil­des hat, das auf einem Moni­tor aus­ge­ge­ben wird. Das sollte uns aber mitt­ler­weile nicht mehr über­ra­schen, da wir den Unter­schied zwi­schen rela­ti­ver und phy­si­ka­li­scher Auf­lö­sung bereits gelernt haben.

Fazit:

Ob 72, 24 oder gar 3 DPI ist also furcht­bar egal, solange es um die Gestal­tung für die Moni­tor­aus­gabe geht. Hier zäh­len nur harte Fak­ten und das sind in dem Fall die Pixelaus­maße auf die wir schlicht­weg kei­nen Ein­fluss haben. Woher kommt dann aber der große 72 DPI Mythos? Mir erklärt sich das am ehes­ten durch die Ver­wen­dung von Schrif­ten. So benö­tigt es für eine les­bare Schrift in einem 2 DPI Doku­ment schon eine Größe von über 600 pt, um über­haupt die Anfor­de­rung der Les­bar­keit zu erfül­len, wäh­rend in einem Doku­ment mit 9999 DPI eine 1,5 Pt Schrift schon den Rah­men des Doku­ments sprengt. Die Benut­zung von Pixel­wer­ten für Schrift­grö­ßen schafft hier Abhilfe, jedoch ist der Gebrauch von Punkt-Angaben weit­aus gebräuch­li­cher. So hat man bei 72DPI einen guten Mit­tel­weg in der Schrift­größe auf dem Moni­tor als Äqui­va­lent im Druck. Selbst im 72 DPI Mär­chen steckt also ein klei­nes (sehr klei­nes!) Stück­chen Wahr­heit. Für den All­tags­ge­brauch gilt aber nichts­des­to­trotz: Solange ein Bild nur für die Ver­wen­dung auf dem Moni­tor gedacht ist, spielt der DPI abso­lut keine Rolle. Der wird erst dann inter­es­sant, wenn ein Doku­ment für den Druck bestimmt ist.

Wei­ter­füh­rende Lek­türe zum Thema (engl.):

The Myth of DPI | Web­de­si­gner Depot

Wie sind eure Erfah­run­gen mit dem lus­ti­gen 72 DPI Gerücht? Gestal­tet ihr (aus Gewohn­heit oder wider bes­se­ren Wis­sens) mit die­sem Wert? Stoßt ihr auch immer wie­der auf Unver­ständ­nis in eurem Umfeld, sobald die Begriffe Auf­lö­sung, DPI und PPI fallen?

Diese Icons ver­lin­ken auf Book­mark Dienste bei denen Nut­zer neue Inhalte fin­den und mit ande­ren tei­len kön­nen.
  • TwitThis
  • Facebook
  • Digg
  • StumbleUpon
  • del.icio.us
  • Design Float
  • Reddit
  • Mixx
  • Technorati
  • MisterWong
  • email
  • Print

5 Kommentare

22. Mai 2010 20:45

Schnette

Das kam jetzt genau rich­tig :-)
Danke — toll erklärt!

13. Juni 2010 10:13

Man­fred

Eine gute Dart­sel­lung, es hilft für bes­se­res Ver­ständ­nis.
LG
Manne

17. April 2011 23:40

Domi­nik Skrabal

Ganz toll zusam­men­ge­fasst. Als Gestal­ter und Dozent für Online-Medien könnte ich es nicht bes­ser auf den Punkt bringen.

Wer zu ande­ren Online-Themen Unter­stüt­zung braucht,
kann sich gern bei mir mel­den: http://www.dominik-skrabal.com

Beste Grüße
Domi­nik Skrabal

8. Juni 2011 21:04

Ger­hard

Hüb­sche Erklä­rung, aber die Bei­spiel­rech­nung oben darf man aber nicht allzu ernst nehmen:

2.000px * 3.000px = 6.000.000 Pixel
6.000.000 Pixel / 3 * 8bit = 16.000.000 Byte (Die 3 steht für die 3 Kanäle R,G & B)
16.000.000 Byte / 1024 / 1024 = 17,166 Mega*byte (1024 Byte sind ein Kilo*byte und 1024 Kilo*byte sind 1 Mega*byte)

Die 6 Mio Pixel sind noch rich­tig.
Dann wird aber ein Pixel durch 3 Far­ben geteilt. Tei­len die sich ein Pixel ???
Rich­tig wäre hier ein MAL 3.
Dann wird mit 8 Bit mul­ti­pli­ziert, was ja übli­cher­weise 1 Byte ist.
Aus dem 1 Byte wer­den dann aber 8 Byte.

Die rich­tige Größe wären 18 Mio Bytes, was auf magi­sche Weise wie­der den ange­ge­be­nen 17,166MB entspricht.

Kor­rekt wäre fol­gende Rechnung:

2.000px * 3.000px = 6.000.000 Pixel
6.000.000 Pixel * 3 / 8bit = 18.000.000 Bytes (Die 3 steht für die 3 Kanäle R,G & B)
18.000.000 Byte / 1024 / 1024 = 17,166 Mega*byte (1024 Byte sind ein Kilo*byte und 1024 Kilo*byte sind 1 Mega*byte)

23. November 2011 09:23

Daniel Bur­kart

Wie kann man sich so aus­führ­lich mit einem Thema beschäf­ti­gen und dann von DPI an einem Bild­schirm spre­chen? Da gibt’s keine Dots!! Da spricht man von Ppi. Oh mann.

Kommentar wird gespeichert...
Falls Du "fastestfox" oder "fastestchrome" in deinem Browser installiert hast, kann es zu Problemen mit der AJAX-Funktion des Blogs geben.

Kommentieren