Wat is SVG?
SVG is een beeldformaat dat vormen wiskundig beschrijft in plaats van als raster van pixels. Een cirkel is een instructie, geen verzameling puntjes.
Daardoor blijft het op elk formaat scherp.
En het bestand is meestal veel kleiner.
Waar het geschikt voor is
Logo’s, pictogrammen, illustraties en grafieken. Alles met vlakken en lijnen.
Meer daarover lees je bij wanneer je SVG gebruikt.
Waar het niet voor is
Foto’s. Die bestaan uit miljoenen kleurpuntjes en laten zich niet als vormen beschrijven.
Meer daarover lees je bij pixel.
Wat het bijzonder maakt
Het bestand is tekst. Je kunt het openen in een teksteditor en de kleuren aanpassen zonder een ontwerpprogramma.
Meer daarover lees je bij favicon.
Mijn vuistregels
- Logo’s en pictogrammen als SVG.
- Foto’s als jpeg of een modern formaat.
- Ruim je bestand op voor gebruik.
- Geef ook een SVG een alternatieve tekst.
Die derde scheelt vaak de helft aan bestandsgrootte.
Hoe scherp het is
Oneindig. Je kunt een SVG tot billboardformaat vergroten zonder één pixel verlies.
Meer daarover lees je bij retina.
Wat het weegt
Een eenvoudig pictogram een paar honderd bytes, een logo enkele kilobytes. Een fractie van dezelfde afbeelding als png.
Meer daarover lees je bij of SVG goed is voor je laadtijd.
Wat ik in de praktijk zie misgaan
Het meest voorkomende geval is een logo dat als foto op de site staat.
Dat valt op een gewone laptop nauwelijks op, maar op een telefoon of een scherm met hoge resolutie wordt het zichtbaar wazig. Juist het logo, het onderdeel waar een bedrijf het meeste aan hecht, is dan het slechtst weergegeven element van de hele pagina.
De oorzaak is bijna altijd dat de drukker ooit een bestand heeft aangeleverd en dat iemand daar een schermafbeelding van heeft gemaakt.
Wat ik doe is het originele tekenbestand bij de ontwerper opvragen en daaruit een webversie maken. Dat kost een half uur, het weegt vaak minder dan een kilobyte, en het blijft op elk formaat scherp.
Hetzelfde geldt voor pictogrammen en eenvoudige plattegronden. Als vuistregel: kun je het natekenen, dan hoort het niet als foto op je site te staan.
Meer daarover lees je bij vectorafbeelding.