SVG (Scalable Vector Graphics) è un linguaggio di grafica vettoriale bidimesionale basato su XML sviluppato dal consorzio W3C e giunto il 15 Gennaio 2003 alla versione 1.1.
Recentemente sono state sviluppate due ulteriori specifiche di SVG, chiamate SVG Mobile Profiles, ideate espressamente per il mondo dei dispositivi mobili (palmari e telefoni cellulari).
Vediamo di elencare brevemente quelle che sono le caratteristiche principali di SVG:
- È testuale
- È vettoriale
- È "open"
- È un'applicazione XML
- È interattivo
- È dinamico
Gli strumenti per utilizzare SVG
Prima di iniziare a parlare in dettaglio del linguaggio, vediamo quali sono gli strumenti che dovrete procurarvi per poter creare e visualizzare un'immagine SVG.
Come detto in precedenza, un file SVG è formato da testo e quindi per creare un file si può tranquillamente utilizzare un editor di testo (come il Notepad del Windows). Questa è la soluzione più semplice anche se un po' scomoda, specialmente se avete intenzione di creare immagini SVG molto complesse. Una soluzione sicuramente più comoda è quella di utilizzare un software di grafica che sia in grado di salvare in SVG. tra i più famosi citiamo come esempio Adobe Illustrator 10 e il prodotto Open Source Sodipodi, ma la lista dei software di grafica che offrono la possibilità di creare file SVG sta aumentando sempre più.
Per quanto riguarda la visualizzazione si hanno a disposizione due possibilità.
- Visualizzare un file SVG all'interno di un web browser mediante l'utilizzo di un plugin. Questo plugin, sviluppato dalla Adobe, è disponibile sia per Internet Explore che per Netscape ed è liberamente scaricabile all'indirizzo: http://www.adobe.com/svg/viewer/install/main.html
- Utilizzare un'applicazione "stand-alone" ossia un SVG Viewer http://xml.apache.org/batik/
Per visualizzare e modificare gli esempi che troverete nel corso della guida vi consiglio di utilizzare un web browser dotato di plugin SVG ed il vostro editor di testo preferito.
La struttura della Guida
Nel corso di questa guida vedremo di affrontare tutti gli aspetti principali di SVG mostrando sia la teoria del linguaggio sia lasciando molto spazio ad esempi pratici, cosa che ritengo molto importante per una guida introduttiva.
La struttura principale di questa guida sarà :
- Aspetti Base di SVG: analisi della struttura di un file SVG, informazioni su come "disegnare" e gestire gli elementi grafici in SVG;
- Effetti Grafici in SVG: come rendere spettacolare un'immagine SVG applicando filtri grafici in grado di creare ombre o giochi di luce;
- Interattività in SVG: come rendere un'immagine SVG sensibile alle nostre azioni;
- Animazioni in SVG: come creare animazioni SVG che non hanno nulla da invidiare alle animazioni Flash.