Skip to main content

Image Compressor

Compress images by adjusting quality to reduce file size without losing visual clarity.

Geprüft von · Zuletzt geprüft

🖼️

Drop an image here or click to upload

Supports JPG, PNG, WebP

So verwendest du den Bild-Kompressor

  1. Lege ein JPEG, PNG oder WebP in die Upload-Zone. Das Tool liest die Datei über die File-API und zeigt die Originalgröße, damit du Einsparungen messen kannst.
  2. Ziehe den Qualitäts-Schieberegler. Werte reichen von 1% (starke Komprimierung, sichtbare Artefakte) bis 100% (praktisch verlustfrei neu kodiert). Etwa 75% ist der Sweet Spot für Fotos; 50% ist für Chat-Screenshots ausreichend.
  3. Wähle ein Ausgabeformat: JPEG für maximale Kompatibilität oder WebP für etwa 25-35% kleinere Dateien bei gleicher visueller Qualität.
  4. Beobachte die Live-Vorschau. Ausgabegröße und Prozenreduktion aktualisieren sich sofort, damit du den Schieberegler anpassen kannst, bis du dein Zielbudget erreichst.
  5. Lade die komprimierte Datei herunter. Sie wird über canvas.toBlob(mimeType, quality) exportiert und über eine Blob-URL angeboten - ohne Netzwerk-Roundtrip.

Was Komprimierung tatsächlich macht

JPEG-Komprimierung ist der ursprüngliche Grund, warum wir Fotos im Web teilen können. Der Algorithmus konvertiert jeden 8x8-Pixelblock in den YCbCr-Farbraum, führt eine Diskrete Kosinustransformation auf jedem Block durch, und quantisiert dann die Frequenzkoeffizienten aggressiver für die höherfrequenten Komponenten, für die das menschliche Auge weniger empfindlich ist. Ein niedrigerer Qualitäts-Schiebereglerwert verwendet einfach eine aggressivere Quantisierungstabelle und wirft mehr dieser hochfrequenten Details weg. Deshalb sehen JPEG-Artefakte immer wie unscharfe Blöcke um harte Kanten aus - diese Kanten haben hochfrequenten Inhalt, den der Quantizer auf null reduziert hat.

WebP, in RFC 9649 von Google spezifiziert, verwendet entweder VP8-Intra-Frame-Vorhersage (verlustbehafteter Modus) oder seine eigene verlustfreie Predictor-plus-Huffman-Pipeline. Bei typischen Fotos schlägt WebP JPEG um etwa 25-35% bei gleichwertiger wahrgenommener Qualität, mit dem größeren Gewinn bei niedrigen Qualitätseinstellungen, wo Blockbildung sichtbarer ist. Der Browser stellt beides über canvas.toBlob('image/webp', 0.75) bereit, wobei das zweite Argument der Qualitäts-Hinweis ist, den der Encoder zur Auswahl seiner Quantisierung verwendet.

Wo Dateigrößen-Einsparungen wichtig sind

  • Das Hero-Bild einer Produktseite unter 200 KB bringen, damit Largest Contentful Paint innerhalb des 2,5-Sekunden-Core-Web-Vitals-Schwellenwerts bleibt.
  • Eine Reihe von Urlaubsfotos per E-Mail an ein Familienmitglied senden, dessen Posteingang Anhänge über 25 MB ablehnt.
  • Mehr Screenshots in ein 100-MB-Slack-Datei-Upload-Limit pressen, ohne sie zu skalieren.
  • Einen Langform-Blogpost mit zwanzig eingebetteten Bildern veröffentlichen, der auch in einem mobilen Netz mit schwachem Signal schnell lädt.
  • Monatliche CDN-Egress-Rechnungen senken, wenn dein Traffic über den kostenlosen Tier bei Cloudflare oder Bunny hinauswächst.
  • Eine Fotobibliothek auf einer 256-GB-Laptop-SSD archivieren, ohne alles in die Cloud-Speicherung zu verlagern.

