Wofür SVG verkleinern gedacht ist
Aus Designprogrammen kommen SVG-Dateien mit vielen überflüssigen Angaben. Vor dem Einsatz auf der Website lohnt es sich, den Quelltext einmal zu entlasten.
Bedienung
- Den aus dem Designprogramm exportierten SVG-Quelltext einfügen
- Optimieren lassen und den Größenvergleich ansehen
- Prüfen, ob das Ergebnis weiterhin mit <svg beginnt und vollständig ist
- Den Quelltext kopieren oder herunterladen und die Datei im Projekt ersetzen
Typische Anwendungen: Ein aus Figma oder Illustrator exportiertes SVG vor der Einbindung entlasten, Eine Sammlung von Symbolen einheitlich aufräumen, Den Quelltext lesbarer machen, um ihn von Hand weiterzubearbeiten.
Fragen und Antworten
Wird die Grafik dabei beschädigt?
Nein. Entfernt werden nur Kommentare und Leerraum, Pfade und Attribute bleiben unberührt; das gerenderte Ergebnis ändert sich also nicht. Sehen Sie das Ergebnis nach dem Verkleinern trotzdem einmal an.
Lässt sich die Datei dadurch stark verkleinern?
Das hängt von der Datei ab. Was ein Designprogramm ausgibt, wird meist um 20 bis 60 Prozent kleiner; ein von Hand knapp geschriebenes SVG hat kaum Spielraum.
Werden Nachkommastellen der Koordinaten gekürzt?
Nein. Das Kürzen der Genauigkeit wäre eine verlustbehaftete Optimierung und könnte sichtbare Abweichungen in Kurven erzeugen – das gehört nicht zu diesem Werkzeug.
Muss ich danach noch in PNG umwandeln?
Ist das Ziel ein Pixelbild, nutzen Sie das Werkzeug für SVG in PNG; hier kommt weiterhin SVG-Quelltext heraus.
Einschränkungen
Es ist eine Reinigung auf Textebene: Pfaddaten werden nicht verändert, ungenutzte Definitionen nicht entfernt und Koordinaten nicht gerundet – solche Eingriffe setzen ein Verständnis der Grafik voraus und sind hier bewusst nicht vorgesehen, damit nichts versehentlich zerstört wird. Wie viel sich einsparen lässt, hängt von der Ausgangsdatei ab; ein bereits knapper Quelltext verliert nur wenige Bytes.
Was das Werkzeug kann
Kommentare und die XML-Deklaration werden entfernt, Leerräume und zusätzliche Zeilenumbrüche zwischen den Elementen werden zusammengezogen, Die Byte-Zahl vorher und nachher sowie die Ersparnis werden genannt, Der optimierte Quelltext lässt sich kopieren oder herunterladen.
Diese Werkzeuge passen inhaltlich zu SVG verkleinern: