Anzeige
Smartes Cloud Hosting für anspruchsvolle Projekte.
↬ Loslegen und Spaces testen ↬ Jetzt testen!
Dieter Petereit 1. April 2019

Bildoptimierung: Mit diesen Tools wird dein PNG federleicht

Regelmäßige Leserinnen und Leser des Dr. Web Magazin kennen den großartigen Bildoptimierer TinyPNG aus den Niederlanden. Viele, so wie ich, werden den Schrumpf-Service fest in den Arbeitsalltag aufgenommen haben. Über 70% Ersparnis in der Dateigröße bringt TinyPNG zuverlässig, ohne sichtbar die Qualität zu beeinträchtigen. Das bedeutet indes nicht, dass der Dienst alternativlos wäre. Ich habe diesen und ein paar andere für euch näher betrachtet.

Anzeige

TinyPNG: Schnell und unkompliziert

TinyPNG stellte ich schon einmal ausführlich vor. Deshalb verweise ich hier lediglich auf den damaligen Beitrag und erläutere die Grundlagen des Dienstes nicht erneut. Im Vergleich zum Versionsstand aus unserem Artikel hat sich bei TinyPNG nicht sonderlich viel getan, was allerdings bei den ohnehin überzeugenden Ergebnissen auch gar nicht erforderlich ist. Die wichtigste Neuerung stellt die deutlich erhöhte Größengrenze für PNGs dar. Diese liegt jetzt bei 5 MB. Zum Start vor einigen Jahren akzeptierten sie nur Grafiken mit nicht mehr als 1 MB.

Inzwischen kannst du dir für einen jährlichen Obolus von 25 USD Zugang zum sogenannten Web Interface Pro sichern. Damit entfallen beide Begrenzungen und du kannst beliebig viele, beliebig große Bilder per Batch hoch- und wieder runterladen. Rechne das mal auf eine Datei um. An sich ist das Angebot ein Nobrainer.

Anzeige

tinypng-screenshot
TinyPNG ohne Schwächen: Auch bei meinem Testbild reduzierte es wieder 72%

Damit bleibt TinyPNG das Rundum-Sorglos-Paket für die schnelle Bildoptimierung zwischendurch. Einfach bis zu 20 Bilder im PNG-Format von der lokalen Festplatte auswählen und per Drag and Drop in den Dienst laden.

codeschool-devtools-tinypng_04
So sieht das Testbild nach Behandlung mit TinyPNG aus

Sobald die Bilder dort angekommen sind, beginnt der Schrumpfungsprozess, der in meinem Fall stabil bei um 70% liegt. Dabei komprimiere ich fast ausschließlich Screenshots, naheliegend angesichts meiner Tätigkeit. Ist TinyPNG mit der Arbeit fertig, kann mittels eines Download-Links jedes Bild einzeln wieder heruntergeladen werden. Fertig!

CompressPNG: Leistungsfähiger als TinyPNG

CompressPNG aus dem Hause der tschechischen Agentur Mediafox Marketing, beheimatet im schönen Prag, bietet im Grunde die zu TinyPNG identische Dienstleistung an. Dennoch gibt es einige entscheidende Unterschiede.

  • CompressPNG kann ebenso wie TinyPNG in einem Rutsch mit bis zu 20 Bildern ausgestattet werden.
  • CompressPNG macht keine Angaben zur maximalen Dateigröße. In meinen Tests konnte ich Bilder bis zu einer maximalen Größe von 5 MB hochladen. Erst darüber kam es zu Fehlermeldungen.
  • Zusätzlich zu CompressPNG erreichst du über zwei Tabs die optisch identischen Dienste Compress JPG und CompressPDF, die genauso funktionieren, nur eben mit JPG respektive PDF größenreduzierend umspringen.
  • CompressPNG wendet automatisch die Farbreduzierung an, wenn das Ausgangsbild diese Vorgehensweise anbietet. Du musst hier also nicht manuell die Farben reduzieren, um zu kleineren Gewichten zu gelangen. Das macht das Tool automatisch.