Komprimierungs-Fallstricke

  • Das Neu-Kodieren einer bereits JPEG-Datei verliert immer Qualität. Selbst bei 95% Qualität läuft die DCT-Pipeline erneut und stapelt neue Artefakte auf die bestehenden. Einmal von der Quelle aus komprimieren, niemals wiederholt.
  • PNG-zu-JPEG-Konvertierung flacht Transparenz ab. JPEG hat keinen Alpha-Kanal - transparente Pixel werden in der exportierten Datei weiß. Verwende WebP, wenn du Transparenz plus Komprimierung benötigst.
  • Screenshots mit Text komprimieren schlecht als JPEG. Die scharfen Kanten um Buchstaben liegen in den Hochfrequenzen, die JPEG am aggressivsten verwirft, sodass Text merklich unscharf wird. Screenshots in PNG oder WebP-Verlustfrei behalten.
  • Der Schieberegler ist ein Hinweis, keine Garantie. Qualität auf 50% zu setzen bedeutet nicht, dass du die Hälfte der Dateigröße bekommst - die tatsächliche Reduktion hängt davon ab, wie komprimierbar der Bildinhalt ist. Ein Foto eines klaren blauen Himmels schrumpft dramatisch; eines eines geschäftigen Waldbodens kaum.
  • Farbprofile werden verworfen. Ein ICC-Profil, das in ein Kamera-JPEG eingebettet ist, überlebt die Canvas-Neu-Kodierung nicht. Für farbkritische Arbeiten (Druck) bewahre das Profil mit einem Tool wie ImageMagicks -profile-Flag.

Eine kurze Geschichte der Bildkomprimierung

JPEG wurde 1992 als ISO/IEC 10918-1 standardisiert und bleibt der meistverbreitete Bild-Codec in der Geschichte. PNG (W3C-Empfehlung, 1996) übernahm dort, wo JPEG Schwierigkeiten hatte: verlustfrei, transparenz-bewusst und gut für Screenshots und Icons. WebP (2010) war Googles erster ernsthafter Versuch eines einzelnen Codecs, der sowohl verlustbehaftet als auch verlustfrei plus Transparenz kann, und er genießt jetzt 98% Browser-Unterstützung. AVIF (2019), basierend auf dem AV1-Video-Codec als Standbild-Container, geht noch weiter: etwa 50% kleiner als JPEG bei gleichwertiger Qualität, mit 10-Bit-Farbe und HDR-Metadaten integriert. Es wird überall außer Edge und einigen älteren Safari-Versionen unterstützt. JPEG XL ist die zukunftsweisende Option mit verlustfreier JPEG-Neu-Kodierung und Bearbeitungen ohne Generationsverlust, aber die Browser-Unterstützung ist ins Stocken geraten. Für jetzt decken JPEG und WebP die praktischen Bedürfnisse von 99% der Web-Workflows ab.

Wie dieses Tool sich behauptet

Squoosh.app ist der engste Konkurrent und verdient seinen guten Ruf: Es stellt codec-spezifische Regler bereit (Mozjpegs Trellis-Quantisierung, AVIFs Kacheleinstellungen), zeigt einen Nebeneinander-Vergleichs-Schieberegler und enthält erweiterte Vorprozessoren. Dieses Tool ist schneller für den "einfach verkleinern"-Workflow - ein Schieberegler, ein Knopf, ein Download. Für serverseitige Batch-Komprimierung übertrifft nichts im Web eine Node-Pipeline mit sharp (libvips) oder ImageMagicks magick mogrify -quality 75 *.jpg für einen Ordner. Spezialisierte Dienste wie TinyPNG führen ausgefeiltere perzeptuelle Encoder aus als jeder Browser offenbart, weshalb sie auf PNG-Dateien einen rohen Canvas-Export konsequent schlagen. Verwende dieses Tool, wenn Datenschutz wichtig ist und du ein schnelles Ergebnis benötigst; verwende Squoosh, wenn du Codec-Unterschiede untersuchen möchtest; verwende ein CLI oder einen Dienst, wenn du Hunderte von Dateien auf einmal komprimierst.

Häufig gestellte Fragen

Verlässt das Bild während der Komprimierung meinen Browser?

Nein. Die hochgeladene Datei wird lokal dekodiert, auf eine Offscreen-Canvas gezeichnet und durch den nativen JPEG- oder WebP-Encoder des Browsers mittels <code>canvas.toBlob</code> neu kodiert. Der Netzwerk-Tab bleibt während des gesamten Vorgangs still, und kein Analytics-Ereignis überträgt ein Pixel deiner Bilddaten. Wenn du Original und Ausgabe vergleichst, kannst du sogar beobachten, wie beide im DevTools-Memory-Panel sitzen, ohne ausgehende Anfrage.

Warum halbiert Qualität 75% bei einem Foto nur die Dateigröße und reduziert sie nicht um drei Viertel?

Der Schieberegler steuert die JPEG- oder WebP-Quantisierungstabelle, nicht die Dateigröße direkt. Wie viel tatsächlich schrumpft, hängt davon ab, wie komprimierbar das Bild ist - ein klarer Himmel mit einem sanften Verlauf komprimiert dramatisch, während ein detaillierter Waldboden mit vielen hochfrequenten Texturen kaum ändert. Qualität 75% könnte dir auf einem Foto eine 40% kleinere Datei geben und auf einem anderen 80% kleiner.

Ist das Neu-Komprimieren eines bereits komprimierten JPEG sicher?

