Om je afbeeldingen netjes op een pagina te krijgen, moet je rekening houden met enkele basisbegrippen.

Basisbegrippen afbeeldingen en illustraties

  • Beeldverhouding
    De verhouding tussen de hoogte en breedte van je scherm. De meeste schermen zijn 16:9 of 4:3. Je afbeeldingen in Divi ook.
  • Bestandsgrootte
    Het gewicht van een foto, uitgedrukt in kilobytes (Kb) of megabytes (Mb). Een afbeelding met een bepaalde hoogte en breedte weegt een bepaald aantal Kb.
  • Pixel
    Een digitale afbeelding wordt ‘gemaakt’ door een hoeveelheid stippen, ookwel beeldpunten of pixels genoemd. Een pixel is een punt in een bepaalde kleur. Alle pixels bij elkaar en je ziet je afbeelding.
    Hoe groter de dichtheid van de pixels, hoe scherper de afbeelding.
  • Resolutie
    Resolutie verwijst naar de details in een afbeelding. Het wordt uitgedrukt in dpi (dots per inch, aantal stippen per inch), of beter ppi: aantal pixels per inch. Hoe meer pixels er in een inch zitten, hoe hoger de resolutie. En, meestal, hoe meer resolutie hoe scherper het beeld, en hoe zwaarder de afbeelding. Verander je de resolutie, dan wijzigen ook de breedte en de hoogte van de afbeelding
  • Beeldafmetingen
    Een afbeelding heeft een hoogte en en een breedte. Die wordt meestal ook in pixels uitgedrukt. Een afbeelding kan bijvoorbeeld de afmetingen 800x600px hebben bij een resolutie van 72ppi.

Bestandsformaten

Vervolgens is het belangrijk iets te weten over de bestandsformaten. Een afbeelding of illustratie kan in een eigen formaat zijn gemaakt. De meest bekende bestandsformaten zijn:

  • JPG of JPEG
    Staat voor ‘Joint Photographic Experts Group’.
    Dit is een gecomprimeerd formaat, geschikt voor kleurenfoto’s en achtergrondfoto’s. Als 300ppi vaak nog wel geschikt voor drukwerk, en als 72ppi vaak gebruikt op websites.
  • GIF
    Staat voor Graphics Interchange Format
    Formaat dat vaak wordt gebruikt voor logo’s, animaties of lijntekeningen, maar niet voor foto’s op websites. GIF-afbeeldingen hebben maximaal 256 kleuren en kennen geen dataverlies. Een enkele keer kun je een GIF voor kleine foto’s met beperkte kleuren gebruiken.
  • PNG
    Staat voor Portable Network Graphic
    Verbeterde versie van de GIF, die je kunt gebruiken voor afbeeldingen met veel kleuren, een transparantie of afbeeldingen waarbij de grootte geen issue is. PNG gebruik je vooral online, maar niet voor drukwerk. PNG’s zijn ideaal voor kleinere afbeeldingen met veel details. PNG ondersteunt transparantie, zodat je dit bestandsformaat ook kunt gebruiken voor logo’s of grafische elementen.

 

Eerst je afbeelding optimaliseren, dan pas uploaden!

Hoewel WordPress de mogelijkheid heeft om afbeeldingen te bewerken, is het altijd het beste om je afbeeldingen te verkleinen, comprimeren, bijsnijden of wat dan ook voordat je ze naar je website uploadt. Waarom? Simpel: WordPress is geen fotobewerkingsprogramma. Om je afbeeldingen te bewerken, kun je het beste Photoshop gebruiken, of – als je dat te duur vindt – GIMP of Pixlr https://pixlr.com/ of exPhoto http://www.ne.jp/asahi/mighty/knight/exphoto.html

Probeer ook om alle afbeeldingsformaten maximaal 250-300 Kb groot te houden. Dan blijft je website lekker snel.

Contact opnemen

Meer weten? Neem contact op met Eric van den Berg. Graag maak ik kennis met jou om een succesvolle communicatie-aanpak voor jouw organisatie te bespreken.

Particuliere vragen beantwoorden we niet.

Bel of app tijdens kantoortijden 06-34009124, mail naar hallo@isimedia.nl of ga door naar het contactformulier.