1 reden waarom je logo lelijk is

MSPaintInderdaad, er is meestal maar één reden waarom je mooie logo zo lelijk wordt weergegeven. Met name op smartphones en tablets of andere apparaten met een hogere pixeldichtheid lijkt je logo rechtstreeks uit Paint te komen... Zonde van het werk dat je vormgever er ingestoken heeft en absoluut niet nodig!

De oplossing heet SVG; een vectorbestand. In tegenstelling tot rasterbestanden als JPG, GIF en PNG kun je een SVG-bestand eindeloos vergroten zonder dat deze onscherp wordt.

SVG in de praktijk

SVG-bestanden hebben eigenlijk alleen maar voordelen ten opzichte van rasterbestanden. Het is alleen zo een Vectorbestand wel als vectorbestand getekend moet zijn. Dit geldt voor alle goed ontwikkelde logo's. Op Wikimedia vind je logo's van de meeste bekende merken en je vormgever kan meestal je logo zonder al te veel problemen als SVG-bestand aanleveren.

Foto's, screenshots en dergelijke zijn ontstaan als raster. Het is niet mogelijk deze "om te zetten" naar SVG's. Wel kan een grafisch vormgever de contouren omtrekken en zo een vectorbestand creëren op basis van een foto. In veel gevallen is dit echter alles behalve zinvol. Het is raadzaam om foto's in de juiste grootte als JPG- of PNG-bestand te gebruiken.

Waarom geen SVG?

Al in 2001 werd het gebruik van SVG aanbevolen door het W3C (internationale community voor webstandaarden). Toch bleef het gebruik lange tijd achter. Voornaamste reden was dat de meeste browsers het bestandtype niet ondersteunden. Sinds de komst van Internet Explorer 9 doen alle grote browsers dat wel. In Nederland wordt een SVG-bestand correct weergegeven voor 97.74% van de internetgebruikers (bron: CanIUse).

En nu?

Als je wilt weten of je logo een SVG-bestand is, kun je jouw site openen in een browser en bijvoorbeeld inzoomen tot 500%. Natuurlijk kun je ook in de broncode kijken. Dit doe je door op je rechtermuisknop te klikken en vervolgens selecteer je bijvoorbeeld "Element inspecteren" in Google Chrome of "Element controleren" in Internet Explorer.

Als blijkt dat je geen SVG-bestand gebruikt, kun je aan je vormgever vragen of hij je dit bestand wilt toesturen. Als je Joomla! of WordPress gebruikt moet je wel een kleine aanpassing maken om SVG-bestanden via de editor toe te voegen. Toevoegen via FTP en linken als url kan altijd.

Joomla! aanpassen

De meest gebruikte editor in Joomla! is JCE; deze kun je hier gratis downloaden. Om SVG bestanden direct in je editor te kunnen uploaden, moet je de volgende instellingen aanpassen:

  1. Ga naar "Componenten" en kies "JCE Editor"
  2. Ga naar "Editor profiles"
  3. Selecteer het juiste profiel (meestal "Default") 
  4. Klik op "Plugin parameters"
  5. Ga naar "File browser"
  6. Klik naast "Permitted File Extensions" op de icoon met papiertje en potlood
  7. Klik op "+ Add new type" in de kolom "Image"
  8. Typ in "svg" en klik op "Opslaan"

WordPress aanpassen

WordPress heeft een aantal plugins waardoor je svg-bestanden kunt accepteren. Scalable Vector Graphics (SVG) is de meest gebruikte.

Related Articles

Over de schrijver

Ramon Moor

Ramon Moor

Ramon heeft een voorliefde voor front-end design. En dan met name alles wat met Joomla! en WordPress te maken heeft.

Zijn achtergrond ligt echter in de marketing. Na zijn studie Commerciële Economie werkte hij in verschillende marketing- en salesfuncties voor hij besloot als zelfstandige verder te gaan.

Hij benadert projecten altijd vanuit een commercieel oogpunt en nooit vanuit de techniek. Hoe leuk hij die techniek ook vindt! 

  • Dit e-mailadres wordt beveiligd tegen spambots. JavaScript dient ingeschakeld te zijn om het te bekijken.

Plaats een reactie

U plaatst een reactie als gast U kunt hieronder inloggen

  • temati-grey
  • samira rafaela-grey
  • VTG-grey
  • Orthoklinika-grey
  • Ophetstrand-grey
  • Greenwhat-grey
  • Green-compliance-grey
  • Bui Loempia-grey
  • ADS-grey
  • 2Donkey-grey