Artikel vom 26. April 2010

ImageOptim: PNG-Bilder um ein Vielfaches in der Größe verkleinern

ImageOptim

In einem Artikel der Performance-Reihe wurden vier aktuelle Mac OS Anwendungen mit der Kernaufgabe Optimierung von PNGs vorgestellt. Zugleich offerierte der Beitrag einige wesentliche Pluspunkte der verlustfreien Komprimierung des im Web mittlerweile gängigen Formats. Diesmal wird der Fokus ausschließlich auf das Desktop-Tool ImageOptim gerichtet – eine komfortable Bereinigungsmethode nicht nur für PNG-Images mit strukturierter, erst vor kurzem überarbeiteter Bedienoberfläche. Die wahre Stärke der Applikation: Bilder – auch en masse – Mac OS-weit im Gewicht zu reduzieren. Dabei genügt ein Rechtsklick auf die Zieldatei.

Nativer Grafikverbesserer
Im Vergleich zu existenter Mac-Software mit der Spezialisierung auf Bildkomprimierung, läuft ImageOptim nativ unter Mac OS X Snow Leopard, setzt also keine (nach)installierte Umgebung Rosetta voraus. Zum Schnelleinstieg kann sich das kostenfrei erhältliche Programm auf Wunsch des Benutzers umgehend im Dock für Drag&Drop und zusätzlich im Menü für den Zugriff via Rechtsklick einnisten. Mehrauswahl erwünscht: Zahlreiche zu verarbeitende Dateien – gar ganze Verzeichnisstrukturen unterschiedlicher Tiefe – stellen die Anwendung keinesfalls vor Herausforderungen.

Eine in der Statusbar eingesetzte Fortschrittsanzeige signalisiert den ausgeführten Gesamtvorgang, abgearbeitete Objekte werden direkt in der Auflistung von anstehenden Aufgaben durch grüne Icons hervorgehoben. Nach der Fertigstellung der Dateiminimierung aktualisieren sich die Werte wie Größe und Kompressionsgewinn selbsttätig.

ImageOptim GUI
Smarte GUI von ImageOptim: Eine Zeile pro Datei

Doch aufgepasst, im Auslieferungszustand überschreibt ImageOptim die Originaldatei mit der verfeinerten Version des Bildes ohne vorherige Zustimmung seitens Nutzer. Für die Gegner der gut gemeinten Automatik halten die zahlreichen Einstellungen eine entsprechende Option parat, die vor dem eigentlichen Verkleinerungsprozess eine Sicherung des Originals zwecks notbedingter Wiederherstellung durchführt.

Positiver Effekt: Zur Säuberung des Bild-Quelltextes greift das Tool – sofern in den Optionen aktiviert – auf diverse Optimierungsbibliotheken (u.a. PNGOUT, PNGCrush, OptiPNG, AdvPNG) zu und nutzt dabei die jeweiligen Stärken der einzelnen OpenSource-Lösungen. Auch kann die Anzahl der Durchgänge stufenartig manuell justiert werden, um die CPU-Auslastung zu schonen und die resultierende Ausführungszeit auf das Nötigste zu minimieren.

ImageOptim komprimiert auch kleinere PNG-Bilder
PNG behandelt mit ImageOptim: Ergebnis beträgt 57 % der Originalgröße

Zusammenfassung
Professionelles, kompaktes und je nach Anzahl der internen Optimierungsrunden rasches Konzept für weiteren Performance-Schub einer Webseite durch die Minimierung der Dateigröße bei gleichbleibender Qualität. Abhängig von der Bildabmessung und abgebildetem Muster sind Optimierungen von bis zu 98 Prozent nicht unwahrscheinlich.

WordPress-Tipp am Rande
Für WordPress-Anwender empfiehlt sich ein Komprimierungsdurchlauf auf den kompletten uploads-Ordner, welchen ImageOptim je nach Umfang in einer halben Stunde in optimierter Form und viele Megabyte leichter zurückgibt. Die überschaubare Vorgehensweise der Aktion:

Sergej Müller

[Der Autor] Sergej Müller ist enthusiastischer Software Engineer mit Schwerpunkten Webentwicklung und WordPress. Seit 2007 programmiert und vertreibt er wpSEO, das weltberühmte und patentierte SEO-Plugin für WordPress-Blogs.

Soziale Werkzeuge

20 Kommentare zum Artikel

129 Tage zuvor | #1 Tim

Für Windows gibt es ein ähnliches kleines Programm, das dazu noch portabel ist und wunderbar in das Senden an gepackt werden kann: PNG Optimizer
http://j.mp/aUz5Zz
@Sergej: Immer wieder interessante Artikel. Mach weiter so!

Tim
129 Tage zuvor | #2 datenkind

Cooler Tipp, danke Sergej. Ich liebe diese kleinen Helfertools, du kannst einfach gezielter damit arbeiten. Und man muss nich dauernd smush.it oder ähnliches nutzen – hochladen, runterladen, entpacken, sortieren … blah.

datenkind
129 Tage zuvor | #3 Sergej Müller

Richtig. Online-Dienste haben immer Begrenzungen, entweder in Form von Gesamtgröße oder dürfen keine Verzeichnisse hochgeladen werden. Lokale Tools sind da viel flexibler und dabei auch noch performant.

Sergej Müller
128 Tage zuvor | #4 powL

Habe erst gestern über eine Methode gelesen, wie man dies mit Windows-Programmen bewerkstelligen kann (vorausgesetzt man besitzt die Software). PNG mit Photoshop erstellen (32Bit) und dann mit Fireworks (gehört ja mittlerweile auch zu Adobe) das PNG optimieren bzw. shrinken. Photoshop selbst bietet nur die Auswahl zwischen 8Bit und 32Bit PNGs, mit Fireworks kann man jedoch auch die Werte dazwischen auswählen und so PNGs erstellen, welche annähernd gleiche Qualität, jedoch wesentlich geringere Größen haben.

