To je manj delček in bolj opomnik za nekaj, kar pogosto pogledam gor. Pri ustvarjanju datotek SVG v programu Adobe Illustrator obstaja nekaj različnih načinov za izvoz datotek. Obe metodi vključujeta nekaj možnosti, nekatere pa popolnoma pozabim, kaj pomenijo in kaj izbrati.
1. način: shrani kot ...
Te metode verjetno ne bi uporabili za shranjevanje SVG za uporabo v spletu. To je v veliki meri namenjeno shranjevanju glavnega dokumenta. Pravzaprav boste morda želeli samo shraniti v obliki Illustrator neposredno. Za izvoz v splet bi uporabili nekatere druge možnosti izvoza.
Najpogostejši način shranjevanja datoteke kot SVG v programu Adobe Illustrator je izbira File > Save As…
možnosti v glavnem meniju.
Illustrator bo sprožil pogovorno okno z vprašanjem, kako poimenovati datoteko in kje jo shraniti. Še pomembneje pa je tudi, da vpraša, katero vrsto datoteke shraniti kot katero, v tem primeru je SVG. Ni stisnjeno v SVG (svgz). Navaden SVG.
Kliknite gumb Shrani in pojavil se bo drug nabor možnosti. Tu mi ponavadi odpove spomin in moram po spletu iskati odgovore. Tu je posnetek zaslona popolnoma optimalnega načina shranjevanja datoteke SVG v programu Adobe Illustrator.
- Profili SVG : To nastavi vrsto dokumenta XML na uvodni
oznaki. SVG 1.1 je najnovejša različica, zajema najširšo podporo in je verjetno najprimernejša možnost. Vse ostalo je bodisi starejša različica bodisi podnabor SVG 1.1 in pri izbiri še nisem naletel na težavo.
- Pisave> Vrsta : Če izberete »Pretvori v oris«, boste zagotovili, da je vse vneseno besedilo v datoteki izvoženo vektorske poti in ne glifi. Glifi imajo možnost, da jih ne upodobijo, vektorske poti pa so vedno velik palec gor.
- Možnosti> Lokacija slike : Če so v datoteki uporabljene rastrske slike (beri: JPG.webp, PNG, GIF), bomo želeli izbrati možnost »Povezava«. V nasprotnem primeru bo rastrska slika vdelana v datoteko in bo s tem povečala zmogljivost že iz SVG, tako da bo povečala velikost datoteke, da bo vključila ta dodatna sredstva. Bolje je, da se nanje sklicujete kot na povezave in te izvorne datoteke vključite v isti imenik kot datoteka SVG.
- Možnosti> Lokacija slike> Ohrani zmožnosti urejanja Illustratorja : ta močno vpliva na izhod datoteke SVG. Ker tukaj verjetno shranjujete »glavno« kopijo, ki ni namenjena nam v spletu, bi to pustili označeno. To bo ohranilo lastniške stvari Illustratorja (na primer vodniki) za naslednjič, ko odprete datoteko. Če ne označite, bodo takšne stvari odstranjene in izgubljene.
- Napredne možnosti> Lastnosti CSS : Za to izbiram »Predstavitveni atributi«, ker lastnosti (npr. Polnila, poteze in podobno) postavlja na najnižjo stopnjo specifičnosti. Na primer
. S tem je element element, vendar ga je v CSS zelo enostavno preglasiti.
- Napredne možnosti> Decimalna mesta : Če ste brskali po kodi za
, potem veste, da so vrednosti, ki določajo te oblike, lahko zelo natančne. Velikokrat pa so ti preveč natančni in prispevajo k celotni velikosti datoteke SVG. Ker tukaj verjetno shranjujete glavno datoteko, jo lahko ohranite dokaj visoko, ker velikost datoteke ne skrbi.
- Napredne možnosti> Kodiranje : Nisem navdušen nad kodiranjem UTF, vendar če to pustite na "Unicode UTF-8", to zagotavlja združljivost s prejšnjimi različicami. Tudi velikosti datotek UTF-8 so ponavadi manjše od UTF-16, tako da je to samo po sebi korist.
- Napredne možnosti> Odziven : Če tega ne potrdite, bodo v SVG nastavljeni fiksni
height
inwidth
atributi. To možnost preverim, ker mi omogoča, da te atribute nastavim v kodi ali v CSS.
2. način: Izvozi kot
Drug način, da dobite SVG iz Adobe Illustratorja, je, da izberete File > Export > Export As…
možnost v glavnem meniju. Vendar pa obstaja drugi način, da do tja pridete s pomočjo plošče Dejanja v delovnem prostoru Illustrator.
Ta možnost je idealna, če veste, da boste to datoteko uporabljali neposredno v spletu, in se ne nameravate kasneje ukvarjati z oblikovanjem. Omogoča manj nastavitev in nekaj možnosti, ki datoteki omogočajo nadaljnjo optimizacijo datoteke za boljše delovanje. Pravzaprav je najbolje, da to storite na kopiji datoteke in ne na glavni datoteki, zato obstaja ena različica, ki jo je mogoče kasneje odpreti in urediti v Illustratorju, druga pa je bolj primerna za prikazovanje na produkcijskem spletnem mestu.
- Slog : tega smo obravnavali že prej v nastavitvah metode 1, vendar sem tukaj izbral »Atributi predstavitve«, ker je to način za organiziranje lastnosti na atributih najvišje ravni. To dodaja red oznakam, fleksibilnost naše sposobnosti oblikovanja naslednjih atributov s CSS in pogosto vodi do manjših velikosti datotek.
- Pisava : To je še ena, ki smo jo obravnavali zgoraj, vendar izbira »Pretvori v orise« zamenja glife za vektorske poti za znake, kar zagotavlja pravilno upodabljanje besedila.
- Slike : To je še ena, ki smo jo obravnavali zgoraj, vendar izbira »Povezava« preprečuje, da bi bile vdelane rastrske slike zapakirane v SVG, zaradi česar je datoteka veliko večja.
- ID-ji predmetov : Ta nastavitev daje Illustratorju zaporedna navodila za poimenovanje ID-jev v oznakah. Lahko mu naročite, da poimenuje ID-je glede na poimenovanje slojev v datoteki.
- Decimalno : Manj decimalnih mest v kodi pomeni manjše velikosti datotek. Če to nastavite,
1
je v mnogih primerih idealno in v redu in ne bo imelo opazne razlike v zasnovi, vendar2
je običajno varno. Kakor koli že, vredno je preveriti, kako je upodobljen SVG. - Minify : Da, prosim! To drobi kodo, da zmanjša presledek in poveča spletno zmogljivost, podobno kot minificiranje CSS-ja.
- Odziven : Tako kot pri prvi metodi je izbira te možnosti idealna, ker bi bili fiksni
height
inwidth
atributi sicer nameščeni v SVG.