← Tutti gli episodi
Copertina di SVG in pratica e uno sguardo lungo
Stagione 30 · Episodio 0010

SVG in pratica e uno sguardo lungo

3 settembre 2026 5:46
0:00 5:46

Ciao, e benvenuto nella decima e ultima puntata della trentesima stagione. Abbiamo attraversato tutto il mondo di SVG: il descrivere invece di memorizzare, raster e vettoriale, la scalabilità infinita, il sistema di coordinate, la scena di oggetti, il documento aperto, l'immagine viva, i suoi confini, e la sua ascesa. Oggi tiriamo le somme, ricomponiamo il ritratto di SVG, e riflettiamo su cosa portarci a casa, anche dal bel legame con la stagione sul CSS.

Ricomponiamo prima il ritratto di SVG, perché ora possiamo vederlo intero. SVG è il formato che descrive il disegno invece di memorizzare i punti: un'immagine vettoriale, fatta di forme descritte matematicamente, non di puntini. Da questa scelta nasce tutto. È scalabile all'infinito, perfetto a ogni dimensione, perché ridisegnabile dalla sua descrizione, grazie alla separazione tra spazio ideale e spazio reale. È una scena di oggetti distinti, non una lastra piatta. È un documento aperto, leggibile e integrato nel web. Ed è, per tutto questo, un'immagine viva, da stilare, animare, rendere interattiva. È perfetto per il geometrico, sbagliato per il fotografico. E oggi è un pilastro essenziale del web. Questo è SVG: descrivere invece di memorizzare, e da lì infinite possibilità.

Fermiamoci sui pochi principi profondi da portare a casa, perché valgono più di ogni dettaglio. Primo: descrivere invece di memorizzare, la ricetta invece della torta, la natura dichiarativa che è la radice di tutto. Secondo: scalare all'infinito, perché la descrizione può essere ridisegnata a qualsiasi dimensione. Terzo: l'immagine viva, la scena di oggetti aperti che si può stilare, animare, far reagire. Quarto: lo strumento giusto per il compito, il vettoriale per le forme, il raster per le foto. Questi principi, descrivere, scalare, la vita, il dominio giusto, sono la bussola per capire SVG oltre ogni tecnicismo. E tutti discendono da quell'unica scelta: descrivere il disegno invece di memorizzare i punti.

Voglio dedicare un momento al legame con la stagione scorsa, il CSS, perché insieme raccontano qualcosa di bello. CSS e SVG sono due fratelli, i due linguaggi dichiarativi del web visivo. Entrambi descrivono invece di produrre già fatto: il CSS descrive come appare la pagina, SVG descrive come appare un'immagine. Entrambi adattano una descrizione a infiniti contesti: il CSS a infiniti schermi, SVG a infinite dimensioni. Entrambi sono documenti aperti, integrati nel web, capaci di dare vita alle cose. E infatti collaborano: puoi usare il CSS per stilare e animare le forme di un'immagine SVG. Sono due facce della stessa filosofia, quella del descrivere e adattare, applicata allo stile della pagina e alla grafica. Il web visivo, nel suo meglio, è questo: descrivere invece di fissare, adattare invece di imporre.

E questo mi porta all'insegnamento più profondo, che lega SVG e CSS a tutto il podcast. Il web visivo, come abbiamo visto, poggia su un'idea potente: non fissare le cose in una forma rigida, ma descriverle in modo che si adattino. Non un'immagine di dimensione fissa, ma una descrizione che scala; non un layout rigido, ma uno stile che si adatta agli schermi. È la stessa saggezza, applicata alla grafica e allo stile: descrivere l'intento e lasciare che si realizzi al meglio in ogni contesto, invece di imporre una forma fissa a un mondo infinitamente vario. Questa flessibilità nata dal descrivere, dal dichiarare invece di fissare, è una delle idee più belle e potenti di tutto il web.

Voglio essere onesto, come sempre, sul giusto posto di SVG, per chiudere il suo ritratto. SVG non è per tutto: per le foto è la scelta sbagliata, e descrivere disegni complessi a mano può essere difficile. Ma per il suo dominio, il geometrico e il grafico, è elegante, potente e a prova di futuro: scala a ogni schermo, vive, si integra col web. È lo strumento giusto per loghi, icone, diagrammi, illustrazioni, tutto ciò che è fatto di forme pulite e deve adattarsi e magari muoversi. Usarlo bene significa riconoscere il suo dominio e sfruttarne le forze lì, senza forzarlo dove non è adatto. Come per ogni strumento, la bravura è conoscerne la natura e usarlo dove brilla.

Voglio lasciarti con un pensiero, lo spirito con cui vorrei che ti portassi via questa stagione e quella sul CSS. C'è, nel modo in cui il web visivo affronta grafica e stile, una piccola saggezza che va oltre il codice: non pretendere di fissare tutto in una forma rigida, ma descrivere ciò che si vuole e lasciare che si adatti con grazia a un mondo che non possiamo prevedere. Un'immagine che scala a ogni dimensione, uno stile che si adatta a ogni schermo: sono esempi di una filosofia della flessibilità, invece del controllo rigido. Descrivere e adattarsi, invece di fissare e imporre: è una lezione che il web visivo, con SVG e CSS, ci insegna con eleganza.

Per oggi, e per questa trentesima stagione, ci fermiamo qui. SVG è il formato che descrive il disegno invece di memorizzare i punti: vettoriale, scalabile all'infinito grazie alla separazione tra spazio ideale e reale, fatto di oggetti distinti, un documento aperto e vivo da stilare, animare, rendere interattivo. Perfetto per il geometrico, sbagliato per il fotografico, e oggi pilastro essenziale del web. I principi da portare a casa: descrivere, scalare, la vita, il dominio giusto. È il fratello dichiarativo del CSS, e insieme ci insegnano la bellezza del descrivere e adattarsi invece di fissare e imporre. Grazie di cuore per avermi accompagnato in questo viaggio dentro SVG, e in questo web visivo fatto di forme che si adattano. Abbi cura di te, e ricorda che descrivere vale più che fissare. A rileggerci presto.