Eksporter vektorgrafikken i Inkscape til weben

I denne opplæringen vil jeg vise deg hvordan du kan lagre din opprettede vektorgrafikk i Scalable Vector Graphics (SVG) format. SVG-filer er spesielt egnet for bruk på internett, da de krever lite lagringsplass og kan skaleres i hvilken som helst størrelse uten å miste kvalitet. Uansett om det er din bedriftslogo, et ikon eller en tegning - etter at du har opprettet vektorgrafikken din i Inkscape, vil jeg guide deg gjennom lagringsprosessen slik at du kan optimalisere verkene dine for webbruk.

Viktigste funn

• SVG-filer tilbyr høy skaleringsevne og lav filstørrelse.
• Inkscape lagrer vektorgrafikk i SVG-format, som inneholder spesiell informasjon om lag og hjelpelinjer.
• Det finnes ulike SVG-typer: det native Inkscape SVG og optimaliserte SVG-er som egner seg bedre for web.

Trinn-for-trinn-veiledning

For å lagre vektorgrafikken din i SVG-format, følg disse trinnene:

Først må du forsikre deg om at designet ditt er ferdig i Inkscape. Hvis det er tilfelle, klikk på Fil i den øvre menylinjen.

I rullegardinmenyen velger du deretter alternativet Lagre som. Dette åpner et nytt vindu der du kan velge lagringssted og filtype.

Som standard lagrer Inkscape i sitt eget SVG-format, som inneholder informasjon om lagene og strukturen i designet ditt. For webbruk er det imidlertid bedre å bruke en optimalisert variant. Finn lagringsstedet på harddisken hvor du ønsker å lagre filen.

Velg enten vanlig SVG eller optimalisert SVG i rullegardinmenyen for filtype. For første forsøk, velg vanlig SVG.

Gi filen et navn, for eksempel Logo_normal, og bekreft med Lagre. Denne filen er nå lagret i vanlig SVG-format.

Du vil se at denne filen vanligvis er mindre enn Inkscape SVG, som kan være cirka 11 KB stor. Den vanlige SVG-en kan bare være 6 KB stor, noe som allerede krever betydelig mindre lagringskapasitet.

Gjenta nå prosessen ved å klikke på Fil igjen og deretter Lagre som, men velg denne gangen optimalisert SVG.

Gi for eksempel filen navnet Logo_optimiert og lagre den. Du vil bli bedt om noen alternativer. Her kan du konvertere CSS-attributter til XML-attributter og gjøre ulike optimaliseringer. Jeg anbefaler å velge alternativene som passer deg best.

Bekreft valget ditt og sjekk den nye filstørrelsen. Ofte vil den optimaliserte varianten være bare 4 KB stor. Dette viser at denne metoden ytterligere har komprimert filen.

Hvis du åpner filene i nettleseren nå, vil du legge merke til at både den vanlige og optimerte SVG ser identiske ut. Skriv inn filenes URL-er i nettleserens adressefelt for å sjekke resultatet.

For å teste skaleringsevnen deres, kan du justere zoomnivået i nettleseren. For eksempel, hvis du zoome til 50% eller helt opp til 300%, vil du merke at kantene forblir skarpe uavhengig av zoomnivået.

Disse egenskapene til SVG-filer gjør dem egnet for bruk på nettsteder. Du kan være sikker på at logoen din vises klart og tydelig på alle enheter, uansett hvor stor du viser den.

Ved å bruke svg-format for grafikkene dine, reduserer du ikke bare filstørrelsen, men sikrer også at kvaliteten på designene dine forblir den samme i enhver oppløsning.

Oppsummering

I denne opplæringen har du lært hvordan du kan lagre vektorgrafikken din i SVG-format. Dette lar deg effektivt bruke designene dine på nettet og gir fordelen av skalering og lav filstørrelse.