Come funziona il compressore SVG
Un file SVG salvato da Illustrator, Inkscape, Figma o Sketch di solito contiene molte cose che un browser non usa mai: metadati dell'editor, commenti, livelli nascosti, valori predefiniti scritti per intero e coordinate con otto o più decimali. Questo strumento elimina tutto ciò con SVGO, l'ottimizzatore SVG open source su cui si basano la maggior parte degli strumenti di build e delle app di design, così il disegno appare uguale ma il file è più piccolo.
SVGO esegue diverse passate sul file. Unisce e accorcia i tracciati, arrotonda i numeri alla precisione che scegli, elimina i gruppi superflui, rimuove gli elementi vuoti e riscrive i colori nella forma più breve. Il viewBox viene mantenuto, così il file SVG si adatta ancora a qualsiasi dimensione, e gli ID a cui altre parti del file fanno riferimento vengono accorciati aggiornando i riferimenti, quindi sfumature e maschere continuano a funzionare.
La precisione è l'unica impostazione che conta. Alta mantiene tre decimali, invisibili a qualsiasi dimensione normale, ed è la scelta sicura per icone e loghi. Bilanciata ne mantiene due, e Il più piccolo uno, adatto alle illustrazioni grandi dove un decimo di unità è molto meno di un pixel, ma che può deformare le icone molto piccole. Se un risultato non ti convince, comprimi di nuovo l'originale con una precisione più alta.
L'ottimizzatore, circa 200 KB, si carica la prima volta che premi il pulsante. I tuoi SVG vengono letti e riscritti in questa scheda e non vengono mai caricati, il che conta per loghi non ancora pubblicati e lavori per i clienti.
Le opzioni del compressore SVG spiegate
| Alta | Tre decimali. Sicura per icone, loghi e tutto ciò che è piccolo. |
|---|---|
| Bilanciata | Due decimali. Adatta alla maggior parte delle illustrazioni. |
| Il file più piccolo | Un decimale. Per grafiche grandi; controlla poi le icone piccole. |
| Mantenuto | viewBox, ID referenziati, sfumature, maschere e aspetto del disegno. |
| Rimosso | Metadati dell'editor, commenti, elementi nascosti e vuoti, precisione superflua. |
Quando usarlo
Comprimi gli SVG prima di mettere icone e loghi su un sito web, dove ogni kilobyte pesa sul caricamento della pagina, prima di inserire un file SVG in linea nel codice HTML o in un componente React, prima di salvare risorse grafiche in un repository di codice, o quando un modulo di caricamento limita la dimensione del file.
Conserva il file SVG originale e modificabile per la tua app di design. L'ottimizzazione elimina i dati dell'editor come i nomi dei livelli e le guide, quindi riapri l'originale quando devi modificare la grafica.
Informazioni sull'ottimizzatore SVG
SVGO, abbreviazione di SVG Optimizer, è lo strumento open source alla base dell'ottimizzazione SVG nella maggior parte degli strumenti di build per il web e nelle app di design che offrono un'esportazione ottimizzata. Analizza il file SVG come un albero, vi applica una serie di passaggi di pulizia collaudati e lo riscrive, ripetendo finché non c'è più nulla da risparmiare. Ogni passaggio eseguito qui mantiene invariato l'aspetto del disegno, ed è per questo che le sue impostazioni predefinite sono affidabili in produzione. La versione usata in questa pagina funziona interamente nel browser, caricata dalla CDN jsDelivr la prima volta che usi lo strumento.
Risoluzione dei problemi del compressore SVG
«già ottimizzato; restituito invariato»
Il file SVG è già stato ottimizzato, quindi non si poteva rimuovere nulla senza modificarlo. Ti viene restituito il file originale.
Una parte del disegno si è spostata o deformata
Le icone molto piccole possono spostarsi con una precisione bassa. Comprimi di nuovo l'originale con precisione Alta.
«non è un file SVG»
Il file non contiene un disegno SVG. Anche i file esportati come SVG che racchiudono solo un'immagine bitmap non si possono ridurre molto; comprimi invece l'immagine al loro interno.
Come usare il compressore SVG, passo dopo passo
- Premi «Scegli file SVG» o trascina i file nel riquadro.
- Imposta le opzioni se serve; i valori predefiniti vanno bene nella maggior parte dei casi.
- Premi «Comprimi SVG». Il lavoro avviene sul tuo dispositivo.
- Salva il risultato con il suo pulsante di download.
È sicuro farlo online?
Con la maggior parte degli strumenti online, «online» significa che il tuo file viene caricato sul server di un'azienda, elaborato lì e conservato per un po' prima di essere eliminato. Qui no. La pagina scarica nel tuo browser il codice dello strumento, e il tuo file viene letto ed elaborato nella scheda, sul tuo dispositivo. Non viene mai inviato a TapToConvert né a nessun altro.
Puoi verificarlo tu stesso: una volta caricati la pagina e il suo motore, disattiva il Wi-Fi e lo strumento continua a funzionare. Questo significa anche che non ci sono code, limiti giornalieri né limiti di dimensione imposti da un server; l'unico limite è la memoria che il browser concede a una singola scheda.
Domande frequenti sul compressore SVG
La compressione cambierà l'aspetto del mio file SVG?
Con precisione Alta, nessuna differenza visibile. Una precisione più bassa arrotonda di più le coordinate, e questo può deformare i dettagli molto piccoli.
Di quanto si ridurrà?
Gli SVG esportati dalle app di design spesso si riducono dal 30 al 70%. Gli SVG già ottimizzati si riducono poco o per niente.
Posso ancora modificare il file SVG compresso?
Sì, ma nomi dei livelli, guide e impostazioni dell'editor non ci sono più. Conserva l'originale per modificarlo.
I miei file vengono caricati?
No. SVGO funziona nel tuo browser, quindi il file SVG non lascia mai il tuo dispositivo.
È gratuito?
Sì. Nessuna registrazione, nessuna filigrana e nessun limite di utilizzo. TapToConvert si sostiene con la pubblicità.
I miei file vengono caricati?
No. Tutto avviene nella scheda del browser, sul tuo dispositivo.