MiniPNG

SVG-Bilder online komprimieren

Metadaten entfernen, Vektor erhalten: Ihr SVG sieht exakt gleich aus

Einen Moment...(/)

Wir optimieren derzeit Ihre Bilder. Bitte warten Sie einen Moment, während wir die besten Ergebnisse für Sie gewährleisten.

Super, wir haben Ihre Bilder erfolgreich komprimiert.

Bilder optimiert.

SVG-Dateien komprimieren, indem Überreste des Editors entfernt werden

Öffnen Sie eine SVG-Datei im Notepad, sehen Sie alles: Tags, Zahlen, Text. Das ist das Format. Keine Pixel, kein Foto, nur Anweisungen zum Zeichnen von Formen. Das ist wichtig, weil es die Bedeutung von Komprimierung hier verändert. Es wird nichts gequetscht oder angenähert. Überflüssiger Text wird einfach entfernt und die Zeichnung bleibt unberührt.

Woher das Gewicht eigentlich kommt

Fast nichts davon ist die Grafik selbst. Exportieren Sie ein Logo aus Illustrator, Figma oder Inkscape, enthält die Datei das ganze „Papierkram“ des Editors: einen Generator-Kommentar, einen DOCTYPE, den seit 2008 niemand mehr braucht, eine XML-Deklaration, einen Metadatenblock mit RDF-Beschreibung des Dokuments, Ebenennamen und einen Style-Block voller Klassen, die kein Element verwendet. Bei einem echten Logo, das wir getestet haben, machten all diese Dinge etwa zwei Drittel der Datei aus. Die Formen waren der kleine Teil.

Dann sind da noch die Zahlen. Editoren speichern Koordinaten mit voller Gleitkomma-Präzision, sodass ein Rechteck, das bei 10 sitzt und 180 breit ist, als 10.000000 und 180.00000000 gespeichert wird. Multiplizieren Sie das mit jedem Punkt in jedem Pfad, können die Dezimalstellen allein die Zeichnung überwiegen.

Es bleibt ein Vektor – es gibt keine Qualität zu verlieren

Das ist der Punkt, über den sich viele unnötig Sorgen machen. Eine SVG hat keine Auflösung. Sie wird jedes Mal neu in der angezeigten Größe gezeichnet – egal ob als 16-Pixel-Favicon oder auf einer Plakatwand. Das Entfernen eines Metadatenblocks ändert daran nichts. Die bereinigte Datei skaliert exakt wie die hochgeladene, sieht in jeder Größe identisch aus und bleibt vollständig im Ursprungsprogramm bearbeitbar.

Was entfernt wird

Die Bereinigung ist bewusst vorsichtig. Sie zielt auf Dinge ab, die keinerlei Einfluss auf die Darstellung haben.

EntferntBehalten
Editor-Kommentare und Generator-StringsJede Form, jeder Pfad und jede Kurve
Der Metadatenblock und seine RDF-NamespacesFarben, Verläufe und Transparenz
DOCTYPE und die XML-DeklarationTextelemente und Schriftarten
Definitionen, auf die nichts verweistVerwendete Filter, Masken und Schnittpfade
Leere Gruppen und EbenenTransformationen und viewBox
Überflüssige Dezimalstellen bei KoordinatenAlles, was das Aussehen beeinflusst

Warum kleinere SVGs wichtiger sind als kleinere Fotos

Eine SVG ist meist ein Logo oder Icon – und sitzt damit im Header jeder Seite und lädt vor allem anderen. Fotos laden spät und oft verzögert. Icons nicht. Ein paar Kilobyte beim Header-Logo einzusparen bringt für die Seitengeschwindigkeit mehr als dieselbe Ersparnis bei einem Bild mitten im Artikel, weil der Header geladen sein muss, bevor der Browser etwas anzeigen kann.

Eine Sache, die Sie vor dem Einsatz prüfen sollten

Die Bereinigung kürzt die internen id-Attribute in der Datei. Verweise innerhalb derselben SVG werden entsprechend angepasst, sodass Verläufe, Masken und Schnittpfade weiterhin funktionieren und die Zeichnung exakt wie vorher dargestellt wird. Was sie nicht wissen kann, ist Code außerhalb der Datei. Wenn Ihre SVG in einem Icon-Sprite steckt, auf das andere Seiten zugreifen, oder wenn ein Stylesheet oder Skript ein Element per id anspricht, sollten Sie diese Fälle nach dem Austausch testen. Bei einem einfachen Logo oder exportierten Icon, also den meisten SVGs, gibt es nichts zu prüfen.

Wenn Ihre SVG ein Foto enthält

Manchmal ist eine SVG eigentlich kein Vektor. Platzieren Sie ein Foto auf der Arbeitsfläche in Illustrator und exportieren als SVG, wird das Bild als langer base64-String im XML eingebettet. Die Datei kann dann zwei Megabyte groß sein, obwohl nur eine Form enthalten ist. Die Bereinigung des Markups rührt diesen Block nicht an, da es sich nicht um Markup handelt. Wenn Ihre Datei kaum kleiner wird und ursprünglich ein Foto enthielt, liegt es daran. Die Lösung: Das Bild entfernen und separat als JPEG oder PNG komprimieren.

