PNG komprimieren

Wie funktioniert die PNG-Kompression im Browser?

PNG ist ein verlustfreies Bildformat: jedes Pixel wird exakt gespeichert, die Datei-Größe entsteht aus drei Schichten — Filter (wie wird die Pixelzeile vorhersagbar gemacht), DEFLATE-Kompression (Zip-ähnliche Reduktion redundanter Bytes) und der Chunk-Struktur (Pflicht-Chunks wie IHDR/IDAT/IEND plus optionale Ancillary-Chunks für Metadaten). Wer eine PNG verkleinert, hat zwei Hebel: bessere Filter/DEFLATE-Wahl (verlustfrei) oder weniger Farben (verlustbehaftet).

Das Tool nutzt zwei spezialisierte Encoder, beide als WebAssembly im Browser-Tab:

PNG (1–50 MB)
    ↓
[1] Alpha-Scan → opaque / binary / semi-transparent
    ↓
[2a] verlustfrei: OxiPNG-Optimizer (Level 2) — bit-identische Pixel
[2b] verlustbehaftet: Palette-Quantisierung — 8 bis 256 Farben
    ↓
[3] Strip-Metadata (tEXt, iTXt, zTXt, eXIf, tIME)
    ↓
[4] A/B-Slider + Per-File-Stats
    ↓
ZIP oder einzelne Dateien

Wenn der WASM-Pfad in deinem Browser nicht initialisiert, fällt das Tool still auf die Canvas-API zurück — kleiner als das Original, aber ohne den vollen Optimizer-Gewinn.

Wann verlustfrei, wann verlustbehaftet?

Verlustfrei wählen, wenn die Pixel exakt sein müssen:

• Screenshots mit Schrift, UI-Mockups, Code-Snippets in Bild-Form
• Pixel-Art, Icons, Logos mit harten Kanten
• Diagramme, Charts, technische Zeichnungen
• alles, was später vielleicht noch nachbearbeitet wird

Verlustfrei liefert typisch 20–40 % Reduktion. Bei modernen Smartphone-Screenshots (PNG mit minimaler Kompression aus der Source) bis zu 50 %.

Verlustbehaftet wählen, wenn Datei-Größe wichtiger ist als Pixel-Treue:

• dekorative Illustrationen mit weichen Verläufen
• Foto-Material, das aus historischen Gründen als PNG vorliegt (besser nochmal: JPEG erwägen)
• 3D-Renderings für Web-Auslieferung
• Hintergrundbilder, bei denen Posterisierung in glatten Bereichen akzeptabel ist

Verlustbehaftet liefert typisch 60–80 % Reduktion. Quality 80 ist der Sweet-Spot für die meisten Illustrationen; unter Quality 50 wird die Palette so klein, dass Banding sichtbar wird.

Was zeigt die Alpha-Channel-Diagnostik?

Bevor du komprimierst, scannt das Tool den Alpha-Kanal jeder Datei und klassifiziert ihn in eine von drei Kategorien:

• Vollflächig deckend (opaque): alle Pixel haben Alpha 255. PNG ist hier oft Overkill — wir zeigen einen Hinweis-Link zum JPG-Kompressor, der für deckende Bilder typischerweise deutlich kleinere Dateien liefert.
• Binäre Transparenz (binary): nur Alpha 0 oder 255, kein Zwischenwert. Klassisch bei Icons mit harten Kanten oder Sprite-Sheets. Beide Modi funktionieren hier ohne sichtbare Artefakte.
• Weiche Transparenz (semi-transparent X %): Zwischenwerte vorhanden, X % der Pixel sind semi-transparent. Klassisch bei Schatten, glühenden Effekten, Anti-Aliased-Kanten. Verlustfrei behält jeden Wert exakt; verlustbehaftet kann hier die Alpha-Werte minimal runden — wir blenden eine Warnung ein.

Die Diagnostik läuft direkt nach dem Drag & Drop, ohne dass du komprimieren musst. Sie hilft bei der Modus-Wahl und ist die Grundlage für den Cross-Link zum JPG-Kompressor.

Was der A/B-Schieberegler zeigt

Der A/B-Vergleich legt Original und komprimierte Version übereinander und blendet sie über einen vertikalen Trennstrich, den du mit Maus oder Tastatur verschiebst. Bei PNG werden Artefakte besonders an folgenden Stellen sichtbar:

• Glatte Verläufe: Im verlustbehafteten Modus erscheint hier Posterisierung — Streifen aus diskreten Farb-Stufen statt eines weichen Gradienten.
• Dünne Linien und Schrift: Bei sehr aggressiver Quality können dünne Anti-Aliased-Kanten brechen.
• Schatten und Glühen: Semi-transparente Bereiche werden bei verlustbehafteter Quantisierung gelegentlich kantiger.

