SVG profili
- SVG 1.0: tutti i desktop moderno e browser mobili supportano SVG 1.1, in modo da non scegliere questa opzione.
- SVG 1.1: Quasi sempre vorrai questo.
- SVG Tiny/Basic: questo è un sottoinsieme di SVG destinato ai dispositivi mobili. Solo una manciata di dispositivi supporta SVG Tiny e non le specifiche complete, quindi scegli SVG 1.1.
Nota: SVG Tiny non riduce le dimensioni del file, è solo un sottoinsieme di SVG che è adeguato per i dispositivi con bassa potenza di elaborazione. Scartare sfumature, opacità, caratteri incorporati e filtri. Erik Dahlström dice: Tutti i SVG 1.1 full viewer dovrebbero essere in grado di visualizzare tutti i contenuti SVG 1.1 Tiny/Basic (secondo le specifiche), e probabilmente tutti i contenuti SVG 1.2 Tiny che anche Illustrator produce.
Caratteri nota: se non avete alcun testo nell'immagine questa impostazione non ha importanza.
Adobe CEF: non utilizzare mai questa opzione per la visualizzazione nei browser. È il modo in cui Adobe incorpora i caratteri nei file SVG, per quanto ne so è supportato solo dal plug-in SVG di Adobe.
SVG: incorpora il font come SVG, che non è supportato da Firefox, ma è una buona opzione se si intende supportare solo i dispositivi mobili (che di solito eseguono il webkit).
Crea contorno: si vuole fare questo la maggior parte del tempo, a meno che non si dispone di una grande quantità di testo. Se hai una grande quantità di testo, vorresti incorporare il font con WOFF, ma dovrai farlo a mano.
sottoinsiemi:
Nessuno: questo negare l'impostazione precedente e non incorporare qualsiasi tipo di carattere, se non vi interessa che il font ricade a qualche altro tipo di carattere nel il computer dell'utente sceglie questo.
Solo glifi utilizzati: questo è il più delle volte lo si desidera se si sceglie di incorporare il carattere. Incorpora solo i caratteri utilizzati in modo che non aumenti le dimensioni del file.
[rest of subsettings]: questo è abbastanza chiaro, è possibile scegliere di includere l'intero carattere o sottoinsiemi di esso. È utile solo se SVG è dinamico e il testo potrebbe cambiare in base all'input dell'utente.
Immagini: questo importante solo se si includono le immagini bitmap
Incorpora: questo è di solito quello che si vuole, esso codifica l'immagine come un URI dati in modo che appena carica un file invece del file svg con le sue immagini bitmap companion.
Collegamento: utilizzare questo solo se si dispone di diversi file svg che fanno riferimento a un file bitmap (quindi non viene scaricato ogni volta che esegue il rendering del file svg).
Nota che collegava le immagini bitmap non viene visualizzata se il formato SVG è visualizzato attraverso il tag <img>
, perché img
non permette il caricamento di risorse esterne. Inoltre: webkit ha un bug che non mostra immagini bitmap all'interno di file svg anche se le incorpori. In breve: utilizzare un semplice tag <svg>
se si intende incorporare o collegare immagini bitmap, non utilizzare <img>
.
Preserve Illustrator funzionalità di editing
preferisco salvare un file .ai come la mia immagine di origine, e di pensare del file SVG come una caratteristica Export for web
.In questo modo ti concentrerai sulla riduzione della dimensione del file e avrai una copia incontaminata del tuo file vettoriale con tutte le funzionalità di modifica. Quindi non scegliere questo.
decimali
L'impostazione predefinita 3
è un ambiente sano e si può in gran parte non pensarci più.
Tuttavia, se si dispone di un percorso veramente complicato con molti punti, l'impostazione di questa impostazione su 1 o su 0 riduce notevolmente le dimensioni del file. Ma devi stare attento perché i segmenti Bezier sono molto sensibili a questa impostazione e potrebbero sembrare un po 'distorti. Quindi se abbassi questa impostazione assicurati sempre che sia accettabile in un browser.
codifica
La spiegazione dietro codifica dei caratteri è piuttosto tecnico, e riguarda solo i file SVG con il testo. La codifica più probabile che ti serve è UTF-8, non cambiarla a meno che tu non sappia cosa stai facendo.
Ottimizza per Adobe SVG Viewer
Adobe SVG Viewer è un plugin per il browser da momenti in cui i browser non supportano nativamente SVG. Non so cosa faccia, ma è irrilevante, non controllare questo.
includere dati affettatrici
Questo aggiunge metadati gonfiare al vostro file in formato SVG, a meno che non si ha intenzione di aprire il file in formato SVG più avanti in Illustrator e trovare i tuoi fette (se li avete), non controlli questo
Includi XMP
Più metadati per quanto riguarda il file, è possibile read on XMP here. non selezionare questa
uscita un minor numero di elementi <tspan>
Questa è disattivata se non si dispone di testo. SVG non supporta le tabelle di kern, quindi alcune sequenze di caratteri appariranno troppo distanziate, ovvero AVA
. Illustrator funziona aggirando gli elementi tspan
e modificando leggermente le posizioni dei caratteri. Questo aggiunge un po 'di gonfiamento al file non controllare questo a meno che non ti interessi più sulle dimensioni del file di aspetto del testo.
Usa <textpath>
elemento di testo su un tracciato
Questo sarà grigio, se non si dispone di testo su un tracciato. I browser tendono a variare molto quando si tratta di posizionare il testo su un tracciato, quindi Illustrator cerca di essere utile applicando la rotazione e la posizione al personaggio invece di lasciare il lavoro al browser. non controllare questo a meno che non si preoccupi di più delle dimensioni del file di aspetto del testo.
In generale, vi consiglio di guardare in SVG in generale, troverete che sembra un po 'come HTML e consente di ottimizzare le cose che non si possono fare all'interno di Illustrator.
Sia la domanda che la risposta sono davvero buone su questo - puntelli sia per Baumr che per Duopixel. – aendrew
@aendrew, grazie! – Baumr
Guida molto utile: http://creativedroplets.com/export-svg-for-the-web-with-illustrator-cc/ –