Tas ir mazāk fragments un vairāk atgādinājums par kaut ko, ko es bieži meklēju. Veidojot SVG failus programmā Adobe Illustrator, failu eksportēšanai ir vairākas dažādas metodes. Abās metodēs ietilpst dažas iespējas, no kurām dažas es pilnīgi aizmirstu, ko tās nozīmē un ko izvēlēties.
1. metode: saglabāt kā…
Jūs, iespējams, neizmantosit šo metodi, lai saglabātu SVG lietošanai tīmeklī. Tas galvenokārt paredzēts pamatdokumenta saglabāšanai. Patiesībā jūs varētu vienkārši saglabāt tieši Illustrator formātā. Lai eksportētu tīmeklī, izmantojiet dažas citas eksportēšanas iespējas.
Visizplatītākais veids, kā saglabāt failu kā SVG programmā Adobe Illustrator, ir File > Save As…
opcijas izvēle galvenajā izvēlnē.
Illustrator aktivizēs dialoglodziņu ar jautājumu, kā nosaukt failu un kur to saglabāt. Vēl svarīgāk ir tas, ka tiek arī jautāts, kāda veida failu saglabāt kā kādu, šajā gadījumā tas ir SVG. Nav SVG saspiests (svgz). Plain ol 'SVG.
Noklikšķiniet uz pogas Saglabāt, un tiks parādīta cita opciju kopa. Šeit atmiņa mēdz mani pievilt, un man ir jāmeklē atbildes tīmeklī. Šeit ir pilnīgi optimāla SVG faila saglabāšanas Adobe Illustrator ekrānuzņēmums.


- SVG profili : Sākuma
tagā tiek iestatīts XML dokumenta tips . SVG 1.1 ir jaunākā versija, kas aptver visplašāko atbalstu un, iespējams, ir vispiemērotākā iespēja. Viss pārējais ir vai nu vecāka versija, vai SVG 1.1 apakškopa, un man vēl ir jāsaskaras ar problēmu, to atlasot.
- Fonti> Tips : Atlasot “Konvertēt uz kontūru”, tiks nodrošināts, ka jebkurš failā ierakstītais teksts tiek eksportēts uz vektora ceļiem, nevis uz glifiem. Glifēm ir iespēja netikt atveidotām, taču vektoru ceļi vienmēr ir liels īkšķis.
- Opcijas> Attēla atrašanās vieta : ja failā tiek izmantoti rastra attēli (lasīt: JPG.webp, PNG, GIF), mēs vēlamies izvēlēties opciju “Saite”. Pretējā gadījumā rastra attēls tiks iegults failā, un tas izsūc veiktspējas priekšrocības tieši no SVG, palielinot faila lielumu, iekļaujot šos papildu līdzekļus. Labāk atsaucieties uz tām kā saitēm un noteikti iekļaujiet šos avota failus tajā pašā direktorijā, kurā atrodas SVG fails.
- Opcijas> Attēla atrašanās vieta> Saglabāt Illustrator rediģēšanas iespējas : Tam ir liela ietekme uz SVG faila izvadi. Tā kā jūs, iespējams, šeit saglabājat galveno kopiju, kas nav paredzēta mums tīmeklī, atstājiet šo izvēles rūtiņu. Tas saglabās Illustrator patentētās lietas (piemēram, ceļvežus) nākamajai faila atvēršanas reizei. Nepārbaudīts nozīmē, ka tādas lietas tiks atņemtas un pazaudētas.
- Papildu opcijas> CSS rekvizīti : Es šai opcijai izvēlos “Prezentācijas atribūti”, jo tā īpašības (piemēram, aizpildījumus, insultus un tamlīdzīgus) novieto zemākajā specifiskuma līmenī. Piemēram
. Tas stila elementu, bet CSS to ir ļoti viegli ignorēt.
- Papildu opcijas> Decimāldaļas : ja esat pārlūkojis kodu a
, tad zināt, ka vērtības, kas norāda šīs formas, var būt ļoti precīzas. Daudzas reizes tie tomēr ir pārāk precīzi un papildina SVG faila kopējo lielumu. Tā kā jūs, iespējams, šeit saglabājat galveno failu, varat to saglabāt diezgan augstu, jo faila lielums neuztraucas.
- Papildu opcijas> Kodēšana : es neesmu UTF kodēšanas cienītājs, taču, atstājot to sadaļā “Unicode UTF-8”, tiek nodrošināta savietojamība atpakaļ. Arī UTF-8 failu izmēri parasti ir mazāki nekā UTF-16, tāpēc tas pats par sevi ir ieguvums.
- Papildu opcijas> Atsaucīgs : atstājot šo izvēles rūtiņu, SVG tiks iestatīti fiksētie
height
unwidth
atribūti. Es pārbaudu šo opciju, jo tas ļauj man iestatīt šos atribūtus vai nu kodā, vai CSS.
2. metode: eksportēt kā
Vēl viens veids, kā iegūt SVG no Adobe Illustrator, ir izvēlēties File > Export > Export As…
opciju galvenajā izvēlnē. Tomēr ir vēl viens veids, kā tur nokļūt, izmantojot Illustrator darbvietas paneli Darbības.
Šī opcija ir ideāla, ja jūs zināt, ka izmantosit šo failu tieši tīmeklī un neplānojat vēlāk veidot dizainu. Tas nodrošina daudz mazāk iestatījumu un pāris iespējas, kas ļauj failam optimizēt failu vēl labākai veiktspējai. Faktiski labāk ir to izdarīt faila kopijā, nevis pašā galvenajā failā, tāpēc ir viena versija, kuru vēlāk var atvērt un rediģēt Illustrator, un otra, kas ir vairāk piemērota kalpošanai produkcijas vietnē.


- Stils : mēs to iepriekš aprakstījām 1. metodes iestatījumos, bet es šeit izvēlos “Prezentācijas atribūti”, jo tas ir veids, kā organizēt rekvizītus augstākā līmeņa atribūtos. Tas palielina marķēšanas kārtību, elastību mūsu spējā veidot nākamos atribūtus ar CSS, un bieži vien tiek samazināti failu izmēri.
- Fonts : Šis ir vēl viens, par ko mēs iepriekš runājām, taču, izvēloties “Konvertēt uz kontūrām”, zīmju vektoru ceļi tiek apmainīti ar simboliem, kas nodrošina pareizu teksta renderēšanu.
- Attēli : Šis ir vēl viens attēls, kuru mēs aplūkojām iepriekš, taču, izvēloties “Saite”, iebūvētie rastra attēli netiks iesaiņoti SVG, kas padarīs failu daudz lielāku.
- Objekta ID : Šis iestatījums dod Illustrator maršēšanas rīkojumus, kā marķējumā nosaukt ID. Varat pateikt, lai nosauktu ID, pamatojoties uz to, kā slāņi tiek nosaukti failā.
- Decimāldaļa : mazāk kodā aiz komata nozīmē mazāku faila izmēru. Tā iestatīšana
1
ir ideāla un daudzos gadījumos labi, un tai nebūs ievērojamu atšķirību dizainā, taču2
tā parasti ir droša. Katrā ziņā ir vērts pārbaudīt, kā tiek parādīts SVG. - Samazināt : jā, lūdzu! Tas samazina kodu, lai samazinātu atstarpi un palielinātu tīmekļa veiktspēju līdzīgi kā CSS samazināšana.
- Reaģējošs : tieši tāpat kā pirmā metode, šīs opcijas izvēle ir ideāla, jo fiksētie
height
unwidth
atribūti citādi tiktu ievietoti SVG.