So funktioniert die SVG-Optimierung
Die Optimierung erfolgt vollständig im Browser: SVG-Dateien werden mit JavaScript analysiert und von Editor-Metadaten, Kommentaren und nicht benötigten Namespaces befreit. Dabei bleibt das Aussehen erhalten, da IDs, Klassen und Spezialreferenzen wie Gradients oder Filter unverändert bleiben. Die Option, das <title>-Element für Zugänglichkeit zu behalten, steht zur Verfügung.
Nach dem Bereinigen können Sie das Original und die optimierte SVG direkt nebeneinander betrachten, um Unterschiede visuell zu prüfen. Keine Datei wird hochgeladen oder weitergegeben – alle Daten bleiben lokal.
Dateigröße reduzieren durch Koordinaten-Rundung
Ein entscheidender Faktor für die Dateigröße ist die Präzision der Koordinaten. Die SVG-Optimierung bietet eine Einstellung, mit der Sie die Dezimalstellen für geometrische Attribute festlegen. Je weniger Dezimalstellen, desto kleiner die Datei – allerdings kann zu starke Rundung die Form von Kurven oder Details verändern.
Für Icons und Illustrationen sollten Sie eine moderate Präzision wählen und das Ergebnis immer mit der Originalansicht vergleichen. Die Optimierung verändert keine Zahlen in URLs, Klassen oder Text, sondern nur die Geometrie.
Grenzen und beste Anwendung der Optimierung
Die Optimierung reduziert Metadaten und geometrische Präzision, aber komprimiert die Datei nicht (z.B. mit gzip). IDs und Klassen werden nicht minifiziert, um Kompatibilitätsprobleme mit CSS oder JavaScript zu vermeiden. Externe Referenzen oder Skripte im SVG werden nicht bearbeitet.
SVGs aus allen gängigen Editoren werden unterstützt, solange sie keine komplexen externen Abhängigkeiten enthalten. Für Dateien mit vielen Filtern oder Gradients empfiehlt sich eine visuelle Kontrolle im Browser, da extreme Rundung zu sichtbaren Änderungen führen kann.
Häufig gestellte Fragen
Wie viel Dateigröße spart die Optimierung typischerweise?
Meist werden zwischen 20% und 60% eingespart – abhängig von Metadaten, Präzision und Editor-Spuren. Zusätzliche Kompression über gzip lässt sich separat anwenden.
Bleibt die Darstellung des SVG in allen Browsern identisch?
Die visuelle Darstellung bleibt bei moderater Rundung und Standard-SVGs gleich. Bei starker Koordinaten-Rundung oder komplexen Filtern empfiehlt sich eine Kontrolle, da minimale Unterschiede auftreten können.
Kann ich auswählen, welche Metadaten oder Elemente entfernt werden?
Sie können wählen, ob das <code><title></code>-Element erhalten bleibt. Andere Metadaten wie Kommentare oder Editor-Informationen werden automatisch entfernt, um die Datei effizient zu bereinigen.
Ist die Optimierung sicher für SVGs mit komplexen Filtern oder Gradients?
Filter und Gradients bleiben erhalten, aber zu starke Rundung kann deren Wirkung sichtbar verändern. Nutzen Sie die Vorschau, um das Ergebnis vor dem Speichern zu prüfen.
Funktioniert das Tool mit SVGs aus allen gängigen Editoren?
Ja, SVGs von Programmen wie Illustrator, Inkscape oder Figma werden unterstützt, solange sie keine externen Skripte oder Referenzen enthalten. Spezifische Editor-Metadaten werden entfernt.
Wie beeinflusst die Koordinaten-Rundung die Qualität von Icons oder Illustrationen?
Eine moderate Rundung hat kaum Einfluss auf einfache Formen. Bei Icons mit feinen Details oder komplexen Kurven sollte die Präzision höher gewählt und das Ergebnis verglichen werden.
Probleme oder Ideen zu diesem Werkzeug? Mitteilung senden