Tradisjonelle bildeformater som JPG, PNG eller GIF er veldig populære, men de har ulemper som gjør bruken mindre enn ideell for visse applikasjoner.
Hvis du for eksempel oppretter et responsivt nettsted, vil du ha bilder som ser bra ut uansett bredde og høyde de vises i. Tradisjonelle bilder ser dårlige ut når du forstørrer dem for mye for eksempel.
Det kan hende du må vise bildet i forskjellige størrelser, for eksempel som et miniatyrbilde på en bloggs indeksside, og som et fulloppløsningsbilde i den koblede artikkelen.
Selv om du kan lage forskjellige versjoner av et enkelt bilde slik at det velges den mest passende, betyr det at du blant annet trenger mer lagringsplass for det.
SVG-bildeformatet er et vektorformat. Dette betyr at størrelsen kan reduseres eller økes uten tap av kvalitet (skalerbar). Det er flott hvis du trenger å vise bildet flere steder ved å bruke forskjellige oppløsninger.
Andre fordeler med SVG er at størrelsen vanligvis er mye mindre, og at den gir webansvarlige litt fleksibilitet når det gjelder å gjøre endringer i den, da noen kan gjøres direkte i CSS.
Et eksempel: Terence Eden gjenskapt logoene til populære internettbedrifter som Twitter, Amazon, WhatsApp, YouTube eller Reddit i SVG. Størrelsen på logoene ble redusert til under 1 kilobyte, noen ganger så lave som 200 byte. Twitter-logoen i PNG-format har for eksempel en størrelse på 20 kilobyte, SVG-versjonen en størrelse på 397 byte.
SVG er et godt format for logoer og ikoner, men egner seg egentlig ikke når det kommer til bilder og andre typer bilder som viser mange forskjellige objekter.
Konvertering til SVG
Denne guiden konsentrerer seg om applikasjoner du kan bruke til å konvertere bilder til SVG direkte. Dette er ikke en veiledning for bruk av applikasjoner designet for å lage vektorgrafikk fra bunnen av. Du kan bruke vektorgrafikkredigerere som Adobe Illustrator (våre lenker til Adobe-policyen fremdeles ikke), Inkscape eller LibreOffice Draw for det.
Det er mange gratis konvertere som du kan kjøre på nettet, men de er ganske begrensede når det gjelder konverteringsprosessen. Selv om de kan være tilstrekkelige for å konvertere en enkel logo som er tilgjengelig som png eller jpg til svg, er resultatene ikke super gode for det meste.
Slik evaluerte jeg tjenestene: Jeg lastet ned Ghacks-logoen og prøvde konverteringene på flere dusin SVG-omformere. Jeg bedømte resultatet, og kastet enhver tjeneste som ikke ga gode resultater.
- Aconvert - Tjenesten tar en lokal fil eller en URL som input. Det eneste alternativet det gir er å endre oppløsningen på bildet. Det resulterende bildet så ut som Ghacks-logoen, men størrelsen var nesten dobbelt så stor som PNG-versjonen av logoen.
- Vector Magic - tilgjengelig som en online konverter og desktop-program for Windows. Det er imidlertid ikke gratis (online koster $ 7, 95 per måned, desktop-utgaven en engangsbetaling på $ 295). Resultatene av onlineutgaven er imidlertid gode, og du får mange muligheter for å redigere eller endre innstillinger, og en side om side-visning av det originale bildet og svg-kopien.
- Vectorizer - En annen gratis tjeneste. Denne kommer med en veiviser som du kan velge de beste outputparametrene (uskarphet, farger), eller du kan angi disse direkte. Resultatene var gode med noen finjusteringer, og størrelsen på det resulterende bildet var en tredjedel mindre enn den originale PNG-logoen.
Nå du: Vet du om en annen online tjeneste eller program for å konvertere bilder til SVG-format?
