Sobes.tech
Intern

Cos'è SVG?

sobes.tech AI

Risposta dell'AI

SVG (Grafica vettoriale scalabile) è un formato di grafica vettoriale basato su XML per creare grafici bidimensionali. A differenza delle immagini raster, SVG descrive la grafica tramite formule matematiche, consentendo di scalare le immagini senza perdita di qualità.

Caratteristiche principali di SVG:

  • Formato vettoriale: Le immagini sono descritte da primitive geometriche (punti, linee, curve, figure), non da pixel.
  • Base XML: La struttura del documento SVG si basa sulla sintassi XML, rendendola facile da leggere e modificare.
  • Scalabilità: Le immagini possono essere ingrandite o ridotte senza perdere nitidezza o qualità.
  • Interattività: Gli elementi SVG possono essere interattivi, reagendo a eventi (clic, hover, ecc.) tramite JavaScript.
  • Stilizzazione: L'aspetto degli elementi SVG può essere stilizzato usando CSS.
  • Animazione: SVG supporta l'animazione degli elementi tramite strumenti integrati o CSS/JavaScript.

Vantaggi dell'uso di SVG sul web:

  • Ideale per icone e loghi: La scalabilità garantisce una visualizzazione nitida su qualsiasi risoluzione dello schermo.
  • Dimensione del file più piccola: Per molti tipi di grafici, i file SVG possono essere più piccoli rispetto a formati raster simili.
  • SEO-friendly: Il testo in SVG viene indicizzato dai motori di ricerca.
  • Accessibilità: Grazie alla sua natura testuale, SVG è più accessibile per le tecnologie assistive.
  • Facile da modificare: Essendo XML, il contenuto può essere modificato dinamicamente.

Esempio di immagine SVG semplice (cerchio):

<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>