Om te beginnen is SVG een afkorting voor Scalable Vector Graphics. Het is een beeldformaat voor vectorafbeeldingen dat wordt ondersteund in alle moderne webbrowsers. SVG’s worden gedefineerd in XML, een taal die menselijk leesbaar en zoekmachinevriendelijk is. Hierdoor kunnen ze gemakkelijk worden gemaakt en bewerkt met elke teksteditor.
Inhoudsopgave
Vectorafbeeldingen en de voordelen van SVG
In tegenstelling tot rasterafbeeldingen, die zijn opgebouwd uit een raster van pixels, zijn vectorafbeeldingen gebaseerd op wiskundige formules. Deze formules stellen lijnen en vormen voor, waardoor ze in tegenstelling tot pixelgebaseerde afbeeldingen niet worden vervormd of wazig worden als ze worden vergroot of verkleind.
SVG-bestanden zijn daardoor uitzonderlijk geschikt voor logo’s, iconen, infographics en elke afbeelding die op verschillende formaten moet kunnen worden weergegeven zonder aan kwaliteit in te boeten. Bovendien zijn SVG-bestanden doorgaans kleiner dan hun pixelgebaseerde tegenhangers, wat ze ideaal maakt voor gebruik op het web, waar laadtijd van cruciaal belang is.
SVG’s en rasterafbeeldingen
Hoewel SVG’s voornamelijk zijn bedoeld voor vectorafbeeldingen, kunnen ze ook rasterafbeeldingen bevatten. Dit kan echter problemen opleveren. Omdat SVG’s in essentie tekstbestanden zijn, kunnen ze exponentieel groeien in grootte wanneer ze rasterafbeeldingen bevatten.
Bovendien kunnen sommige platformen en diensten die SVG ondersteunen, problemen hebben met het correct weergeven van de ingesloten rasterafbeeldingen. Om deze redenen is het meestal beter om rasterafbeeldingen als afzonderlijke bestanden te houden en ze niet in SVG’s in te sluiten.
De flexibiliteit van SVG: tekst en lettertypes
Een van de vele voordelen van SVG’s is hun flexibiliteit met betrekking tot tekst. SVG’s kunnen tekst bevatten als onderdeel van de vectorafbeelding. Deze tekst is selecteerbaar en doorzoekbaar, net als de tekst op een webpagina, wat een extra voordeel kan zijn voor zoekmachine optimalisatie (SEO).
Bij het opnemen van tekst in een SVG, kunnen de makers kiezen om het lettertype te refereren of om de letters zelf als vectoren op te nemen. Door naar een lettertype te verwijzen, kan de grootte van de SVG worden beperkt. Echter, als de gebruiker het lettertype niet op zijn systeem heeft geïnstalleerd, zal de tekst niet correct worden weergegeven.
Door letters als vectoren op te nemen, kan worden gegarandeerd dat de tekst altijd correct wordt weergegeven, ongeacht de lettertypen die op het systeem van de gebruiker zijn geïnstalleerd. Het nadeel is dat dit de grootte van de SVG kan vergroten.
Lees meer: Inzetten van SVG’s in een webpagina.
Ik moest snel een SVG omzetten van kleur naar grijswaarden en het online hulpmiddel dat echt werkte was De-editor.
Deeditor: Online SVG-kleuren bewerken was nog nooit zo eenvoudig, snel en krachtig!