Convertire SVG in PNG

I file vettoriali sono la cosa giusta da conservare e quella sbagliata da spedire. Un SVG si ingrandisce a qualsiasi dimensione senza sfocarsi mai, ed è per questo che loghi e icone vivono in questa forma. Ed è sempre per questo che parecchie cose lo rifiutano: le versioni vecchie di Office, molti moduli di caricamento, le catene di produzione delle icone per app, quasi tutti i flussi di stampa.

Il PNG è il minimo comune denominatore. Si legge ovunque, si vede uguale ovunque, ed è il formato con cui un vettore esce dal mondo vettoriale.

Questa è l’unica decisione da prendere, perché un SVG davvero non ha una dimensione. Descrive forme, non pixel, quindi la conversione deve sceglierne una. L’impostazione della scala la governa, e un numero più grande non costa qualità: il disegno viene ridisegnato anziché ingrandito, quindi resta nitidissimo a qualunque misura chiediate.

Un’abitudine utile è individuare il posto più grande in cui l’immagine comparirà e raddoppiarlo, così si coprono gli schermi ad alta densità. Per un’icona di app, regolate la scala in modo da atterrare esattamente sul numero di pixel che la piattaforma richiede.

L’SVG salva il testo come testo e chiama un carattere per nome: se il font non è incorporato nel file, chi disegna lo sostituisce con un altro e il vostro logotipo spaziato con cura esce storto. È di gran lunga il motivo più comune per cui una conversione da SVG a PNG sembra rotta.

La soluzione definitiva sta nel programma di disegno: convertite il testo in tracciati prima di esportare e le lettere diventano forme che non si possono sostituire. Per inciso, rende anche il file sicuro da passare a chiunque.

Le aree trasparenti restano trasparenti, così un logo si posa su qualsiasi sfondo senza trascinarsi dietro un rettangolo bianco.

A disegnare è resvg e non il vostro browser, il che significa che il risultato è identico su ogni macchina. Un convertitore che passa da un canvas dà esiti leggermente diversi in Chrome e in Safari — esattamente il tipo di differenza che salta fuori solo dopo che il file è stato approvato.

Forme semplici, contorni e riempimenti passano esatti. Dove i motori cominciano a divergere è l’estremità elaborata della specifica: sfocature gaussiane, filtri d’ombra, metodi di fusione e maschere costruite a partire da altre maschere.

resvg implementa le parti della specifica che i file reali usano ed è deliberatamente onesto sul resto: un filtro non supportato viene omesso anziché approssimato in qualcosa che sembra quasi giusto. Se un effetto conta, guardate il PNG invece di darlo per scontato, e se manca, appiattitelo nel programma di disegno prima di esportare.

Un SVG spesso pesa pochi kilobyte perché è una descrizione e non un’immagine. Il PNG è una griglia di pixel, e quella griglia cresce col quadrato della scala: raddoppiare la scala quadruplica il file.

Un logo da 4 KB come SVG può pesare diversi megabyte come PNG da 4000 pixel. Non è un difetto, è l’aritmetica del formato — ma è un’ottima ragione per scegliere la risoluzione che serve davvero e non la più alta disponibile.

È uno dei motivi più frequenti per questa conversione, e la risposta è netta: le piattaforme chiedono misure esatte in pixel, quindi regolate la scala per finire proprio lì e non lì attorno. Ridimensionare il PNG dopo butta via la ragione per cui si è partiti da un vettore.

Per una favicon, tenete presente inoltre che di solito serve un ICO e non un PNG, perché un ICO tiene più dimensioni in un solo file. Convertite in PNG alla misura più grande che vi serve e usate la pagina da PNG a ICO per il resto.

Un SVG può richiamare un’immagine esterna, un carattere esterno o un foglio di stile che sta in un altro file. Quei richiami non fanno parte dell’SVG, quindi quando il file arriva qui da solo, ciò a cui puntavano non arriva con lui.

Il risultato è un PNG con una fotografia mancante o un carattere sostituito. Se il disegno sembrava completo nel programma e incompleto qui, la ragione è quasi sempre questa: esportate di nuovo con le risorse incorporate anziché collegate.

Trascinate l’intera cartella. Ogni file viene disegnato con la stessa scala e torna dentro uno ZIP, che è di solito quello che un set di icone vuole: la coerenza dell’insieme conta più della perfezione del singolo pezzo.

Poiché il disegno avviene sulla vostra macchina non c’è limite per file né coda, e poiché è resvg e non un canvas del browser, la duecentesima icona viene disegnata esattamente come la prima.