Lossless image optimization mit jpegoptim: Traffic sparen & schneller an mobile Besucher ausliefern

JPGs optimieren

Keine Frage: Traffic ist heutzutage bei den meisten Hostinganbietern als Flatrate inkludiert und die meisten Nutzer verfügen Zuhause über schnelles DSL oder Kabelinternet. Wieso also das Bedürfnis ein paar Kilobyte oder sogar nur wenige Bytes bei Grafiken und Bildern einzusparen? Der Grund ist einfach: Schnelligkeit. (Und weil es geht!) Zudem ist ein entscheidender Vorteil – die Aufmerksamen haben es schon gelesen – das keine Details in den Grafiken oder Fotos verloren gehen müssen, keine Artefakte oder sonstige Verluste entstehen. Stichwort: lossless.

Ich möchte zeigen wie man direkt auf dem eigenen Server oder Webspace ganze Verzeichnisse mit JPGs optimieren kann. Was du dazu benötigst: SSH auf deinen Server/Webspace und das Programm jpegoptim.Wenn jpegoptim nicht installiert ist, installiere es – unter Debian bspw wie folgt:

server:# apt-get update
server:# apt-get install jpegoptim

Um eine einzelne Datei zu optimieren gibst du folgendes ein:

server:# jpegoptim grafik.jpg

Wenn es erfolgreich gelaufen ist erhältst du eine ähnliche Ausgabe wie die folgende:

grafik.jpg 150x150 24bit Exif ICC JFIF  [OK] 41379 --> 27312 bytes (34.00%), optimized.

Es wurden also 34% Ersparnis ermöglicht. Ohne Verlust! Und ohne Metadaten zu entfernen.

Du kannst jpegoptim auch mit weiteren Optionen aufrufen um bspw. Metadaten (EXIF, IPTC, etc) zu entfernen. Alle Optionen findest du nach Eingabe von `man jpegoptim`.

 

Jetzt aber zu unseren schlauen Zeile die alle JPGs innerhalb eines Ordners optimiert:

server:#  find /pfad -type f -name "*.jpg" -exec jpegoptim -p --strip-com --strip-iptc {} \;

Was passiert hier?
find sucht mit dem Parameter -type f und -name „*.jpg“ alle Dateien (f = files) die auf .jpg enden und übergibt sie an jpegoptim. Die Parameter von jpegoptim sind -p. für die Beibehaltung des Zeitstempels der Originaldatei, –strip-com entfernt Kommentare aus der Datei und –strip-iptc entfernt IPTC Metadaten. Wenn du auch noch die EXIF-Daten entfernen willst, füge noch –strip-exif hinzu.

Im eveosblog ließen sich mit jpegoptim bspw. knapp 260MB sparen – bei knapp 70000 JPGs, wobei viele schon durch Photoshop einigermaßen optimiert waren und WordPress die generierten Thumbnails wohl auch gut optimiert speichert.

 

Lossy-Optimisation / Optimierung mit Verlusten
Wenn du davon ausgehst, dass viele deine Dateien nicht Web-Optimiert gespeichert wurden (bspw. mit Photoshop), dann kannst du auch Grafiken mit höheren Qualitäten noch etwas drücken. Dafür gibt es den Parameter -m der einen Wertebereich von 0 bis 100 animmt. Die JPGs werden dann daraufhin geprüft ob die Qualität über dem Wert von m liegt und entsprechend auf den Wert angepasst. Die geschieht aber mit Verlust! (Ähnlich wie bei Photoshop ‚Für Web speichern…‘) Dateien die bereits die Qualität haben oder darunter liegen, werden nicht weiter dadurch beeinflusst und nur mit den lossless-Optionen optimiert.

Ein Aufruf mit dieser Option wäre wie folgt:

server:#  find /pfad -type f -name "*.jpg" -exec jpegoptim -p -m72 --strip-com --strip-iptc {} \;

 

Ich habe keinen Server und möchte nur einzelne JPGs komprimieren! Wie mache ich das?
Es gibt einige kostenlose Webtools wie Yahoo Smush.it, Kraken.io oder auch Programme wie http://imageoptim.com/ direkt für den Rechner. Ich empfehle für die gelegentliche Optimierung Kraken.io – die kostenlose Version ist super um ein paar Grafiken zu optimieren.

Tweet

Aktuell im Blog

Lossless image optimization mit jpegoptim: Traffic sparen & schneller an mobile Besucher ausliefern

Keine Frage: Traffic ist heutzutage bei den meisten Hostinganbietern als Flatrate inkludiert und die meisten Nutzer verfügen Zuhause über schnelles DSL oder Kabelinternet. Wieso also das…

"Flat Mobile Devices" - kostenloser Vektor-Download

Für ein Projekt vom eveosblog habe ich drei mobile Geräte gebraucht um ein PDF zu illustrieren - und so entstanden ein Apple iPhone 5S, ein Samsung Galaxy Nexus…

Fotos auf flickr

    Kontakt

    atomtigerzoo Webdesign & Webdevelopment

    » Uhlandstraße 87, 42699 Solingen
    » +49 (2 12) 5 20 88 22 72
    » info@atomtigerzoo.com