Klick irgendwo ins Bild, um in die Region zu zoomen — beide Seiten zoomen synchron, sodass der Vergleich präzise bleibt. „Zoom zurücksetzen“ bringt dich zur Übersicht. Bei deckenden PNGs zeigt der A/B-Vergleich auch direkt, ob JPEG visuell ausreichen würde — der Vergleich zwischen PNG-lossless und PNG-lossy macht den Unterschied schnell sichtbar.

Metadaten in PNG — was wird entfernt?

PNG-Dateien tragen oft mehr Metadaten als sichtbar. Übliche Quellen:

• tEXt/iTXt/zTXt: Textfelder mit Autor, Software-Name, Kommentaren. Photoshop, Affinity, GIMP setzen hier oft den Programm-Namen und Erstellungs-Datum ein.
• eXIf: EXIF-Block mit Kamera-Marke, GPS-Koordinaten, Aufnahmezeit. Selten in PNG, aber bei iPhone-Screenshots vorhanden.
• tIME: Modifikationsdatum als 7-Byte-Zeitstempel.

Das Strip-Metadata-Toggle (standardmäßig aktiv) entfernt diese Chunks und reduziert die Datei-Größe leicht zusätzlich. Wichtig: das ICC-Farbprofil, der sRGB-Marker, die Gamma- und Chromaticity-Werte und die Pixel-Density bleiben erhalten — sonst kippt die Farb-Darstellung oder das Bild wird in fremder Größe gerendert.

Für eine separate, feinkörnige Metadaten-Entfernung (per-Feld-Auswahl, Vorschau-Scan) nutze unser dediziertes Metadaten-Entfernen-Tool — das funktioniert ergänzend zur Kompression.

Datenschutz — alles bleibt im Browser-Tab

Viele kostenlose Online-Tools für dasselbe Problem laden deine Bilder auf ihre Server, versprechen 24-Stunden-Löschung und löschen meistens auch. Das Problem ist nicht die Löschung, sondern der Upload: Wer den Server betreibt, sieht die Bilder. Personalausweis-Scans, Screenshots mit Passwort-Eingaben, interne Mockups — alles geht durch fremde Hände, wenn auch nur kurz.

Hier passiert nichts davon. Sobald die Seite geladen ist, läuft die gesamte Verarbeitung über Web-Standards (Canvas API, WebAssembly) im Browser-Tab. Du kannst das im Netzwerk-Panel der Entwickler-Tools verifizieren: während der Kompression geht keine Bilddatei nach draußen. Auch keine Telemetrie, keine Klick-Analyse, keine Cookies.

Welche bewussten Lücken hat dieses Tool?

Wir bauen einen PNG-Kompressor, kein Bild-Allzweckwerkzeug. Was bewusst nicht enthalten ist:

• WebP/AVIF-Export: Wären ein anderes Tool (png-zu-webp, png-zu-avif existieren). Diese Seite hält den Scope auf PNG → PNG.
• Server-API: Bricht das Pure-Client-Versprechen — kein Hebel zur Diskussion.
• 50+-File-Stresstest: Soft-Cap bei 30 Dateien mit Warnung. Sehr große Batches brauchen einen Server-Workflow, den wir bewusst nicht haben.
• Per-Pixel-Custom-Filter: Kein Sharpening, kein Posterize-mit-Slider, kein Dithering-Picker. Dafür gibt es Bildbearbeitungs-Programme.
• Color-Profile-Konvertierung sRGB ↔ P3: Komplex, fehleranfällig, hier nicht enthalten. Wir behalten das vorhandene Profil und konvertieren nicht zwischen Farbräumen.
• Resize beim Komprimieren: Eigenes Tool Bild Größe ändern. Wer beides braucht, läuft sequenziell durch beide Werkzeuge.

Das Tool macht eine Sache gut und sagt klar, wo seine Grenze ist.

Welche Bild-Tools sind verwandt?

Weitere Werkzeuge aus dem kittokit-Ökosystem, die zu PNG-Workflows passen:

• JPG komprimieren — wenn dein Bild deckend ist und JPEG visuell ausreicht, ist die JPG-Variante deutlich kleiner.
• Metadaten entfernen — feinkörnige Per-Feld-Auswahl für JPG, PNG, WebP und PDF.
• Bildformat konvertieren — PNG zu WebP oder AVIF konvertieren, beides bei vergleichbarer Quality kleiner als PNG.