Auch Entwickler brauchen Platz zum Spielen

17. Dezember 2012 /

SVG-Bilder verlustfrei in der Größe reduzieren mit SVGO

Schnellere Lade- und Darstellungszeiten für Bilder im SVG-Format dank der verlustfreien Optimierung durch das kostenfreie SVGO-Tool.
svgo

Die für Windows und Mac verfügbare Anwendung SVGO ähnelt dem bekannten und unter Bloggern und Webentwicklern geliebten Optimierungstool ImageOptim: Importierte SVG-Dateien durchlaufen zahlreiche Analyse- und Verbesserungsrunden, um am Prozessende eine beachtenswerte Größenreduzierung zu erfahren. Je nach Größe und Komplexität der behandelten SVG-Bilder fällt der Gewinn auf über 50 Prozent. Bei bleibender Qualität.

Funktionsweise

Bei SVGO GUI handelt es sich um grafische Benutzeroberfläche für ein cleveres Kommandozeilentool, welches Bilder im SVG-Format entgegennimmt, durchläuft und verbessert. Es ist performant, vielseitig und erweiterbar durch benutzerdefinierte Erweiterungen (= Plugins).

Die gewünschten SVG-Bilder zieht der Anwender auf die Anwendung – diese werden zügig verarbeitet und im Anschluss der Optimierung durch minimierte Versionen ersetzt. Simpel und effektiv.

SVGO: SVG-Optimierer
Bereit für die SVG-Optimierung: SVGO

SVGO: Ergebnisse mit SVG-Optimierungen
Optimierte SVGs in der Übersicht

Filter
Das Entwicklerteam listet alle Techniken auf, die für die Minimierung der SVGs zum Einsatz kommen. Dazu gehören u.a.: Eliminierung von Metadaten, Kommentaren, Leerzeichen und Umbrüchen. Diese Liste kann durch den Einsatz von eigenen und bereits entwickelten Plugins erweitert werden.

Browser-Support
Moderne Browser (ja, auch Internet Explorer ab IE 9 gehört dazu) sind in der Lage, Vektor-basierte Grafiken fehlerfrei abzubilden. Für ältere Browser-Versionen kann ein PNG-Fallback geschaffen werden.

GZIP-Komprimierung
Für eine zusätzliche Größen- und Ladezeit-Reduzierung der SVG-Bilder empfiehlt es sich, Dateien in komprimierter Form auszuliefern. Auf diese Weise erfährt die Datei eine doppelte Verschlankung: Einmal durch das SVGO-Tool und ein weiteres Mal mithilfe von GZIP. Mehr Details zu angesprochener Methode im Artikel SVG performant in Webseiten einbinden.

Sergej Müller

[Der Autor]Sergej Müller ist enthusiastischer Software Engineer mit Schwerpunkten Webentwicklung, Apps und WordPress. Seit 2007 programmiert und vertreibt er wpSEO, das zugkräftige SEO-Plugin für WordPress-Blogs.

Thematisch ähnliche Beiträge