Con l'aumento dei diversi dispositivi utilizzati per navigare sui siti web, sta diventando sempre più importante utilizzare buone pratiche di design per consentire al numero massimo di utenti possibile di visualizzare un sito web e per fornire un buon livello di user experience.
Ed ecco perché entrano in gioco le immagini SVG.

Che cos’è un ‘immagine SVG?
L’ SVG (Scalable Vector Graphics), come suggerisce il nome, è un formato di file immagine basato sul codice XML, creato e modificato con software come Adobe Illustrator o CorelDRAW, anche se, essendo un formato basato su XML, può essere modificato con un semplice editor di testo.
 

I vantaggi di utilizzare SVG

1. SVG offre un enorme vantaggio rispetto all'utilizzo di altri formati di file immagine come jpeg, png o bmp, ed è più appropriato per i responsive website. Questo perché formati jpeg, png e bmp sono formati di grafica raster. In breve, questi formati di file immagine non sono adatti per i loghi o le icone.

2. SVG crea file di dimensioni più piccole: dal punto di vista delle prestazioni, un SVG è spesso un file di dimensioni molto più piccole rispetto ai tradizionali formati bitmap grafici come JPEG e PNG.
Questo comporta una maggior velocità di caricamento della pagina web.

3. Un'immagine adatta a tutti: più versioni e dimensioni di un'immagine non sono necessari. Ne è sufficiente una sola e questo è incredibilmente utile per il web responsive design, perché l'immagine può essere ridimensionata automaticamente senza perdere definizione e impatto. La possibilità di ridimensionare l'SVG significa che qualsiasi immagine apparirà nitida al variare della risoluzione.


 

Gli inconvenienti

Nonostante tutti i lati positivi, SVG non è, purtroppo, una soluzione perfetta. Uno dei maggiori problemi è che non si può manipolare il vostro SVG con CSS a meno che il codice XML venga inserito direttamente nel DOM HTML, che è ben lungi dall'essere l'ideale.
L'altro problema è che hai bisogno di includere un file in png o jpg per soddisfare le esigenze di coloro che utilizzano ancora versioni come Internet Explorer 8.
 

Conclusione

Non solo il file SVG è migliore per il ridimensionamento e lo zoom dell’immagine, ma anche per mantenere la dimensione del file minore rispetto ai formati di grafica raster, che rallentano i tempi di caricamento.

SVG è il futuro, e con un tale ampio spettro di browser che lo supportano, non c'è motivo per non iniziare ad utilizzarlo già da oggi.

Informativa
Questo sito o gli strumenti terzi da questo utilizzati si avvalgono di cookie necessari al funzionamento ed utili alle finalità illustrate nella cookie policy.
Se vuoi saperne di più o negare il consenso a tutti o ad alcuni cookie, consulta la cookie policy
Chiudendo questo banner, scorrendo questa pagina, cliccando su un link o proseguendo la navigazione in altra maniera, acconsenti all'uso dei cookie. Per saperne di più.