Wie kann ich die PNG-Dateigröße für das Web reduzieren?

Ich habe eine PNG-24-Datei mit transparentem Hintergrund und die aktuelle Größe beträgt 1,5 MB. Wie verkleinere oder verwende ich das PNG-8-Dateiformat und behalte die gleiche Qualität?

PNG-Datei von hier: http://www19.zippyshare.com/v/69590430/file.html

Beispiel Bild hochgeladen Ich habe alle Vorschläge ausprobiert, aber keine guten Ergebnisse

Vielen Dank

PNG ist ein verlustfreies Komprimierungsformat - ohne das Quellmaterial in der Datei zu ändern, gibt es kaum eine Möglichkeit, die Komprimierung über die Standardkomprimierung auf höchster Ebene hinaus zu erhöhen. Die einzige Möglichkeit, die Größe zu reduzieren, besteht darin, das Bild entweder durch Verringern der Auflösung oder der Farbtiefe zu ändern, damit die PNG-Komprimierung weniger komplex ist.

Verwenden Sie JPEG, wenn Sie eine hohe Komprimierungsstufe für das Bild wünschen und keinen Wert auf verlustfreie Datenspeicherung legen.

RIOT kann das und noch viel mehr.

Radical Image Optimization Tool (kurz RIOT) ist ein kostenloses Bildoptimierungsprogramm, mit dem Sie die Komprimierungsparameter visuell anpassen können, während Sie die minimale Dateigröße beibehalten.

Es wird mit einer Seite-an-Seite-Schnittstelle (Doppelansicht) oder einer Einzelansicht-Schnittstelle verwendet, um das Original in Echtzeit mit dem optimierten Bild zu vergleichen und die resultierende Dateigröße sofort anzuzeigen.

Der Bildoptimierer ist leicht, schnell und einfach zu bedienen und dennoch leistungsstark für fortgeschrittene Benutzer. Sie können die Komprimierung, die Anzahl der Farben, die Metadateneinstellungen und vieles mehr steuern und das Bildformat (JPEG, GIF oder PNG) für Ihre Ausgabedatei auswählen.

Eine andere Möglichkeit besteht darin, eine Kombination aus pngquant, pngout und pngcrush zu verwenden, wie hier beschrieben. Dies erfolgt jedoch über die Befehlszeile.

Hier sind die Anweisungen, wie man png24-Bilder in png8 konvertiert, um das Beste zu erreichen, und zwar über die Befehlszeile mit Open-Source-Tools (glaube ich) pngquant + pngout + pngcrush.

1 - quantisiere das Bild in 256 (also sieht png8 scheiße aus mit großen Sprites oder Sprites mit einem großen Farbbereich).

pngquant 256 some_24_bit.png

2- Konvertiere ein Bild aus einem PNG24 in ein PNG8

pngout -c3 -d8 -y -force some_24_bit.png some_8_bit.png

3- Bild komprimieren

pngcrush some_8_bit.png -bit_depth 8 -brute -rem alla -reduce some_8_bit_small.png

Probieren Sie TinyPNG

Von ihrer Website:

Wie funktioniert es?

Wenn Sie eine PNG-Datei (Portable Network Graphics) hochladen, werden ähnliche Farben in Ihrem Bild kombiniert. Diese Technik wird als "Quantisierung" bezeichnet. Da die Anzahl der Farben reduziert ist, können 24-Bit-PNG-Dateien in viel kleinere indizierte 8-Bit-Farbbilder konvertiert werden. Alle unnötigen Metadaten werden ebenfalls entfernt. Das Ergebnis: winzige PNG-Dateien mit 100% iger Transparenzunterstützung.

Sie haben zwei Möglichkeiten:

• Ziehen Sie die Bilder per Drag & Drop auf ihre Website und sie werden automatisch verarbeitet. Kostenloser Service. (Bis zu 20 Bilder. Maximal 5 MB)
• Photoshop-Plugin. Das kostet $.

Ich habe das PS-Plugin nicht ausprobiert, kann also nicht beurteilen, wie gut es funktioniert.

Wenn Ihnen die Befehlszeile nichts ausmacht, schauen Sie sich OptiPNG an. Vielleicht ist es das, wonach Sie suchen .

OptiPNG ist ein PNG-Optimierer, der Bilddateien auf eine kleinere Größe komprimiert, ohne dass Informationen verloren gehen. Dieses Programm konvertiert auch externe Formate (BMP, GIF, PNM und TIFF) in optimiertes PNG und führt PNG-Integritätsprüfungen und Korrekturen durch.

