Das Optimieren von Webseiten gehört für Betreiber von Webseiten zum täglichen Brot. In diesem Beitrag möchte ich ein paar Online Tools zur Verkleinerung von Bilddateien vorstellen.
Wieso verkleinern?
Der bekannteste Punkt, wieso man Bilder verkleinern soll, ist wohl Google PageSpeed. Hier erhält man oft die Meldung, dass man Bilder optimieren soll. Es kann also ein SEO Vorteil sein, wenn man die Bilder optimiert. Der größte Vorteil ist aber, dass die Datenmenge, die der Webseitenbesucher herunterladen muss, oft deutlich reduziert werden kann. Bei einem 32-Mbit-DSL Anschluss zu Hause merkt man von der Reduzierung zwar selbst nichts, aber jemand, der mit dem Smartphone oder Tablet unterwegs ist und gerade eine schlechte Verbindung hat, freut sich über jedes KB den er nicht mehr runterladen muss und er die Webseite alleine durch eure Optimierung schneller zu Gesicht bekommt.
Auch sollte man die Traffic-Ersparnis nicht vergessen. Oft hat man einen Webspace/Server, welcher nur ein bestimmtes Datenkontingent mit der vollen Datenrate zulässt, wenn man auf der eigenen Webseite nun 50KB einspart und die Webseite 1000 Besucher im Monat hat sind das immerhin knappe 50MB die gespart werden. Auch sollte man nicht vergessen das sich auch Crawler und Bots Bilder runterladen und somit Traffic verursachen, und von denen gibt es im Netz Hunderte.
In diesem Beitrag möchte ich 5 bekannte Dienste zur Bildoptimierung miteinander vergleichen. Dies sind: Yahoo smush.it, JPEGmini, PunyPNG, TinyPNG und TinyJPG.
TinyPNG unterstützt, wie der Name schon sagt, nur png Dateien. JPEGmini verkleinert nur jpeg Dateien, PunyPNG und smush.it sollen sowohl jpeg als auch png Dateien verarbeiten können.
TinyJPG ist ein neues Tool von den Machern von TinyPNG und unterstützt Png und JPG Dateien.
Bei Punypng werden einem 2 unterschiedliche Ergebnisse angezeigt, in diesem Vergleich gehe ich nur auf die kostenfreie (und größere) Version ein.
Die Testdateien
Für den Test habe ich 5 Dateien erstellt, 2 png und 3 jpg Dateien. Zu sehen ist einmal das Plambee.de Webhosting Logo, ein Werbebanner und zwei Landschaftsbilder.
Logo1.png: Transparente png Datei mit 400×161 Pixel, Bittiefe 32
Logo2.jpg: 899×362 Pixel, Bittiefe 24, Qualität: 100
Logo3.png: Transparente png Datei mit 160×600 Pixel, Bittiefe 32
Foto1.jpg: 1632×920 Pixel, Bittiefe 24, Qualität: 100
Foto2.jpg: 1632×920 Pixel, Bittiefe 24, Qualität: 100
Original | TinyPNG | PunyPNG | JPEGmini | Smush.it | TinyJPG | |
Logo1.png | 30,3 KB | 8,21 KB | 27,5 KB | N/A | 27,7 KB | 8,14 KB |
Logo2.jpg | 79,8 KB | N/A | ERROR | 46,5 KB | 79,8 KB | 37,5 KB |
Logo3.png | 79,6 KB | 20,1 KB | 78 KB | N/A | 79,6 KB | 20,09 KB |
Foto1.jpg | 1,16 MB | N/A | Upload zu groß | 425 KB | 1,11 MB | 339,5 KB |
Foto2.jpg | 1,23 MB | N/A | Upload zu groß | 444 KB | 1,17 MB | 362,4 KB |
Wie man sieht, sind die Unterschiede der einzelnen Tools doch sehr groß. Dies liegt an den verschiedenen Verfahren, die eingesetzt werden. Die kostenlose Version von PunyPNG und smush.it löschen lediglich einige Metadaten, die Bildqualität bleibt aber unberührt. JPEGmini und TinyPNG/TinyJPG verändern hier deutlich mehr an der Datei. So wird z.B. die Bittiefe oder die Farbpalette geändert. Dies machen die Tools allerdings so gut das ich bei den Bildern keine Unterschiede erkennen kann.
TinyPNG liefert bei meinen Testdateien durchweg die besten Bildergebnisse und ist somit der klare „Gewinner“ dieses Vergleiches. Meine Urlaubsfotos würde ich mit solchen Tools aber nicht bearbeiten (diese möchte ich ohne „Manipulationen“ speichern). Damit Ihr die Ergebnisse vergleichen könnt, sind in der Tabelle alle Bilder verlinkt, so könnt Ihr euch selbst ein Bild von der Qualität machen.
Von PunyPNG war ich leider etwas enttäuscht, zum einen werden nur Uploads von 500 KB angenommen und das Optimieren von jpg Dateien (obwohl beworben) hat bei mir jedenfalls nicht funktioniert.
P.S.: Dass dieser Vergleich nicht wirklich repräsentativ ist, ist mir klar. Er soll nur verdeutlichen, welche Ersparnis und welchen Geschwindigkeitsvorteil man mit wenig Aufwand erreichen kann.
Ergänzung: Die Dienste punypng, tinypng und tinyjpg bieten jeweils auch eine API für Entwickler an. Und für tinypng bzw. tinyjpg wird auch ein eigenes WordPress Plugin angeboten, welches die Bilder automatisch bearbeitet.