Els arxius del tipus SVG poden ser incrustats en una pàgina web, en el codi HTML, per tant és important que optimitzem l’arxiu i que siguem organitzats amb l’arxiu des Illustrator perquè en exportar no hagi codi innecessari.
- Agrupa elements en Illustrator només si això implica algun ús pràctic en l’HTML, el codi SVG afegeix una etiqueta <g> als elements agrupats.
- Anomena les capes i els elements en l’arxiu de illustrator per poder identificar cada element després des del HTML.
- Evita utilitzar efectes que necessitin d’un procés de rasterització, ja que es perdria el sentit d’utilitzar aquest format. Després pots afegir efectes SVG als gràfics directament a l’HTML (o al mateix Illustrator en Effect> SVG Filters) evitant així que els elements es rasteritzin.
- Utilitza símbols per elements repetitius dins la infografia
- Evita utilitzar pinzells artístics o vectors molt complexos.
- Optimitza la teva il·lustració reduint el nombre de vectors. Un traçat complex amb molts punts es tradueix en un arxiu svg més pesat. Per reduir de manera senzilla els vectors podem utilitzar l’eina warp de manera manual en les àrees que vulguem i més controlat o simplificar mitjançant Objecte> traçat> simplificar d’una manera més general, o bé una combinació de tots dos.
Us deixo a més aquests enllaços que us poden ajudar a entendre alguns conceptes bàsics sobre l’ús i optimització de svg a la web:
https://escss.blogspot.com/2014/04/SVG-guia-inicio-uso-creacion.html