Verwenden Sie eine Kombination aus pngoutunddeflopt . pngoutermittelt automatisch, ob Ihre PNG-Farben in PNG-8 passen, und verwendet sie. defloptwird einige zusätzliche Bytes aus dem bereits optimierten Bild herauspressen - es ist nützlich, mit deflationierten Daten zu arbeiten, und PNG ist eine davon.

Eine gute Idee für den Umgang mit PNG mit Alpha-Channel im Rahmen der Website-Entwicklung wäre, den Server den Trick für Sie machen zu lassen: Trennen Sie die Bilddaten dynamisch vom Alpha-Channel auf dem Server, optimieren Sie beide separat und kombinieren Sie sie mithilfe von Canvas-Element und etwas JavaScript im Browser. Ta-Da! Funktioniert mit allen modernen Browsern.

Hier wird erklärt, wie es gemacht wird:

http://headers-already-sent.com/artikel/shrinkimage-1/

Sie finden auch ein komplettes ZIP-Paket mit dem PHP-Skript und einem jQuery-Plugin. Lassen Sie uns wissen, was Sie darüber denken.

Wenn Sie ein Bild wirklich verkleinern müssen und all die einfachen Vorschläge nicht funktionieren, besteht die endgültige Antwort darin, das Bild in komprimierbare Teile zu zerlegen und sie auf dem Client mithilfe von Skripten neu zu kombinieren.

Das Bild aus der Frage sieht aus wie ein Farbverlauf mit vertikalen Linien und einigen Flecken / Rauschen. Teilen Sie das in die folgenden Ebenen auf:

1. Der Farbverlauf ohne Linien oder Rauschen. Dies wird in PNG gut und in JPEG sehr gut komprimiert. Verwenden Sie JavaScript, um den Farbverlauf auf dem Client zu generieren. Sie könnten es wahrscheinlich in weniger als 200 Bytes von JS tun.
2. Die vertikalen Linien ohne Farbe oder Rauschen. Sie können dies auf einen einzelnen 4-Bit-Kanal (Alpha oder Grau) komprimieren. Sie benötigen nur ein 1 Pixel großes Bild, das Sie strecken können. Das würde sich in PNG sehr gut komprimieren lassen.
3. Der Lärm. Auch hier benötigen Sie nur einen einzigen 4-Bit-Kanal (Alpha oder Grau). Ohne Farbe oder Linien sollte dies in PNG oder JPEG sehr gut komprimiert werden.

Kombinieren Sie die Ebenen mit JavaScript zu einem einzigen Bild, und Ihr gesamtes "Bild" kann 15 KB oder weniger groß sein.

Diese Art von Arbeit war jahrzehntelang Industriestandard in Games und ist es auch heute noch. Das Tolle ist, dass Photoshop bereits alle diese separaten Ebenen hat, wenn Sie Ihr Bild wie ein Profi erstellt haben.

Standard-PNG-Dateien sind bereits das komprimierteste Bildformat, das Sie verwenden können. Daher werden PNG-Dateien häufig für Bilder auf Websites verwendet, insbesondere für Designzwecke.

Es gibt jedoch noch eine Möglichkeit, PNG-Dateien noch weiter zu komprimieren. durch Verringern der Anzahl der im Bild verwendeten Farben. Dadurch kann die Dateigröße häufig um bis zu 70% oder mehr verringert werden.

Die beste automatisierte kostenlose Software mit dem höchsten Komprimierungsgrad, den ich dafür gefunden habe, ist FileOptimizer, der mehrere Engines (z. B. PngOptimizer, PNGOUT, pngwolf usw.) verwendet, um das Bild auf die kleinstmögliche Größe zu komprimieren.

Ein weiteres Online-Tool, das ich mit guten Ergebnissen gefunden habe, ist dieses: http://www.giftofspeed.com/png-compressor/

Lassen Sie mich FileOptimizer vorstellen . Es kombiniert verschiedene Methoden zur Bildoptimierung (einschließlich EXIF-Entfernung zum Sparen weniger zusätzlicher Bytes - kann deaktiviert werden).

Testergebnisse und Vergleich mit anderen Lösungen.

ScriptPNG http://css-ig.net/scriptpng

Es gibt Ihnen etwa 10 verschiedene Optionen, darunter Lossy! Ich habe ein paar ausprobiert und diese Windows-Batchdatei (mit ein paar EXE-Dateien) ist großartig

Ich persönlich benutze es, um verlustbehaftet auf 8bit zu komprimieren. Ich bin mir nicht sicher, wie es funktioniert, aber meine Screenshots sehen gleich aus. Ich benutze es, um Screenshots zu komprimieren. Ich hatte ungefähr 2GB PNGs, jetzt nur noch 700mb