Bildqualität vs. Dateigröße – das Dilemma des Webmasters

JPG - 70 % - 178 KB

Jeder Webseitenbetreiber sollte im eigenen und auch im Interesse der Besucher seiner Seite darauf achten, dass die Dateigrößen der Bilder auf seiner Seite möglichst klein ausfallen, damit Ladezeiten und Traffic in vernünftigem Rahmen bleiben und das Ranking nicht leidet.

Viele Wege führen nach Rom, aber mancher Weg kann sich auch als Irrweg erweisen. Zwei der oftmals angewandten Rezepte zur Verkleinerung der Dateigrößen von Bildern möchte ich einmal näher beleuchten.

Sicher kann ich mit geringerer Auflösung meiner Fotos die Bilddateien verkleinern. Wenn ich ein Foto statt mit einer Auflösung von 1.024 x 683 Pixel nur mit 650 x 434 Pixel auf meiner Webseite einstelle, vermindert sich die Dateigröße bei einem beliebigen Bild z.B. um rund 45 % (329 KB gegenüber 179 KB). Ist ja schon mal nicht schlecht. Aber jede Medaille hat bekanntlich zwei Seiten. Welche Nachteile handele ich mir also damit ein?

Zum einen, und das ist heute für jeden Webseitenbetreiber von Bedeutung, ist das Ranking kleinerer Bilder in der Google-Bildersuche in der Regel schlechter.

Ein weiterer Aspekt ist die Wirkung der eingestellten Fotos auf den Betrachter. Ich muss wohl nicht betonen, dass ein Foto mit zunehmender Größe an Wirkung gewinnt, zumindest wenn das Foto so gelungen ist, dass es überhaupt eine positive Wirkung erzielt. Für Fotoblogs oder fotolastige Blogs ist die allzu starke Verkleinerung von Fotos meiner Meinung nach ein schlechter Weg.

Oftmals ist zu lesen, die Fotos in der größeren Auflösung würden eh selten aufgerufen, also könne man auch gleich darauf verzichten. Man kann sich diesem Argument anschließen oder auch nicht … alles eine Frage des eigenen Anspruchs.

Auch der technische Fortschritt spricht gegen diese Lösung. Die Auflösungen der Displays steigen schneller als man schauen kann. So sind heute Auflösungen von 2.560 x 1.600 Pixel bei einem 13“ Laptop wie dem MacBook Pro (Retina) nicht mehr aufsehenerregend. Samsungs in Kürze erscheinendes Top-Smartphone Galaxy S5 soll gar auf seinem nur wenig mehr als 5“ großen Display 2.560 mal 1.440 Bildpunkte darstellen.

Auch eine stärkere Komprimierung der Bilddateien vermindert natürlich die Größe der Datei. Wenn ich eine JPG-Datei statt mit 70 % nur mit 60 % Bildqualität abspeichere, sinkt die Dateigröße z.B. von 178 auf 155 KB (ca. 13 %).Für mich ist eine solch starke Komprimierung aber nicht das Mittel der Wahl, weil dadurch die Gefahr steigt, dass die Fotos Artefakte aufweisen oder einen „matschigen“ Eindruck machen. Das möchte ich anhand dreier Vergleichsfotos zeigen, die mit bestmöglicher JPG-Qualität (100 %), mit 70 % und mit 60 % komprimiert wurden (am besten in voller Auflösung von 1.024 Pixel ansehen).

JPG - 100 % - 805 KB

JPG – 100 % – 805 KB

 

JPG - 70 % - 178 KB

JPG – 70 % – 178 KB

 

JPG - 60 % - 155 KB

JPG – 60 % – 155 KB

 

An den Ausschnittsvergrößerungen werden die Unterschiede (besonders die „Klötzchen“ im Verlauf des Himmels) noch deutlicher:

JPG 100 %

JPG 100 %

JPG 70 %

JPG 70 %

JPG 60 %

JPG 60 %

 

Schon beim 70 %-JPG erkennt man gegenüber dem 100 %-JPG mehr Bildfehler, besonders Doppelkonturen rechts am Turm und an den Fahnenmasten. Die Qualität ist aber noch akzeptabel.

Beim 60 %-JPG haben sich diese Bildfehler noch verstärkt. Darüber hinaus fallen bei diesem stärker komprimierten Foto jetzt Artefakte und Tonwertabrisse im Himmelsblau störend ins Auge. Das ist für mich schon nicht mehr akzeptabel.

Ich möchte einen anderen und weitaus wirksameren Weg aufzeigen. Viel effektiver ist es, die Bilder mit einer vernünftigen Software, die einen wirksamen Komprimierungsalghoritmus verwendet, zu komprimieren.

Als Basis nehme ich die millionenfach verwendete Fotosoftware Adobe Lightroom in der derzeit aktuellen Version 5. Wenn ich mit dieser Software ein beliebiges Foto auf 1.024 Pixel (längste Kante) mit 70 % JPG-Qualität komprimiere, ergibt sich eine Dateigröße von z.B. 329 KB. Viele Webseitenbetreiber stellen die Fotos dann in dieser Größe ins Netz und vergeben damit die Möglichkeit, mit einem weiteren Arbeitsschritt die Bilddatei ohne Qualitätsverlust nochmals spürbar zu verkleinern.

