SVG: Scalable Vector Graphics

Scalable Vector Graphics (SVG) ist eine auf XML basierende Auszeichnungssprache zur Beschreibung zweidimensionaler Vektorgrafiken.

Als solche ist es ein textbasiertes, offenes Web-Standardformat zur Beschreibung von Bildern, die in jeder Größe sauber dargestellt werden können und speziell dafür entwickelt wurden, gut mit anderen Webstandards wie CSS, DOM, JavaScript und SMIL zu funktionieren. SVG ist im Wesentlichen für Grafiken das, was HTML für Text ist.

SVG-Bilder und deren zugehöriges Verhalten werden in XML-Textdateien definiert, was bedeutet, dass sie durchsucht, indexiert, skriptiert und komprimiert werden können. Außerdem bedeutet dies, dass sie mit jedem Texteditor oder mit Zeichenprogrammen erstellt und bearbeitet werden können.

Im Vergleich zu klassischen pixelbasierten Bildformaten wie JPEG oder PNG können SVG-Vektor-Bilder in jeder Größe dargestellt werden, ohne an Qualität zu verlieren, und können einfach lokalisiert werden, indem der Text innerhalb der Dateien aktualisiert wird, ohne dass ein grafischer Editor erforderlich ist. Mit geeigneten Bibliotheken können SVG-Dateien sogar spontan lokalisiert werden.

SVG wird seit 1999 vom World Wide Web Consortium (W3C) entwickelt.

Anleitungen

SVG von Grund auf einführen

Diese Anleitung zielt darauf ab, die Interna von SVG zu erklären und ist vollgepackt mit technischen Details. Wenn Sie einfach nur schöne Bilder zeichnen möchten, finden Sie möglicherweise nützlichere Ressourcen auf der Inkscape-Dokumentationsseite. Eine weitere gute Einführung in SVG bietet der W3C- SVG Primer. Schauen Sie sich auch dieses adventskalenderartige SVG-Tutorial an, das Sie durch das Codieren von 25 festlichen SVGs führt.

Leitfäden

Referenz

SVG-Elementreferenz

Details zu jedem SVG-Element.

SVG-Attributreferenz

Details zu jedem SVG-Attribut.

SVG DOM-Schnittstellenreferenz

Details zur SVG DOM-API für die Interaktion mit JavaScript.

Anwenden von SVG-Effekten auf HTML-Inhalte

SVG arbeitet zusammen mit HTML, CSS und JavaScript.

Ressourcen