SVG för webbdesigners på 60 sekunder

Bitmappsbilder som JPEG, GIF och PNG ser alla hemska ut när du skala dem upp, så om du vill behålla kvalitet vid stora dimensioner måste du öka filstorleken. SVG-bilder men (som står för skalbar vektorgrafik) ser exakt ut, oavsett vilka dimensioner de är skalade till och De har samma filstorlek. 

Låt oss titta på SVGs för webbdesign på sextio sekunder!

Förstå SVG för webbdesign

 

SVG kan användas med CSS som bakgrund, eller du kan placera dem i innehåll som vanliga bilder. Du kan skapa ikoner och logotyper som alltid ser perfekt ut i vilken storlek som helst, de kan animeras och morphed, och du kan använda svala filter och effekter på dem (kolla in SVG-filterdemoen av Lucas Bebber nedan). Du kan även kontrollera sin färgning med CSS.

På insidan är en SVG-fil bara läsbar, redigerbar XML-kod. Och text inom SVG är normalt, indexerbar, sökmotorvänlig text.

Du kan skapa SVG-filer med praktiskt taget alla vektorgrafikredigeringsprogram, som Affinity Designer, Boxy SVG, Illustrator, Gravit Designer eller Inkscape. Skapa bara din bild, exportera den som SVG, och den är redo att användas på dina webbplatser. Det är SVG för webbdesign, på sextio sekunder!

Mer användbara SVG Resources