Es fügt immer Verluste hinzu, selbst bei hohen Qualitätseinstellungen, weil die DCT- und Quantisierungspipeline erneut läuft. Bei kleineren Größenreduzierungen ist die visuelle Auswirkung normalerweise unsichtbar, aber nach drei oder vier Generationen wirst du das klassische "JPEG-Rot" sehen - blockige Kanten, Farbbluten und Höfe. Komprimiere immer von der originalen Master-Datei, wenn du sie noch hast.

Warum ist WebP typischerweise kleiner als JPEG bei demselben Qualitäts-Schiebereglerwert?

WebP verwendet VP8-ähnliche Intra-Frame-Vorhersage, die jeden Block aus dem umgebenden dekodierten Kontext vorhersagt, bevor nur der Rest kodiert wird. Diese Vorhersage-Pipeline erfasst sanfte Verläufe und wiederholte Texturen effizienter als das block-unabhängige DCT von JPEG. Bei typischen Fotos ist WebP 25-35% kleiner bei gleicher wahrgenommener Qualität, und der Vorteil wächst bei niedrigen Qualitätseinstellungen, wo Blockbildung sichtbarer ist.

Kann ich transparente PNGs komprimieren, ohne die Transparenz zu verlieren?

Ja, aber nur wenn du WebP als Ausgabeformat wählst. JPEG hat keinen Alpha-Kanal und flacht transparente Pixel während des Exports auf Weiß ab. WebP unterstützt sowohl verlustbehaftete als auch verlustfreie Komprimierung mit Alpha, sodass ein Logo mit Transparenz von einem 50 KB PNG auf ein 10 KB WebP schrumpfen kann und trotzdem auf jedem Hintergrund sauber angezeigt wird.

Warum sieht mein komprimierter Screenshot von Text verschwommen aus?

JPEG-Komprimierung ist auf Fotografien abgestimmt, die meist sanfte Verläufe enthalten. Screenshots von Text haben harte, kontraststarke Kanten, die genau in den Frequenzbändern liegen, die der JPEG-Quantizer am aggressivsten verwirft. Für Screenshots verwende PNG (verlustfrei, gut komprimiert bei farbarmen Inhalten) oder WebP-Verlustfrei-Modus - du erhältst eine kleinere Datei UND schärferen Text.

Entfernt die Komprimierung meine EXIF- und GPS-Daten?

Ja. Die Canvas-2D-Export-Pipeline beginnt mit rohen RGBA-Pixeln, die keine Metadaten enthalten, sodass EXIF-Tags wie Kameramodell, ISO, Belichtung und GPS-Koordinaten entfernt werden. Wenn du EXIF bei einer komprimierten Ausgabe behalten möchtest, kann ein Desktop-Tool wie ExifTool die Tags nach der Komprimierung von der Originaldatei in die komprimierte Datei kopieren.

Gibt es eine Dateigrößenbeschränkung, die der Browser durchsetzt?

Es gibt keine harte Obergrenze für die Eingabedateigröße, aber sehr große Bilder (20 MB+ oder 30+ Megapixel) können an die Canvas-Speichergrenze des Browsers um 268 Millionen Pixel (16.384 im Quadrat) stoßen. Darunter ist die Haupteinschränkung die Zeit: Das Dekodieren und Neu-Kodieren einer 20-MB-Datei dauert auf einem modernen Laptop ein paar Sekunden und spürbar länger auf einem Einstiegstelefon.

Wie verhält sich dies im Vergleich zu TinyPNG für PNG-Dateien?

TinyPNG verwendet einen Farbquantisierungsschritt, der die Palette auf 256 indizierte Farben reduziert, was die PNG-Dateigröße oft um 70% mit kaum merklichem Qualitätsverlust reduziert. Der Browser-native PNG-Encoder in Canvas tut das nicht, sodass dein komprimiertes PNG hier größer sein wird. Für PNG-only-Workflows, bei denen Dateigröße kritisch ist, werden TinyPNG oder das CLI-Äquivalent <code>pngquant</code> dieses Tool weit übertreffen.

Sollte ich für eine öffentliche Website in 2026 JPEG oder WebP wählen?

WebP wird jetzt von 98%+ der aktiven Browser unterstützt (nur sehr altes Safari und IE sind außen vor), sodass es ein sicherer Standard für neue Websites ist. Die beste Praxis der Branche ist es, beide über ein <code>&lt;picture&gt;</code>-Element zu liefern - WebP als primäre Quelle und JPEG als Fallback - und den Browser wählen zu lassen. Für Social-Media-Uploads, bei denen die Zielplattform die Kodierung steuert, verwende JPEG als Upload, damit du nicht später doppelt kodierst.

Mehr Image Tools