SVG- zelfstudie
SVG staat voor Scalable Vector Graphics.
SVG definieert op vectoren gebaseerde afbeeldingen in XML-indeling.
Voorbeelden in elk hoofdstuk
Met onze "Probeer het zelf"-editor kunt u de SVG bewerken en op een knop klikken om het resultaat te bekijken.
SVG-voorbeeld
<html>
<body>
<h1>My first SVG</h1>
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</body>
</html>
Wat je al moet weten
Voordat u verder gaat, dient u enige basiskennis te hebben van het volgende:
- HTML
- Basis XML
Als je deze onderwerpen eerst wilt bestuderen, vind je de tutorials op onze Home-pagina .
Wat is SVG?
- SVG staat voor Scalable Vector Graphics
- SVG wordt gebruikt om op vectoren gebaseerde afbeeldingen voor het web te definiëren
- SVG definieert de afbeeldingen in XML-indeling
- Elk element en elk attribuut in SVG-bestanden kan worden geanimeerd
- SVG is een aanbeveling van W3C
- SVG integreert met andere W3C-standaarden zoals de DOM en XSL
SVG is een W3C-aanbeveling
SVG 1.0 werd op 4 september 2001 een W3C-aanbeveling.
SVG 1.1 werd op 14 januari 2003 een W3C-aanbeveling.
SVG 1.1 (tweede editie) werd op 16 augustus 2011 een W3C-aanbeveling.
SVG-voordelen
Voordelen van het gebruik van SVG ten opzichte van andere afbeeldingsindelingen (zoals JPEG en GIF) zijn:
- SVG-afbeeldingen kunnen met elke teksteditor worden gemaakt en bewerkt
- SVG-afbeeldingen kunnen worden doorzocht, geïndexeerd, gescript en gecomprimeerd
- SVG-afbeeldingen zijn schaalbaar
- SVG-afbeeldingen kunnen met elke resolutie in hoge kwaliteit worden afgedrukt
- SVG-afbeeldingen zijn zoombaar
- SVG-afbeeldingen verliezen GEEN kwaliteit als ze worden ingezoomd of vergroot/verkleind
- SVG is een open standaard
- SVG-bestanden zijn pure XML
SVG-afbeeldingen maken
SVG-afbeeldingen kunnen met elke teksteditor worden gemaakt, maar het is vaak handiger om SVG-afbeeldingen te maken met een tekenprogramma, zoals Inkscape .