Aufbau/Syntax

XML-konform

XML

Extensible Markup Language
Ein SVG-Dokument muss XML-konform sein d. h. es ist besonders wichtig das eine klare Struktur vorhanden ist. So muss jedes Element geschlossen entweder durch seine End-tag oder am Ende des Start-Tags mit einem Schrägstrich.

 <elemt_mit_end-tag>...</element_mit_end-tag>

<element_ohne_endtag />
        
Die Groß- und Kleinschreibung werden beachtet. Start ist also nicht gleich START oder sTaRt. Bei SVG werden die Elementnamen wie bei XHTML immer klein geschrieben. Jedes XML-Dokument so auch jedes SVG-Dokument benötigt immer die XML-Processing-Instruction sieht im Dokument an oberster Stellen und gibt an das die nachfolgenden Elemente auf der XML Sprache basieren. Sie lautet:
 <?xml version="1.0"?>
        
Damit das Programm, welches das Dokument anzeigen oder verarbeiten soll auch weiß. dass es sich um ein SVG-Dokument handelt und wie es die einzeln Element darstellen soll bedarf es wie bei HTML einer DOCTYPE-Definition kurz DTD für SVG 1.0 lautet sie:
 <!DOCTYPE svg PUBLIC "-//W3C//DTP SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
        
Die eigentliche Grafikauszeichnung steht im Wurzelelementz svg
 <svg xmlns="http://www.w3.org/2000/svg">
 ...
</svg>
        
das Attribut xmlns verweist auf den für SVG-Dokumente vorgesehen Namensraum also alle möglichen Elemente und deren Attribute.

Einbindung in Webseiten

Ein SVG-Dokument speichert man mit der Endung *.svg oder *.svgz. Wobei Dokumente mit der Endung *.svgz gezippte SVG-Dokumente sind und daher kleiner als die *.svg - Dokumente sind. Um solche SVG-Dokumente in eine HTML-Seite einzubinden sollte man denobject-Tag verwenden wobei auch geplant ist dass man auch denimage & embed-Tag dafür nutzen kann.
 <object data="test.svg" type="image/svg+xml" width="100%"
          
height="100%">
Ihr Browser scheint SVG nicht zu unterstützen.
</object>
Leider wird SVG noch nicht in allen Browsern nativ unterstützt. Derzeit stellt Opera, Mozilla und Konquer SVG ohne Plugin wobei Animationen und Effekte nur teilweise unterstüzt werden für Ie und Safari gibt es als Plugin den Adobe SVG Viewer.

enü