Nun, da bereits die Fähigkeit vermittelt wurde, einfache SVGs zu erstellen, soll kurz ein etwas trockeneres, aber sehr wichtiges Thema angesprochen werden. Wie man an einigen Beispielen schon gesehen hat, können auch sehr einfache SVG-Dokumente schnell riesengroß und damit unübersichtlich werden. Aus diesem Grunde werden nun die strukturierenden Tags vorgestellt, die der besseren Lesbarkeit, Wiederverwendbarkeit von Elementen und einem kürzeren Code dienen.

Eine große Rolle spielen dabei Gruppierungen. Man kann beliebige Elemente in einer Gruppe zusammenfassen, indem man sie zu Child-Elementen eines <g>-Elementes macht. Dabei kann man auch Gruppen schachteln. Wird auf eine Gruppe eine Transformation angwendet, wirkt sich diese auch auf die Kind-Elemente aus, genauso, wie wenn man in einem Grafikprogramm mehrere Elemente markiert und dann gemeinsam verschiebt oder skaliert.

Das alleine macht den Code sicher schon einmal übersichtlicher und in Kombination mit dem <use>-Tag wird der Code dann auch noch kürzer. Wenn einem Element, z.B. einer Gruppe eine id gegeben wird, kann ich an anderer Stelle genau das Element oder eben die Gruppe wiederverwenden und dann modifizieren, z. B. transformieren. Das lohnt sich besonders bei sich häufig wiederholenden Strukturen. Änderungen lassen sich schneller und einfacher machen, da man nur noch das Element, welches benutzt wird, modifizieren muss. Das <use>-Tag muss also das Attribut xlink:href besitzen, in dem dann die id des zu benutzenden Elements nach einem # angegeben wird.

Anbei sei noch zu bemerken, dass in einem SVG-Dokument alle zu referenzierenden Elemente am Anfang des Dokuments, eingeschlossen vom <defs>-Tag, zu definieren sind. Das ist zwar nicht vorgeschrieben, aber schon alleine im Sinne der Übersichtlichkeit sollte man sich daran halten. Die dort definierten Elemente werden nicht gerendert und müssen also, um überhaupt im SVG Bedeutung zu erhalten, referenziert werden.

Als letztes noch die Tags <desc> und <title>. Hier können Beschreibungen und Titel zu den Elementen gemacht werden, die nicht mitgerendert werden. Je nachdem, was für einen user agent man zum Betrachten der SVG benutzt, werden diese Elemente als Mouseover-Texte oder in der Titelleiste angezeigt (z. B. im Browser).

Ein Beispiel, das alle strukturierende Tags, die auf dieser Seite vorgestellt wurden, benutzt, findet sich in Beispiel 9.