TinyPNG ist schnell und entspricht dem Workflow eines Redakteurs in optimaler Weise. Screenshots machen, in einem Rutsch zu TinyPNG hochladen, kurz warten, alles wieder herunterladen, fertig. In seiner jüngsten Version kann CompressPNG hier mithalten.

Der Dienst spricht inzwischen sogar die deutsche Sprache. Die Vorgehensweise ist so einfach wie beim niederländischen Wettbewerber. Du wählst einfach bis zu 20 PNGs von deiner Festplatte und schienst sie per Drag-and-Drop auf CompressPNG. Der Dienst lädt die Dateien direkt hoch und beginnt mit der Kompression. Dabei wählt er die optimalen Einstellungen für das beste Ergebnis selbst.

Das sollte TinyPNG allerdings erst dann zu denken geben, wenn durch diese Optimierung ein geringeres Dateigewicht erreicht würde. Das ist bislang nicht der Fall. Vielmehr erreichte ich bei diesem Testbild

Optimierungsergebnis: -61 Prozent (Screenshot: Dr. Web)

ein Optimierungsergebnis von minus 61 Prozent und zwar sowohl mit TinyPNG, wie auch mit CompressPNG.

Bei TinyPNG ist damit die Aufgabe erledigt. Du lädst die Ergebnisse herunter und gut ist. Bei CompressPNG muss mit diesem Bildschirm noch nicht Schluss sein:

Hier ist noch nicht Schluss. CompressPNG kann mehr. (Screenshot: Dr. Web)

Probiere einfach mal aus, das angezeigte Thumbnail, unter dem „Herunterladen” anzuklicken. Hast du das nämlich getan, wird ein Bildausschnitt des hochgeladenen Originals unterhalb der Queue angezeigt. Nach kurzer Bedenkzeit erscheint rechts daneben ein Bildausschnitt, der optisch das Ergebnis der Kompression mit den automatisch ermittelten Optimalwerten zeigt.

Nun kannst du dich im Bildausschnitt frei bewegen, etwa bildwichtige Details anzeigen lassen und einer optischen Prüfung unterziehen.

CompressPNG bietet dir Detailverbesserungen an, die TinyPNG nicht im Portfolio hat. (Screenshot: Dr. Web)

HIer kannst du nun durch gezielte manuelle Reduktion der Zahl der Bildfarben das Schrumpfungsergebnis weiter verbessern. Das machst du frei Auge, wobei du immer bedenken solltest, dass ein zu stark komprimiertes Bild beim Betrachter keinen guten Eindruck macht. Deshalb ist es wichtig, einen Kompromiss zu finden, der sich in erster LInie an deinen Besuchenden orientiert.

Hast du tatsächlich Änderungen vorgenommen, darfst du nicht vergessen, den Ok-Button unterhalb des rechts angeordneten Sliders zu klicken, denn erst dann wird die Datei neu komprimiert. Hernach hast du die Möglichkeit, sie über den bereits erwähnten Knopf mit der Aufschrift „Herunterladen” auf deine lokale Platte zu befördern. Solltest du mehrere Dateien in der Queue haben, wird dich vielleicht die Möglichkeit, alle Dateien gesammelt als Zip herunterzuladen, freuen.

TinyPNG bietet inzwischen ebenso eine Möglichkeit des „Download all”, also des Sammel-Downloads aller komprimierten Dateien. Zudem kannst du aus TinyPNG heraus direkt in deine Dropbox speichern.

Fazit: CompressPNG oder TinyPNG? Es kommt drauf an…

Welchen der beiden Cloud-Services soll ich dir nun empfehlen? Sowohl TinyPNG, wie auch CompressPNG sind rasend schnell. Einen Sammel-Download bieten ebenfalls beide und das Ergebnis im Autopiloten ist sehr gut.Bist du Schreiberling kannst du einfach die URL aufrufen, die dir als erste einfällt ;-)