Das verschenkte Potential will ich an einem Beispiel aufzeigen. Am Ende des Workflows steht eine Bilddatei mit einer Größe von nur 178 KB, was gegenüber der mit Lightroom komprimierten Bilddatei in einer Größe von 329 KB einer Verkleinerung um 151 KB oder ca. 46 % entspricht. Die 13 % Verkleinerung durch Komprimierung mit schlechterer JPG-Qualität (siehe 2.) sind dagegen Peanuts.

Hier der Workflow im Detail:

  • Da eine mehrfache Komprimierung im nicht verlustfreien JPG-Format die Verluste summiert, exportiere ich die Bilder aus Lightroom zunächst im verlustfreien TIF-Format.
  • Die TIF-Datei öffne ich dann im Programm GraphicConverter (leider nur für Mac verfügbar, Windows-Alternativen nenne ich am Schluss). Hier wird das Bild noch geschärft und dann mit 70 % JPG-Qualität konvertiert. Das Ergebnis ist eine JPG-Datei in einer Größe von nur 172 KB (beim Beispielbild). Die TIFF-Dateien können anschließend gelöscht werden.

Da die Software auch Stapelverarbeitung ermöglicht, kann man einen ganzen Rutsch von Bildern in kürzester Zeit so bearbeiten. Die Qualität der mit dem GraphicConverter konvertierten Fotos ist ebenso gut wie die der mit Lightroom konvertierten Bilder.

Für Windows-User (und andere Betriebssysteme) bieten sich Tools wie JPEGmini  oder das WordPress-Plugin Optimus von Sergej Müller an. Mit beiden Tools lassen sich JPG-Dateien kostenlos ohne sichtbaren Qualitätsverlust komprimieren und dabei gegenüber Lightroom spürbare Verbesserungen erzielen. JPEGmini verkleinert z.B. das 329 KB große Lightroom-JPG auf nur noch 263 KB (- 66 KB = – 20 %).

Mein Fazit: Habt eure Bilder lieb! Nehmt ihnen nicht die Wirkung durch Miniaturisierung oder sichtbare Minderung der Qualität. Ladezeiten sind nicht alles, zumal die Bandbreiten – auch im Mobilbereich – ständig steigen. Die Webhostingpakete der Provider werden ständig größer bzw. der inkludierte Webspace ständig preiswerter. All dies wird über kurz oder lang auch zu Blogs mit einer höheren Auflösung führen. Ist heute in Blogs noch eine Bildbreite von 650 Pixel der Standard, so sind es morgen vielleicht schon 800 Pixel und übermorgen schon 1.000 Pixel. Wenn meine Fotos in der Mediendatenbank in entsprechender Auflösung vorliegen, fällt eine Anpassung im Fall des Falles leicht.

Kommentare, Erfahrungen und weitere Tipps sind gerne gesehen.

Verwandte Artikel:

  • Keine passenden Posts gefunden

4 Kommentare

  1. Ich sehe bei den drei Bildern keinen wesentlichen Unterschied. Für mich sehen sie in jeder der drei Versionen ein bisschen wie eine Computeranimation aus.

    • Auf einem guten Monitor fallen die Unterschiede aber sofort ins Auge. Um es deutlicher zu machen, habe ich nachträglich noch drei Ausschnittsvergrößerungen hinzugefügt.

      Wo du eine Ähnlichkeit zu Computeranimationen siehst, ist mir allerdings ein Rätsel.

      • In dem Fall brauche ich wohl einen besseren Monitor: Denn auch jetzt, nachdem ich weiss, worauf ich mich achten muss (danke übrigens für die Vergrösserungen), sehe ich zumindest bei mir auf dem Laptop keinen Unterschied.

        Zum anderen Punkt: Ich denke, die Ähnlichkeit zur Computeranimation sehe ich darin, dass das Objekt schon fast unnatürlich gut ausgeleuchtet und hervorragend belichtet ist. „Echte“ Fotos sind normalerweise nicht so ebenmässig – zumindest würde ich sowas nie hinkriegen. Das ist wohl auch der Grund, wieso es mich an die Computerbilder erinnert, mit denen Architekten vor dem Bau zeigen wollen, wie das Gebäude später aussehen soll. Insofern kannst du die Aussage also auch durchaus als Lob verstehen… 🙂

        • Okay, ’ne Menge Leute gucken auf ein Display, welches solche Bildfehler verschleiert, aber das kann und will ich als Fotograf beim Bearbeiten meiner Fotos nicht zugrunde legen.

          Jetzt weiß ich, was du meinst. Aber glaub mir, Oli, es sind „echte“ Fotos 😉 . Dass die so aussehen wie sie aussehen, liegt daran, dass ich nicht im JPG-Format, sondern im sog. RAW-Format fotografiere und meine Fotos quasi erst nachher „entwickele“. Dabei kann man noch sehr viel aus den Fotos rausholen, was eben bei JPG-Fotos nicht geht. Deshalb kommen dir die Fotos vielleicht so „perfekt“ vor.

          Ich nutze übrigens das Programm Adobe Lightroom, welches für recht kleines Geld erhältlich ist und auch von Anfängern in der Bildbearbeitung schnell erlernbar ist.

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.