Lo stesso logo nella navigazione di un sito può essere alto appena 24 pixel, ma stampato sul pannello di una fiera va ingrandito fino a due metri. PNG o SVG? Guarda prima la destinazione. Su pagine web e interfacce di prodotto prevale l'SVG: il marchio è registrato come tracciati e ogni dimensione viene ridisegnata dal software; agli ingressi che accettano solo bitmap (avatar social, certi documenti d'ufficio) si consegna un PNG trasparente; poster, insegne e materiali di stampa usano l'SVG o un vettoriale esportato da esso, nitido a qualsiasi scala. Se per ora hai solo un PNG non serve buttare tutto: conferma il formato richiesto da ciascuno scenario e integra poi ciò che manca.
Punti chiave
- Su web, interfacce e tutti i casi con scalature e cambi di colore ripetuti usa l'SVG: la grafica è registrata come tracciati, si ridisegna in scala e i bordi non sfocano.
- Per gli ingressi che accettano solo bitmap (avatar social, parte del software per ufficio) usa un PNG trasparente, senza pretendere che la piattaforma supporti l'SVG.
- Loghi di forma e logotipi meritano un file master SVG; mascotte fotografiche e immagini di marca con texture complesse restano su PNG ad alta risoluzione.
- L'SVG non è per forza più leggero del PNG: il peso dipende dalla complessità della grafica; il criterio di scelta è l'uso, non la dimensione.
Parti da tre scenari d'uso
Le tre consegne più comuni coprono quasi tutte le destinazioni dei file logo.
Logo nella navigazione del sito. Il marchio in header, footer e interfaccia mobile appare in dimensioni diverse su densità di schermo diverse. L'SVG è la scelta migliore: il browser disegna i tracciati in tempo reale e resta nitido dalla larghezza icona al grande banner in fondo pagina; per cambiare colore si interviene direttamente nel file o nel codice, e lo stesso file si passa intatto al designer per continuarne l'editing.
Avatar social in formato piccolo. Gli upload di avatar accettano di norma solo JPG e PNG: basta un PNG su fondo trasparente, così quando la piattaforma ritaglia l'avatar in cerchio o quadrato attorno al logo non spuntano blocchi bianchi. Le dimensioni di visualizzazione sono limitate e la nitidezza della bitmap è più che sufficiente: qui l'SVG non serve.
Poster di grande formato e materiali di stampa. Poster, roll-up e insegne di negozio ingrandiscono il logo di decine di volte. L'SVG risolve il problema della scala alla radice: i tracciati non conoscono la risoluzione ed è l'uso a decidere quanto grande sia l'output. Con una sola piccola PNG in mano, l'ingrandimento diretto produce sfocatura e scalettatura: è qui che serve davvero un file vettoriale.
Dove si vedono le differenze tra PNG e SVG
La differenza radicale è il modo di registrare la grafica. Il PNG usa una griglia di pixel: ogni punto conserva un colore e, per quanto pesi il file, il numero totale di pixel è fisso; oltre i pixel originali il software può solo stirare quelli esistenti, con bordi che sfocano e scalettano. L'SVG descrive la grafica con tracciati e forme: dove inizia la linea, come curva, quale colore riempie l'area; in scala il software ridisegna da queste descrizioni e i bordi restano lisci.
Il fondo trasparente è sostenuto da entrambi, con metodi diversi. Il PNG conserva il ritaglio attorno al logo tramite un canale di trasparenza; l'SVG per natura non ha “fondo”: la grafica è già un insieme di tracciati. Lo spartiacque vero è l'editing successivo: un SVG si apre e si ricolora integralmente, si spostano le ancore, si smonta e rimonta; il PNG si tratta solo per pixel, e cambiare una campitura richiede ritocchi di zona in un editor bitmap.
Il peso del file è spesso letto male. Con grafiche semplici l'SVG registra pochi tracciati e di solito è leggero; una bitmap ricca di gradienti e grana, convertita in SVG, viene frantumata in una moltitudine di tracciati e può pesare molto più della PNG di partenza. “L'SVG è più leggero” non sta in piedi: ciò che vale è “l'SVG di una grafica semplice è leggero”.
Una tabella di scelta tra scenario e formato
Il tipo di materiale decide più dei parametri di formato. Consigli per tre tipologie ricorrenti di grafica di marca:
| Tipo di materiale | Caratteri della grafica | Consiglio | Motivo |
|---|---|---|---|
| Loghi di forma, logotipi | Bordi netti, campiture limitate | Prepara un file master SVG e salva anche un PNG trasparente | Tracciati puliti ed editabili, l'SVG copre la scala, il PNG fa da riserva dove l'SVG non è supportato |
| Mascotte fotografiche | Gradienti continui, ombre ricche | Conserva il PNG ad alta risoluzione | La vettorizzazione genera una miriade di frammenti difficili da modificare e perde il senso del ridisegno libero tipico dei pochi tracciati |
| Immagini di marca con texture complesse | Molti dettagli, grana marcata | Resta sulla bitmap, vettorizzando localmente dove serve | La conversione integrale costa più di quanto rende; per dimensioni maggiori riesporta prima una bitmap ad alta risoluzione |
Basta una regola: più i bordi sono netti e le campiture poche, più vale la pena vettorizzare; più l'immagine assomiglia a una fotografia, più deve restare in formato bitmap.
Come integrare l'SVG quando hai solo il PNG
Confermata la necessità dell'SVG, la conversione è solo un breve tratto del lavoro. Carica il PNG su Immagine in Vettoriale: lo strumento accetta PNG, JPG e WebP con larghezza e altezza non inferiori a 256 pixel, converte un'immagine per volta dopo l'accesso e al termine scarichi il file SVG. Le schermate di upload, controllo e download, con il flusso completo, stanno nel tutorial della stessa serie “Come convertire PNG e JPG in SVG”, che qui non ripetiamo.
Convertito il file, il risultato va comunque organizzato per uso. Il pannello offre gli ingrandimenti 1×, 2× e 4×: prima della consegna osserva soprattutto curve, ritagli e tratti sottili, verificando che siano puliti. Due cose da accettare in anticipo: i testi diventano tracciati di contorno, la conversione non restituisce i font originali modificabili e cambiare una scritta richiede di ridigitarla in un tool di design; la qualità dei bordi dipende dall'immagine di partenza, una PNG molto compressa produce bordi ruvidi — sostituisci prima un originale più nitido — e queste sistemazioni dell'originale sono trattate in modo specifico in “Cosa fare se i bordi del logo sono ruvidi dopo la conversione in vettoriale”.
Come comporre un pacchetto di consegna dei file di marca
Definiti i formati, organizza il logo in un insieme di file con nomi precisi: qualunque controparte riceverà tutto senza richieste di andata e ritorno. Un pacchetto minimale ma completo si presenta così:
| File | Uso | Esempio di nome |
|---|---|---|
| File master SVG | Unica fonte per web, materiali, ingrandimenti ed editing successivo | acme-logo.svg |
| PNG trasparente | Avatar social, documenti d'ufficio e occasioni solo bitmap | acme-logo-transparent.png |
| Anteprima su fondo scuro | Verificare la leggibilità del marchio su sfondo scuro | acme-logo-preview-dark.png |
| Anteprima su fondo chiaro | Verificare la resa del marchio su sfondo chiaro | acme-logo-preview-light.png |
Usa un prefisso comune e un suffisso d'uso, aggiornando il numero di versione quando cambia: non creare nomi nuovi copiando, o prima o poi nel pacchetto coesisteranno logo-final-2.png e logo-versione-finale.png. Le anteprime su fondo chiaro e scuro conviene tenerle nella stessa cartella: chi riceve verifica a colpo d'occhio se il marchio funziona su entrambi gli sfondi.
I file per la stampa si trattano a parte. Quando il tipografo chiede un PDF vettoriale, una specifica modalità colore o misure con abbondanza, questi file di produzione passano per il flusso di design: dall'SVG come fonte si completa conversione ed esportazione nel software di grafica, confermando punto per punto gli standard colore con il tipografo. L'output di Immagine in Vettoriale è un file SVG: non produce direttamente i file di produzione tipografica.
Domande frequenti
L'SVG è sempre più leggero del PNG?
No, il peso dipende dalla complessità del contenuto. L'SVG di una grafica semplice registra pochi tracciati e di solito pesa poco; una bitmap ricca di gradienti, ombre e grana convertita in SVG genera una massa di tracciati frammentati e può risultare più pesante. Il formato si sceglie per uso ed esigenze di scala, non per volume.
La PNG sfoca ingrandita: serve per forza la vettorizzazione?
Dipende dagli usi futuri del logo. Per un ingrandimento occasionale e una tantum basta riesportare una PNG a risoluzione più alta; la SVG merita di essere integrata quando servono scalature ripetute, ricolorazioni integrali, stampa o un file master di marca di lungo periodo. Un logo fotografico, anche convertito, diventa un insieme di tracciati frammentari difficili da modificare: resta più pratico mantenere la bitmap ad alta risoluzione.
Il tipografo chiede un PDF: come comportarsi?
Segui i requisiti specifici del tipografo affidandoli al flusso di design: apri il file master SVG nel software di grafica, esporta il tipo di PDF richiesto e conferma punto per punto modalità colore, abbondanza e altri parametri. Immagine in Vettoriale produce SVG: il PDF per la produzione tipografica nasce nella fase di design.
Con solo il PNG, integra prima una SVG
Parti dalla voce mancante del pacchetto: se hai solo la versione PNG, integra prima una SVG con Immagine in Vettoriale, mettila alla prova nelle anteprime su fondo chiaro e scuro e decidi poi se può fare da file master. Fatto questo, i tre scenari — sito, avatar e poster — hanno ciascuno il proprio formato.