Webdesigner indes werden eher Wert auf ein optimales Ergebnis, weniger auf eine möglichst kurze Bearbeitungsdauer legen. Und an dieser Stelle kann CompressPNG punkten. Das fängt schon damit an, dass CompressPNG überhaupt Möglichkeiten zur Ergebnisbeurteilung und -steuerung bietet. Die verschiebbaren Bildausschnitte erlauben es, kritische Bildbereiche in den Fokus zu nehmen, um daran gezielt die maximal mögliche Kompression fein zu tunen. Wenn du also das Maximum aus deinen PNGs rausquetschen möchtest, solltest du CompressPNG vorziehen.

Übrigens: Unter dem Namen Optimizilla findet du eine Variante von CompressPNG, die PNG und JPG gleichermaßen schluckt.

Lokale Lösungen

Wenn du Bilder optimieren willst, die Personen zeigen, brauchst du einen Auftragsverarbeitungsvertrag mit dem Dienstleister, damit du das konform zur DSGVO machen darfst. Die Cloud-Services müssen überdies genau erklären, was sie mit den Daten tun.

Lass es mich kurz machen. Keiner der beiden Dienste kommt danach in Frage. Die Macher von CompressPNG halten es für ausreichend, dass sie die Dateien sowieso nach einer Stunde löschen und die Betreiber von TinyPNG erklärten mir auf ausdrückliche Nachfrage, dass sie schon deshalb kein Problem sähen, weil sie in den Niederlanden säßen und damit automatisch der DSGVO unterfielen. Seltsame Rechtsauffassung: Ich bin rechtskonform, weil ich in einer Region meinen Sitz habe, in der ich rechtskonform sein muss?

Seis drum. Beide bieten keine Auftragsverarbeitungsverträge und sind somit für den Zweck der Bearbeitung von Bildern, die personenbezogene Daten beinhalten, nicht zu verwenden. Du benötigst also zusätzlich eine lokale Lösung.

PNGGauntlet und ImageOptim – nur verlustfreie Kompression

Deshaln habe ich mir unter anderem PNGGauntlet (Windows) und ImageOptim (Mac OS X) angesehen. Beide Softwares integrieren diverse freie Compression-Engines, etwa PNGout, OptiPNG, AdvPNG und andere. Die Kombination verschiedener Verfahren führt stets zu einer erheblichen Bearbeitungsdauer seitens der Software. Schnell mal ein Bild optimieren, ist damit nicht machbar. Und ja, meine Hardware ist stets aktuell.

Schwerer als der Geschwindigkeitsnachteil indes wiegt das Ergebnis. Denn das ist nach allen meinen Tests stets genau das geblieben: schwer. Die Software konnte nicht annähernd die gleichen oder auch nur entfernt ähnliche Ergebnisse erzielen, wie es TinyPNG oder CompressPNG schafften. Das liegt daran, dass die lokalen Lösungen rein auf verlustfreie Kompression setzen. Das Runterrechnen auf 256 Farben, also die gezielte Verlustoptimierung sehen sie nicht vor.

ImageAlpha – gute Ergebnisse, nur für Mac

Anders arbeitet hier die nur für den Mac verfügbare Lösung ImageAlpha. Sie erlaubt das gezielte Reduzieren der Farbanzahl und einige weitere Parameter mehr. Erste Tests ergaben etwas schlechtere Werte als unter Nutzung von TinyPNG oder CompressPNG. Der Abstand war indes nicht riesig. Ansonsten bietet ImageAlpha ein solides Feature-Set, das sich nicht zu verstecken braucht.

image-alpha
Die UI ist nicht unbedingt hoch-innovativ, aber die Ergebnisse stimmen

Wer also einen Mac sein eigen nennt, sollte sich ImageAlpha auf jeden Fall besorgen. Die Software ist kostenlos verfügbar und vom Bedienkomfort in etwa mit CompressPNG vergleichbar, durch die lokale Bearbeitung allerdings deutlich schneller im Processing. Die Software basiert auf dem Algorithmus hinter PNGquant.

PNGoo – PNGquant für Windows

