SVG (Scalable Vector Graphics).

Rastergrafiken wie JPG, PNG oder WebP bestehen aus einzelnen Bildpunkten. Vergrössert man sie, werden sie unscharf. Eine SVG-Datei beschreibt dagegen: «Zeichne hier einen Kreis mit diesem Radius in dieser Farbe.» Der Browser rechnet das Bild in jeder Grösse neu. Deshalb wirkt ein SVG-Logo auf einem kleinen Smartphone und einem grossen Retina-Bildschirm gleich scharf, ohne dass mehrere Dateigrössen nötig sind.

SVG ist ein textbasiertes Format auf Basis von XML. Man kann es direkt in das HTML einer Seite schreiben (inline), wodurch Farben per CSS angepasst und Elemente animiert werden können — etwa ein Icon, das beim Überfahren die Farbe wechselt, oder eine Linie, die sich beim Scrollen zeichnet. Für Logos, Icons, einfache Illustrationen, Karten und Diagramme ist SVG meist die beste Wahl; für Fotos dagegen ungeeignet, weil die Beschreibung der Millionen Farbabstufungen riesig würde.

Viele SVG-Dateien aus Design-Programmen enthalten unnötigen Ballast: Metadaten, versteckte Ebenen, übermässig präzise Koordinaten. Werkzeuge wie SVGO entfernen das und verkleinern Dateien oft deutlich. Bei Inline-SVG ist zudem auf Barrierefreiheit zu achten: Dekorative Grafiken werden für Bildschirmleser ausgeblendet, inhaltliche Grafiken erhalten einen Titel oder eine Beschreibung — analog zum Alt-Text bei Bildern.

Ein Sicherheitsaspekt wird oft übersehen: Weil SVG Code enthalten kann, lassen sich in SVG-Dateien Skripte verstecken. Websites, auf denen Nutzer eigene Dateien hochladen, sollten SVG-Uploads deshalb entweder sperren oder bereinigen. Für eigene, geprüfte Grafiken besteht dieses Risiko nicht.