Nichts einzustellen

Es gibt keine Optionen, keinen Komprimierungsgrad und keinen Expertenmodus. Datei hochladen, bereinigte Datei zurückbekommen. Mehrere auf einmal funktionieren genauso: Sie können sie einzeln herunterladen, sobald sie fertig sind, oder das gesamte Set als ZIP herunterladen.

Was mit Ihren Dateien passiert

Dateien werden über eine verschlüsselte Verbindung übertragen, bereinigt und eine Stunde später vom Server gelöscht. Es wird nichts gespeichert und nichts anderweitig verwendet.

Was Sie erhalten

  • Editor-Metadaten, Generator-Kommentare, DOCTYPE und ungenutzte Definitionen entfernt
  • Koordinaten auf sinnvolle Präzision gerundet statt auf neun Nachkommastellen
  • Eine Datei, die weiterhin unendlich skaliert und sich im Editor öffnen lässt
  • Identische Darstellung in jeder Größe, geprüft am Original
  • Stapel-Upload, mit Einzel-Downloads oder dem gesamten Set als ZIP
  • Kein Konto, keine Installation, und Dateien werden eine Stunde später vom Server gelöscht

Wie geht es weiter?

Sie arbeiten mit einem Logo, das auch als Bitmap vorliegt? PNG komprimieren übernimmt die transparente Version und WebP komprimieren die moderne. Und falls die SVG doch ein eingebettetes Foto enthält, JPG komprimieren ist die richtige Anlaufstelle.

Häufig gestellte Fragen

Nein, das ist nicht möglich. Eine SVG hat keine Pixel und keine Auflösung. Sie besteht aus Zeichenanweisungen, die der Browser jedes Mal neu in der gewünschten Größe ausführt – also ist sie auf dem Handy genauso scharf wie auf einer Plakatwand. Beim Bereinigen der Datei werden nur Texte entfernt, die nichts zeichnen, wie Kommentare und Metadaten. Formen, Kurven und Farben bleiben unangetastet, sodass das Ergebnis in jeder Größe identisch dargestellt wird.

Der Papierkram, den Ihr Editor hinzugefügt hat. Illustrator, Figma und Inkscape schreiben alle einen Generator-Kommentar, eine XML-Deklaration, einen DOCTYPE, einen Metadatenblock in RDF, Ebenennamen und oft einen Style-Block mit ungenutzten Klassen. Außerdem werden Koordinaten mit voller Präzision gespeichert, sodass ein Wert von 180 als 180.00000000 abgelegt wird. Bei einem typischen exportierten Logo macht all das etwa zwei Drittel der Datei aus. Der Teil, der das Bild zeichnet, ist der kleine Rest.

Ja. Das Ergebnis ist eine ganz normale SVG, die sich in Illustrator, Figma, Inkscape oder jedem Texteditor wie das Original öffnen lässt. Der einzige Unterschied: Ein Teil der Editor-eigenen Verwaltung ist entfernt, sodass Ebenennamen eventuell nicht mehr wie zuvor vorhanden sind. Die Grafik selbst bleibt unverändert und vollständig bearbeitbar.

Dafür gibt es zwei häufige Gründe: Entweder war sie bereits optimiert – das passiert bei SVGs, die aus Tools stammen, die beim Export bereinigen, oder die schon durch einen Optimierer gelaufen sind – oder die Datei enthält ein eingebettetes Foto. Letzteres überrascht viele: Wird ein Foto in Illustrator auf die Arbeitsfläche gelegt und als SVG exportiert, wird das Bild als base64-Block ins XML eingebettet. Dieser Block ist Bilddaten, kein Markup, daher bleibt er beim Bereinigen unverändert. Wenn eine zwei Megabyte große SVG kaum schrumpft, öffnen Sie sie in einem Texteditor und suchen Sie nach einem sehr langen String, der mit data:image beginnt.

Es kann sein, dass Sie darauf achten müssen, bevor Sie die Datei einsetzen. Die Bereinigung kürzt die id-Attribute in der Datei. Verweise innerhalb derselben SVG werden angepasst, sodass Verläufe, Masken und Schnittpfade weiterhin funktionieren und das Bild wie zuvor dargestellt wird. Code außerhalb der Datei ist etwas anderes: Wenn ein Stylesheet ein Element per id anspricht, JavaScript einen bestimmten Knoten animiert oder die Datei Teil eines Sprites ist, das von anderen Seiten referenziert wird, sollten Sie das nach dem Austausch testen. Für ein eigenständiges Logo oder ein exportiertes Icon – also die meisten SVGs – gibt es nichts zu befürchten.

Ja, und beides ergänzt sich optimal. Diese Bereinigung entfernt Text, der gar nicht in die Datei gehört. Gzip, das Ihr Webserver beim Ausliefern anwendet, komprimiert den verbleibenden Text. Beides zusammen ist gängige Praxis und das Ergebnis ist kleiner als jeweils einzeln. Prüfen Sie auch, ob Ihr Server die Komprimierung für den Content-Type image/svg+xml aktiviert hat – manche Standardkonfigurationen decken nur HTML, CSS und JavaScript ab.