Ben je fotograaf? Volg 28 juni onze webinar 'SEO voor fotografen'. Schrijf je in!

Je gebruikt Internet Explorer. Deze website ondersteunt alleen moderne browsers. Gebruik alsjeblieft Chrome, Firefox, Safari of Edge.

Menu

Afbeeldingen op je website: Do’s en don’ts (4 tips)

Foto’s en illustraties kunnen een website veel kracht bijzetten. Maar ze kunnen jouw website ook flink vertragen als je ze niet eerst verkleint. Ik deel graag mijn do’s en don’ts voor werken met afbeeldingen op websites.

Inhoud

  1. Verklein de bestandsgrootte voordat je ze uploadt
  2. Geef de afbeelding een veelzeggende bestandsnaam
  3. Geef de afbeelding een beschrijvende alt-tekst mee
  4. Kies relevante afbeeldingen

Verklein de bestandsgrootte van afbeeldingen voordat je ze uploadt

Misschien heb je professionele foto’s laten maken of heb je ze als stockfoto gedownload, hoe dan ook, de originele bestanden zijn meestal gigantisch.

Een foto van 7000 pixels breedte, opgeslagen in maximale kwaliteit, kan al snel 20 MB zijn. Deze afmetingen en kwaliteit heb je zeker nodig als je de foto’s wilt laten afdrukken, maar niet voor een website.

Ik probeer altijd minimaal onder de 0,5 MB te blijven per foto. Waarom? Hoe zwaarder een bestand op jouw webpagina, hoe langzamer de pagina laadt. Als jouw pagina 8 foto’s van 20 MB heeft, zal het traag als een slak worden.

Je wilt de bestandsgrootte van afbeeldingen zo laag mogelijk houden zonder dat de kwaliteit eronder gaat lijden.

Afbeeldingen verkleinen in 3 stappen

  1. Verklein de afmetingen:
    Hoe klein? Ik verklein mijn liggende foto’s altijd tot 2500 pixels breedte, en mijn staande foto’s tot 2500 hoogte. Groter zul je doorgaans niet nodig hebben.
  2. Sla op als JPG bestand:
    Afbeeldingen worden meestal opgeslagen als JPG, PNG of GIF. Voor foto’s geeft JPG de kleinste bestandsgrootte. GIF is voor bewegend beeld en PNG voor illustraties met transparante achtergrond. Niet nodig? Sla op als JPG.
  3. Sla op in 30-80% kwaliteit:
    JPG kun je opslaan in lagere kwaliteit, bijvoorbeeld 40% in plaats van 100%. Dit maakt de bestandsgrootte een stuk kleiner, terwijl ons blote oog geen of nauwelijks verschil ziet in kwaliteit.

“Ja, maar ik heb geen Photoshop…”

Heb je geen beeldprogramma waarmee je zelf de bovenstaande stappen kunt zetten? Je kunt ook een website zoals Birme gebruiken. Upload jouw foto’s, kies 2500 pixels breedte met auto-height plus bijvoorbeeld 40% JPEG kwaliteit.

Afbeeldingen verkleinen met Birme.net

Voorbeeld

Laten een voorbeeld pakken. De onderstaande foto was origineel 17,3 MB met afmetingen van 6680 x 4458 pixels. Verkleind tot 2500 x 1668 pixels is de foto “slechts” 2,7 MB. En opgeslagen met 40% kwaliteit is het nog maar 0,3 MB.

Een verschil van 17 MB!

GrootteAfmetingenKwaliteit
17,3 MB6680 x 4458 pixels100% JPG
2,7 MB2500 x 1668 pixels100% JPG
0,3 MB2500 x 1668 pixels40% JPG
Deze foto is opgeslagen met 40% kwaliteit om de bestandsgrootte klein te houden.

Geef een veelzeggende bestandsnaam

Wil je zoekmachines zoals Google aanwijzingen geven over wat er op jouw foto afgebeeld staat? Geef hints in de bestandsnaam. Zo zegt zijden-trouwjurk-maggie-sottero.jpg meer dan foto203941.jpg.

Je hoeft niet per se super specifiek te zijn, gebruik een aantal steekwoorden.

Bij een foto van mezelf doe ik altijd mijn naam plus bedrijfsnaam, dus “linsey-van-brander-en-brander.jpg”.

Als je een lading foto’s hebt, bijvoorbeeld een reportage, kun je ook alleen het overkoepelende onderwerp benoemen, zoals: “perzische-bruiloft-in-parijs-001.jpg”, “…-002.jpg”, “…-003.jpg” enzovoorts.

Geef een beschrijvende alt-tekst

Je kunt ook een korte beschrijving meegeven aan jouw afbeelding. Deze alternatieve tekst (afgekort alt-tekst) is onzichtbaar voor mensen, maar wordt gebruikt door Google en screenreaders om jouw afbeelding te begrijpen.

Een alt-tekst helpt machines afbeeldingen te “zien”.

Je hoeft afbeeldingen niet per se een alt-tekst te geven, maar het is wel een goede gewoonte om te hebben. Wees niet te lang, beschrijf in een paar woorden of korte zin wat er op de foto of illustratie afgebeeld staat.

Lees verder: Uitleg van Google over alt-teksten met voorbeelden

Kies relevante foto’s

Het liefst gaat de afbeelding direct over het onderwerp van de pagina. Dit helpt de bezoeker sneller inschatten waarover de pagina gaat.

Soms zijn foto’s vooral decoratief. Zoals bijvoorbeeld de foto bovenaan dit artikel. Let er dan op dat de foto niet clasht met het onderwerp. Een foto van een hond op een pagina over appeltaart schept alleen maar verwarring (“Ben ik wel op de goede pagina? Is het een taart voor honden?”).

En wil je met jouw foto hoog in Google Images komen? Dan moet het helemaal goed aansluiten op de tekst! Google kijkt tijdens het rangschikken ook naar de content omdat ze willen dat jouw pagina bezoekers die op jouw foto klikken verder helpt. Een willekeurige foto of een foto op een lege pagina zal niet hoog ranken.

Lees verder: Hoger in Google Afbeeldingen ranken

PS: Ben jij ondernemer en wil je meer weten over het slim inrichten van jouw website? Dan is onze Website Strategy Academy misschien iets voor jou. In deze videocursus leer je meer klanten trekken met je website.

Home » Blog » SEO » Afbeeldingen op je website: Do’s en don’ts (4 tips)