Bilder fürs Web - von dpi und ppi, 72dpi und 300dpi
Hallo zusammen,
eine "einfache" Frage, die vielleicht dann doch nicht so einfach zu beantworten ist...
Szenario: Ein Stock-Foto in einer bestimmten Punktdichte wird gekauft (z.B. 300dpi) oder ein Foto wird aufgenommen (4000x2000px).
In welchem Format (JPEG, PNG), welcher Dateigröße (kB), welcher Punktdichte (dpi oder ppi oder ???) sollte man die Bilder im Archiv ablegen, damit diese auf "allen" Endgeräten gut aussehen und für die Website nicht zu groß (kB) sind, sowohl auf dem Desktop als auch auf mobilen Endgeräten.
Wo ist das ggf. genau beschrieben?
Danke.
eine "einfache" Frage, die vielleicht dann doch nicht so einfach zu beantworten ist...
Szenario: Ein Stock-Foto in einer bestimmten Punktdichte wird gekauft (z.B. 300dpi) oder ein Foto wird aufgenommen (4000x2000px).
In welchem Format (JPEG, PNG), welcher Dateigröße (kB), welcher Punktdichte (dpi oder ppi oder ???) sollte man die Bilder im Archiv ablegen, damit diese auf "allen" Endgeräten gut aussehen und für die Website nicht zu groß (kB) sind, sowohl auf dem Desktop als auch auf mobilen Endgeräten.
Wo ist das ggf. genau beschrieben?
Danke.
23.02.15, 20:05
Beitrag 2 von 8
Nimm das PNG-Format, also ein Format ohne Komprimierung. Die DPI-Zahl ist vollkommen unerheblich; entscheidend ist die Größe in Pixeln.
...ergänzend: Ich möchte nicht nur Fotos im Web abbilden, sondern alle möglichen Hilfsgrafiken wie Banner, Buttons etc. Auch technische Bilder mit feinen Linien. Wenn man nun mit - sagen wir 72dpi - auf ein Retina-Display mit 220dpi geht, werden feine Strukturen dann noch korrekt abgebildet?
Ziel ist, Bilder in bestmöglicher Auflösung, aber kleiner Dateigröße kB einzubinden.
Ist das mit der einfachen Regel "nimm PNG" abgedeckt?
Ziel ist, Bilder in bestmöglicher Auflösung, aber kleiner Dateigröße kB einzubinden.
Ist das mit der einfachen Regel "nimm PNG" abgedeckt?
...eben noch gefunden: Mobile + Retina => https://www.campaignmonitor.com/guides/ ... ng-images/
23.02.15, 21:51
Beitrag 5 von 8
Zitat: go4java 23.02.15, 20:38Zum zitierten Beitrag
Zunächst zur DPI-Zahl: Die ist in diesem Zusammenhang vollkommen unerheblich. Stelle ein, was du willst. Die DPI-Zahl wird erst bei der Ausgabe auf einem Drucker etc. relevant.
Ansonsten ist das jpg-Format schon das Optimum aus Speichergröße und Bildqualität, wenn du beim Abspeichern nicht komprimierst.
PNG-FORMAT ist dann verlustfrei, aber mit mehr Speicherbedarf.
Zunächst zur DPI-Zahl: Die ist in diesem Zusammenhang vollkommen unerheblich. Stelle ein, was du willst. Die DPI-Zahl wird erst bei der Ausgabe auf einem Drucker etc. relevant.
Ansonsten ist das jpg-Format schon das Optimum aus Speichergröße und Bildqualität, wenn du beim Abspeichern nicht komprimierst.
PNG-FORMAT ist dann verlustfrei, aber mit mehr Speicherbedarf.
Kann man das so zusammenfasse:
png für großformatige Fotos
jpg für kleinere Fotos
gif für einfache Grafiken wie Logos
png für großformatige Fotos
jpg für kleinere Fotos
gif für einfache Grafiken wie Logos
24.02.15, 10:41
Beitrag 7 von 8
Zitat: go4java 23.02.15, 22:10Zum zitierten Beitrag
Nein. Die Größe der Bilder in Pixeln ist dabei eher weniger entscheidend.
PNG nimmst du für eine verlustfreie Speicherung mit dem Nachteil, dass die Bilddatei größer ist.
JPG nimmst du, wenn beim Speichern ein geringfügiger Verlust an Bildinformationen akzeptabel ist. Dabei kannst du den Grad der Informationsverluste über den Komprimierungsfaktor steuern --> je weniger Komprimierung desto weniger Informationsverluste, aber desto größer die Bilddatei und umgekehrt.
Probiere es doch einfach mal aus: Nimm besagtes 4000x2000 Pixel großes Bild, speichere es einmal als PNG, anschließend als JPG (mit 100% Qualität) und als JPG mit 75% Qualität (natürlich immer unter anderem Namen!). Danach schließt du diese Dateien, öffnest sie erneut und schaust sie dir in voller Auflösung an.
Nein. Die Größe der Bilder in Pixeln ist dabei eher weniger entscheidend.
PNG nimmst du für eine verlustfreie Speicherung mit dem Nachteil, dass die Bilddatei größer ist.
JPG nimmst du, wenn beim Speichern ein geringfügiger Verlust an Bildinformationen akzeptabel ist. Dabei kannst du den Grad der Informationsverluste über den Komprimierungsfaktor steuern --> je weniger Komprimierung desto weniger Informationsverluste, aber desto größer die Bilddatei und umgekehrt.
Probiere es doch einfach mal aus: Nimm besagtes 4000x2000 Pixel großes Bild, speichere es einmal als PNG, anschließend als JPG (mit 100% Qualität) und als JPG mit 75% Qualität (natürlich immer unter anderem Namen!). Danach schließt du diese Dateien, öffnest sie erneut und schaust sie dir in voller Auflösung an.
Hallo g4java,
es ist eigentlich ganz einfach: Das Bild, das du kaufst oder aus der Kamera holst, ist dein ORIGINAL. Ein besseres als das hast du nicht. Das solltest du so, wie es ist, dauerhaft speichern, mit Sicherheitskopie.
Von einem gekauften oder aus der Kamera gelieferten JPG ein PNG zu machen, macht das Bild nicht besser, nur größer. Wenn die Kamera ein Raw-Format liefert, solltest du dieses Format aufbewahren, daraus kann man alles andere ableiten.
Für Internetanwendungen kann man aus jedem Format kleinere Bilder herunterrechnen (weniger Pixel). Die dpi-Angabe in der Datei kann ohne Änderung an der Pixelanzahl jederzeit geändert werden und ist nur für Layout- oder Vorschauzwecke interessant.
Gruß
Selbstleuchterfarbraum
Ohje, habs grade gesehen: uralter Thread, nur durch diesen Werbeheini nach oben gekommen... egal.
es ist eigentlich ganz einfach: Das Bild, das du kaufst oder aus der Kamera holst, ist dein ORIGINAL. Ein besseres als das hast du nicht. Das solltest du so, wie es ist, dauerhaft speichern, mit Sicherheitskopie.
Von einem gekauften oder aus der Kamera gelieferten JPG ein PNG zu machen, macht das Bild nicht besser, nur größer. Wenn die Kamera ein Raw-Format liefert, solltest du dieses Format aufbewahren, daraus kann man alles andere ableiten.
Für Internetanwendungen kann man aus jedem Format kleinere Bilder herunterrechnen (weniger Pixel). Die dpi-Angabe in der Datei kann ohne Änderung an der Pixelanzahl jederzeit geändert werden und ist nur für Layout- oder Vorschauzwecke interessant.
Gruß
Selbstleuchterfarbraum
Ohje, habs grade gesehen: uralter Thread, nur durch diesen Werbeheini nach oben gekommen... egal.