Afbeeldingen en foto’s zijn een ideaal middel om de aandacht te trekken van je website bezoekers. Met de juiste afbeelding zorg je ervoor dat je boodschap veel beter en duidelijker overkomt. Maar wat is een goede en vooral juiste afbeelding? Waar hou je best rekening mee wanneer je een afbeelding klaarmaakt voor gebruik? In dit artikel geven we enkele tips voor afbeeldingen op jouw website of website.
Het juiste bestandsformaat kiezen
JPEG en PNG zijn de meest gebruikte bestandstypes voor online te plaatsen. Je ziet waarschijnlijk geen verschil tussen beide, maar toch is het van belang dat je het juiste formaat kiest in de juist omstandigheden.
JPEG is vooral geschikt voor afbeeldingen met veel kleine details en kleuren zoals foto’s. Om beelden optimaal weer te geven en bewaren wordt een compressie toegepast zodat het bestand zo klein mogelijk wordt. Bij elke complreesie zal er kwaliteitsverlies zijn. Het is dus belangrijk om dit verlies te minimaliseren door het juist formaat te kiezen.
PNG’s hebben een beperkte compressie, waardoor geen kwaliteit verloren gaat. Vooral lijnen en vlakken worden scherp weergegeven, wat optimaal is voor logo’s, illustraties en grafieken. Een PNG-bestand is daarom al snel vier keer groter is dan een JPEG-bestand.
Na het optimaliseren van jouw website of shop, controleer je best AL de afbeeldingen.
Afmeting en resolutie van een afbeelding
Elke afbeelding bestaat uit pixels. Een pixel is het kleinste deel van een scherm dat een bepaalde kleur kan aannemen. Met de huidige schermen zijn deze individuele pixels niet zichtbaar, ze vormen één groot beeld. Pixels hebben geen vaste grootte. De resolutie van het scherm waarop je een afbeelding bekijkt, bepaalt de grootte van dat beeld, daarom is het belangrijk om voldoende pixels te voorzien in elke afbeelding.
Beeldschermen met een zeer hoge resolutie (zoals retinaschermen) tonen meer pixels op een kleinere oppervlakte. Dat betekent dat dezelfde afbeelding op een retinascherm kleiner zal worden weergegeven dan op een gewoon scherm met lagere resolutie.
Bestandsgrootte
De combinatie van afmeting en resolutie zullen bepalend zijn voor de bestandsgrootte. Voor online media is het belangrijk om een goede balans te vinden tussen de afmetingen en de resolutie zonder aan kwaliteit van een afbeelding in te boeten. Enorm grote beelden laden traag en vertragen jouw website of webshop. Een website met een langere laadtijd is niet alleen vervelend voor bezoekers, maar zal zelfs leiden tot een lagere ranking in zoekmachines.
Steeds meer bezoekers gebruiken een mobiel toestel, waardoor snelheid 1 van de belangrijkste factoren is voor deze doelgroep.
Verhoudingen en stijl
Afbeeldingen zijn een belangrijk deel van het design en bepalen de sfeer en stijl van jouw website. Door alle afbeeldingen in dezelfde verhoudingen te plaatsen, creëer je een strak lay-out en heeft een bezoeker het gevoel dat alles een samenhangend geheel vormt.
De belangrijkste verhoudingen zijn:
- 16:9 voor grote afbeeldingen en headers
- 4:3 voor producten
- 1:1 voor Instagram
Bij wekreate bepalen we deze verhoudingen tijdens het opstellen van het wireframe voor jouw website. Door deze informatie in een duidelijk overzicht te gieten, kunnen wij en onze klanten er rekening mee houden bij het maken, kiezen en optimaliseren van de afbeeldingen.
Hou rekening met SEO
Geef je afbeeldingen ALTIJD een duidelijke (bestands)naam. Zo kan je de juiste afbeelding snel terugvinden in de mediamanager. Geef ook zoekmachines makkelijk toegang tot visuele elementen door een alt tag toe te voegen aan elke afbeelding. In deze tag beschrijf je kort en duidelijk wat er op het beeld te zien is.
Tips in het kort
- JPEG voor foto’s
- PNG voor logo’s, grafieken en/of illustraties.
- Zorg voor voldoende grote afbeeldingen, zonder te overdrijven.
- Wees consequent en gebruik vaste verhoudingen en dezelfde stijl.