powL
128 Tage zuvor | #5 Sergej Müller

Huch, Adobe ;)
Und wenn man die exportierten Bilder dann noch durch einen PNG-Optimierer (ImageOptim in meinem Fall) schickt, dann würde man die Dateigröße noch kleiner bekommen, da das Tool daraus noch Metadaten und unnötige Farbprofile entfernt.

Sergej Müller
128 Tage zuvor | #6 Viktor

Danke! Nachdem “Ping” auf OSX10.6 nicht mehr ging, hatte ich gar keine vernünftige Alternative finden können!

Viktor
128 Tage zuvor | #7 Viktor

Leider ist die Ausbeute nicht ganz so hoch, wenn man mit Photoshop (CS3) bereits mit “Speichern fürs Web” das PNG abgelegt hat — muss ich wohl doch stückeln…. ein 1008 x 229 transparentes PNG geht ja gar nicht ;)

Viktor
128 Tage zuvor | #8 Alex-Leopold

Danke für den Tipp, scheint gute Bibliotheken zu verwenden.
Hat das eventuell schon jemand mit Yahoo’s SmushIt verglichen? Was ist besser? Bin bisher mit keinem Program an SmushIt rangekommen! :)

Alex-Leopold
128 Tage zuvor | #9 Sergej Müller

Smush.it hatte ich mal aufgegeben, nach dem Yahoo den Dienst übernommen hat. Hast du schon mal PunyPNG probiert? Diesen Service hatte ich bevorzugt genutzt, aber wie ich oben schon sagte, viel zu beschränkt das ganze.

Aber ich habe für dich einen Test durchgeführt:

Sergej Müller
128 Tage zuvor | #10 René

Also das Smush.it-Plugin für WordPress kann ich empfehlen, komprimiert bereits beim Upload und funktioniert zuverlässig.

René
128 Tage zuvor | #11 Stephan

danke für den Test

Stephan
128 Tage zuvor | #12 Viktor

Zwei Punkte gegen Smush.it:

a. Smush.it hat bei mir nach 6 Versuchen nur einmal ein Ergebnis geliefert
b. es ist webbasiert (die Bilder verbleiben evt. auf dem Server)

Viktor
128 Tage zuvor | #13 Sergej Müller

@Stephan
Gern geschehen.

@Viktor
Es sprechen viele Faktoren gegen einen Online-Optimierer. Zum Beispiel werden keine Bilder in Unterverzeichnissen akzeptiert oder die vorgegebene Uploadgröße stört enorm.

@René
Absolut korrekt. Natürlich ab dem Zeitpunkt der Inbetriebnahme des Plugins im Blog. Bis dahin hochgeladene Bilder bleiben sicherlich unberührt. Deswegen auch mein Tipp mit dem Kopieren und der Behandlung des upload-Ordners. Sozusagen zur Sicherstellung der Rückwärtskompatibilität ;)

Sergej Müller
128 Tage zuvor | #14 René

Da hast du recht, es gibt zwar die Möglichkeit in der Medienverwaltung alle bereits auf dem Server liegenden Bilder nachträglich “Re-smush” zu optimieren, dies leider aber nur einzeln, also sehr umständlich.

Das Plugin ist im Grunde genommen eine einfache und wenig aufwendige Lösung, der Upload dauert nur 1-2 Sekunden länger, dafür hat man das komprimierte Bild aber auch gleich auf dem Server.

Für den Windows PC nutze ich noch den kostenlosen VSO Image Resizer, der passt Größe an, verringert Qualität, fügt Wasserzeichen/Schrift oder Rahmen ein, ändert Format, speichert verschiedene Profile und vieles mehr. http://j.mp/bXWt3w

René
128 Tage zuvor | #15 Alex-Leopold

Danke Sergej für den Test.

Ich habe gerade meinen ganzen mit ImageOptim komprimierten Ordner nochmal bei Smushit hochgeladen und Smushit konnte nocheinmal 0,67% rausholen ;)

Alex-Leopold
128 Tage zuvor | #16 Sergej Müller

@Alex-Leopold
Dann muss ImageOptim feiner justiert werden, damit du auf meine Ergebnisse kommst.

Sergej Müller
128 Tage zuvor | #17 Viktor

@Alex-Leopold
Wenn Du mit ImageOptim einen weiteren Durchgang machst, kommst Du auf ähnliche Werte…..

Viktor
128 Tage zuvor | #18 Alex-Leopold

Hab tatsächlich nur die Standardeinstellungen. Was hast Du besser gemacht? PNGOut?

Alex-Leopold
128 Tage zuvor | #19 Sergej Müller

Ich habe auch alle Bibliotheken außer PNGOUT aktiviert. Da muss du ein wenig rum spielen, um die goldene Mitte zwischen Performance und Ergebnis zu ermitteln.

Sergej Müller
119 Tage zuvor | #20 AN24

Danke für den Tipp! Ich hatte bisher Imageoptimierer wie PunyPNG und Smush.it im Einsatz und war über das Ergebnis nicht immer begeistert. Aber diese Lösung muss ich mal ausprobieren.

AN24

3 Verlinkungen auf den Artikel

› MacGamper's Blog. » Blog Archiv » PNG-Bilder opt [...]

› Linkhub – Woche 17-2010 - pehbehbeh

› 7 Tipps: WordPress beschleunigen » WordPress, Google, Besucher, [...]

Kommentar verfassen