Traditionele afbeeldingsindelingen zoals JPG, PNG of GIF zijn erg populair, maar ze hebben nadelen waardoor hun gebruik minder dan ideaal is voor bepaalde toepassingen.
Als u bijvoorbeeld een responsieve website maakt, wilt u afbeeldingen die er goed uitzien, ongeacht de breedte en hoogte waarin ze worden weergegeven. Traditionele afbeeldingen zien er slecht uit als u ze bijvoorbeeld te veel vergroot.
Mogelijk moet u de afbeelding ook in verschillende formaten weergeven, bijvoorbeeld als een miniatuur op de indexpagina van een blog en als afbeelding met volledige resolutie in het gekoppelde artikel.
Hoewel u verschillende versies van een enkele afbeelding kunt maken, zodat de meest geschikte afbeelding wordt gekozen, betekent dit dat u daarvoor meer opslagruimte nodig hebt.
Het SVG-beeldformaat is een vectorformaat. Dit betekent dat de grootte kan worden verkleind of vergroot zonder kwaliteitsverlies (schaalbaar). Dat is geweldig als u de afbeelding op verschillende plaatsen met verschillende resoluties moet weergeven.
Andere voordelen van de SVG zijn dat de grootte meestal veel kleiner is en dat het webmasters enige flexibiliteit biedt als het gaat om het aanbrengen van wijzigingen, zoals sommige rechtstreeks in CSS kunnen worden gedaan.
Een voorbeeld: Terence Eden herschepte de logo's van populaire internetbedrijven zoals Twitter, Amazon, WhatsApp, YouTube of Reddit in SVG. De grootte van de logo's was teruggebracht tot minder dan 1 kilobyte, soms tot 200 bytes. Het Twitter-logo in PNG-formaat heeft bijvoorbeeld een grootte van 20 Kilobytes, de SVG-versie een grootte van 397 bytes.
SVG is een goed formaat voor logo's en pictogrammen, maar niet echt geschikt als het gaat om foto's en andere soorten afbeeldingen met veel verschillende objecten.
Converteren naar SVG
Deze gids concentreert zich op toepassingen die u kunt gebruiken om afbeeldingen rechtstreeks naar SVG te converteren. Dit is geen tutorial over het gebruik van applicaties die zijn ontworpen om helemaal opnieuw vectorafbeeldingen te maken. U kunt hiervoor vectorafbeeldingen-editors gebruiken, zoals Adobe Illustrator (onze links naar Adobe-beleid staan nog steeds niet), Inkscape of LibreOffice Draw.
Er zijn veel gratis converters beschikbaar die u online kunt uitvoeren, maar deze zijn vrij beperkt als het gaat om het conversieproces. Hoewel ze voldoende kunnen zijn voor het converteren van een eenvoudig logo dat beschikbaar is als png of jpg naar svg, zijn de resultaten meestal niet supergoed.
Hier is hoe ik de services evalueerde: ik downloadde het Ghacks-logo en probeerde de conversies op enkele tientallen SVG-converters. Ik beoordeelde het resultaat en verwierp elke service die geen goede resultaten opleverde.
- Aconvert - De service neemt een lokaal bestand of een URL als invoer. De enige optie die het biedt, is de resolutie van de afbeelding te wijzigen. De resulterende afbeelding leek op het Ghacks-logo, maar de grootte was bijna het dubbele van de PNG-versie van het logo.
- Vector Magic - Beschikbaar als een online converter en desktopprogramma voor Windows. Het is echter niet gratis (online kost $ 7, 95 per maand, desktopversie een eenmalige betaling van $ 295). De resultaten van de online editie zijn echter geweldig, en je krijgt veel opties om instellingen te bewerken of te wijzigen, en een weergave naast elkaar van de originele afbeelding en de svg-kopie.
- Vectorizer - Nog een gratis service. Deze wordt geleverd met een wizard waarmee u de beste uitvoerparameters (vervaging, kleuren) kunt kiezen, of u kunt deze rechtstreeks instellen. De resultaten waren goed met enkele aanpassingen, en de grootte van de resulterende afbeelding was een derde minder dan het originele PNG-logo.
Nu: weet u nog een andere online service of programma om afbeeldingen naar SVG-formaat te converteren?
