--- title: SVG slug: Web/SVG translation_of: Web/SVG ---
Einführung
Dieses Tutorial soll den Einstieg in SVG erleichtern.
Scalable Vector Graphics (SVG) ist eine XML-Auszeichnungssprache zur Beschreibung zweidimensionaler Vektorgrafiken. Im Grunde ist SVG für Grafiken das, was XHTML für Texte ist.

SVG ähnelt etwas der proprietären Flash-Technologie. Aber was SVG von Flash unterscheidet, ist, dass es ein W3C Standard ist und im Gegensatz zu einem geschlossenem Binärformat auf XML basiert. Es wurde geschaffen, um mit anderen Standards des W3C zusammenzuarbeiten, wie zum Beispiel CSS, DOM und SMIL.

Dokumentation

SVG Elementreferenz
Detaillierte Informationen über die von Gecko unterstützen SVG Elemente.
HTML-Inhalte mit SVG aufwerten
SVG arbeitet mit HTML, CSS und JavaScript zusammen und kann verwendet werden, um eine normale HTML-Seite oder eine Webapplikation mit Vektorgrafiken zu bereichern.
SVG in Mozilla
Hinweise und Informationen über die Implementierung von SVG in Mozilla.
SVG Animationen mit SMIL
Wie SVG Animationen mittels SMIL realisiert werden können.
Das SVG Bildformat
SVG ist ein Bildformat für Vektorgrafiken, welche den großen Vorteil haben, dass sie ohne Verlust der Bildqualität skaliert werden können. Bei Rastergrafiken (Bitmaps) ist dies nicht möglich.
Animationen und Interaktionen
Wie HTML, hat SVG ein Document Model (DOM) sowie Events und kann mittels JavaScript angesprochen werden. Das erlaubt Entwicklern animierte und interaktive Grafiken zu erstellen.
Karten, grafische Darstellungen, Spiele und 3D Experimente
Hier sind einige Beispiele aufgelistet, die starken Gebrauch von SVG machen.

Community

  • Mozillas SVG Foren:

{{DiscussionList("dev-tech-svg", "mozilla.dev.tech.svg")}}

Tools