Was ImageAlpha für den Mac-Anwender, ist PNGoo für die Windows-Fraktion. Das kleine Tool lädst du in einer Zip-Datei herunter. In dieser Zip-Datei findest du die ausführbare Datei PNGoo.exe und ein Unterverzeichnis namens libs. Darin befindet sich PNGquant. Solange du die Exe und das Unterverzeichnis beisammen lässt, kannst du PNGoo einfach per Doppelklick starten. Das funktioniert sogar portabel von einem USB-Stick aus. So hast du deine Kompressionslösung immer dabei. Ich bezweifle allerdings, dass das erforderlich ist.

PNGoo für Windows (Screenshot: Dr. Web)

Die Bedienung ist sehr einfach. Zieh die zu komprimierenden PNGs einfach in das Programmfenster und sie erscheinen in der Liste. Oben wählst du noch aus, ob du den Output in das Verzeichnis lenken willst, aus dem die Originale stammen. Das hat den Effekt, dass die Originale überschrieben werden, was meine Standardeinstellung ist.

Über die Colour Settings kannst du Einfluss auf die Zahl der Farben nehmen. Ich lasse das stets bei der Standardangabe von 256. Theoretisch kannst du hier aber – ähnlich wie bei CompressPNG – visuell experimentieren, wenn du eines der Files in der Liste angewählt hast.

So, damit bist du mit einer schönen Palette an Möglichkeiten der PNG-Kompression ausgestattet. Linux- und Androidnutzern habe ich den Links zum Beitrag ebenfalls Tools hinterlegt. Um unter Linux den Effekt zu erzielen, der nur mit PNGquant zu erzielen ist, musst du eben dieses als Kommandozeilen-Befehl verwenden. Nichts für mich.

Ich nutze weiterhin TinyPNG im Web, sowie ImageAlpha auf dem Mac und PNGoo unter Windows. Was verwendest du?

Links zum Beitrag

(Dieser Beitrag erschien erstmals im März 2013 und wird seitdem aktuell gehalten. Das letzte Update stammt vom 29. März 2019.)

Beitragsbild: Pixabay

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design.

12 Kommentare

  1. Ich finde https://squoosh.app/ immer noch MEGA, wenn es Bildkompression geht.

  2. Hallo und vielen Dank für den Artikel. Ich nutze folgende Webseite für die Kompression: https://www.websiteplanet.com/de/webtools/imagecompressor/
    Auf die Seite wurde ich vor einiger Zeit aufmerksam und ich finde sie brauchbar.

  3. TinyPNG hat auch ein WordPress-Plugin, das ich nicht mehr missen möchte (https://de.wordpress.org/plugins/tiny-compress-images/).

    Das Plugin ist für die ersten 500 Bilder kostenlos. Wobei jede Bildgröße einzeln gezählt hat.

    Mit den Standardwerten beideutet das, dass man 500 / 4 = 125 (Vorschau, Medium, Groß, Orginal) Bilder pro Monat hochladen und komprimieren lassen kann.

  4. Guter Artikel. Wer Photoshop hat, kann es sogar selber machen:
    Als Web speichern -> PNG-8 mit 256 Farben, 100% Dithering und Dropdown auf „Adaptiv“ (= Farbwahl). Have fun! :)

  5. Don’t forget to checkout kraken.io and resizeimage.net

  6. Hallo,

    eine Frage zu Tiny PNG vs. Fireworks: Wenn ich mit Fireworks ein Bild als PNG 8, Farben „Exakt“ exportiere, dann bekomme ich genau die gleiche Dateigröße wie wenn Tiny PNG die Kompression erledigt. Und auch die Fireworks PNG 8-Dateien funktionieren im IE 6 inklusive Transparenz. Kommt bei beiden Tools das gleiche Verfahren zum Einsatz?

  7. Hallo,

    ich habe gerade CompressPNG mit einer 91KB JPEG-Datei getestet und leider festgestellt, dass die PNG-Datei größer als das Original. Gute Ergebnisse habe ich aber mit JPEGmini.com erzielt.

    Grüße
    Mathias

  8. Hallo,
    danke für den sehr ausführlichen Überblick über gängige Tools für die Bildkompression. Aber wieso kannst du nicht 128 Farben einstellen, das geht doch wunderbar mit den plus / minus Symbolen?

Schreibe einen Kommentar zu Stefan Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.