Je zou je gisteren afgevraagd kunnen hebben waarom ik export naar SVG zo’n mooie toevoeging vind (zie deel 1). Immers met een export naar GIF, JPG of PNG kom je er voor een browser toch ook? Dat klopt. Daarom een paar schermafdrukken om te laten zien wat het voordeel van SVG is.
Het eerste belangrijke verschil tussen de grafische formaten GIF, JPG, PNG enerzijds en SVG zit in het feit dat de eerste drie zogeheten bitmaps zijn (opgebouwd uit puntjes of pixels) en SVG een vector gebaseerd formaat is (opgebouwd uit beschrijvingen van de lijnen). Voordeel van dat laatste is dat je bij vergroten van de afbeelding niet de bekende “kartelrandjes” krijgt die je bij de andere drie formaten krijgt.
Bijvoorbeeld, neem het volgende SVG bestand (om de link te kunnen bekijken moet je de gratis SVG viewer downloaden. Wil je dat niet dan kun je ook gewoon even de afbeelding als PNG bekijken.
Als je nu in de SVG versie met de rechtermuisknop op de afbeelding klikt zie je een aantal opties. Met inzoomen kun je op de afbeelding inzoomen. Je ziet dat de lijnen kartelvrij blijven ook bij heel erg inzoomen. Een heel praktisch voordeel hiervan is dat dit plaatje niet alleen geschikt is voor gebruik op het web (en slechts 13kB groot na optimalisatie) ook geschikt is voor drukwerk waarbij een hoge resolutie noodzakelijk is.
Als je naar de bron van het bestand kijkt zie je dat deze gewoon uit XML tekst bestaat. Dat maakt het mogelijk om in de inhoud (de tekstregels) van het “plaatje” te zoeken.
Dit is het resultaat.
Omdat het gewoon XML tekst is kun je het bestand gewoon met een teksteditor bewerken. Dat is wat ik gedaan heb om het watermerk dat in mijn geëxporteerde SVG bestand aanwezig was als gewone tekst te verwijderen. Dat zou je een nadeel kunnen noemen, maar je kunt je voorstellen dat je op deze manier ook eenvoudig te bewerken grafieken etc. kunt maken.
Tot zover SVG binnen Visual Paradigm, de Adobe website heeft nog een groot aantal andere (complexere) SVG voorbeelden.
Ook interessant:
