it-swarm.com.de

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?

enter image description here

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

Beispielbild hochgeladen Ich habe alle Vorschläge ausprobiert, aber keine guten Ergebnisse. Bitte geben Sie an.

vielen Dank

16
Welliam

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.

Wenn Sie eine hohe Komprimierungsstufe für das Bild wünschen und keine verlustfreie Datenspeicherung benötigen, verwenden Sie JPEG.

6
mikebabcock

RIOT kann das und vieles 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 parallelen (Doppelansicht) oder Einzelansicht-Oberfläche verwendet, um das Original in Echtzeit mit dem optimierten Bild zu vergleichen und die resultierende Dateigröße sofort zu sehen.

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- Konvertieren Sie 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

9

Try 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 nennt man „Quantisierung“. 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.

6
Dhaust

Wenn Ihnen die Befehlszeile nichts ausmacht, schauen Sie sich OptiPNG an, vielleicht ist es das, was 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.

5
Renan

Eine gute Idee für den Umgang mit PNG mit Alphakanal im Rahmen der Website-Entwicklung wäre, den Server den Trick für Sie machen zu lassen: Trennen Sie die Bilddaten dynamisch vom Alphakanal auf der Server, optimieren Sie beide separat und kombinieren Sie sie mithilfe des canvas-Elements und einiger JavaScript-Elemente im Browser neu. 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 vollständiges Zip-Paket mit dem PHP -Skript und einem jQuery-Plugin. Sagen Sie uns Ihre Meinung dazu.

3
Andreas Ollmann

Verwenden Sie eine Kombination aus pngout UND deflopt . pngout ermittelt automatisch, ob Ihre PNG-Farben in PNG-8 passen, und verwendet sie. deflopt drückt einige zusätzliche Bytes aus dem bereits optimierten Bild heraus - es ist nützlich, mit deflationierten Daten zu arbeiten, und PNG ist eine davon.

3
Oleg V. Volkov

Wenn Sie ein Bild wirklich verkleinern müssen und all die einfachen Vorschläge nicht funktionieren, besteht die letzte Antwort darin, das Bild in komprimierbare Teile zu zerlegen und sie auf dem Client mit 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.

1
Sophit

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 verwendet (z. B. PngOptimizer, PNGOUT, pngwolf usw.). ), 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/

1
William Dresker

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.

enter image description here

1
rluks

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 700mb

0
Mikey