Gids 08 · 6 minuten
Welke foto's zet ik op mijn website?
Het korte antwoord
Zet er eigen foto's op, van je eigen werk en je eigen mensen. Die overtuigen meer en niemand anders heeft ze. Sla ze op als WebP, maximaal 1600 pixels breed en onder de 250 kilobyte per stuk, en geef elke foto een breedte en hoogte mee zodat de pagina tijdens het laden niet verspringt.
Op de meeste websites is beeld het overtuigendste en tegelijk het zwaarste onderdeel. Daarom gaat het er ook vaak mis: er staat te weinig echt beeld op, en wat er staat is te groot.
Een fotograaf heb je er meestal niet voor nodig. Met je telefoon, werk dat af is en tien minuten kom je een heel eind.
Waarom stockfoto's tegen je werken
Een gehuurde foto van een lachend team in een glazen kantoor zegt niets over wat jij levert. De meeste bezoekers zien inmiddels ook dat zo'n foto gehuurd is, en dan zegt hij wél iets: dat er blijkbaar niets echts te laten zien was.
Daarnaast is er een praktisch risico. Er zijn partijen die stockbeeld actief nalopen en claims sturen als de licentie niet klopt, en "het zat in mijn websitepakket" geldt dan niet als verweer. Met een foto die je zelf hebt gemaakt heb je dat probleem niet, en niemand anders heeft hem.
Eigen beeld is bovendien inhoud. Een foto van de badkamer die je vorige maand hebt aangesloten, met een regel eronder over de plaats en wat het probleem was, werkt als bewijs en helpt ook je vindbaarheid.
Wat je zelf kunt fotograferen
Een moderne telefoon is meer dan genoeg. Je hebt vooral licht nodig en een half uur.
01
Werk dat af is
Het overtuigendste beeld dat je kunt hebben, en je concurrent heeft het niet. Maak er een paar meteen na de oplevering, voordat het gereedschap weer in de bus ligt.
02
Voor en na
Twee foto's van hetzelfde punt, uit dezelfde hoek. Hier kijken mensen het langst naar, en hierover bellen ze.
03
Jezelf, in het echt
Liever jij in je werkkleding op een klus dan een studioportret tegen een grijze achtergrond. Bij een eenmanszaak of een klein bedrijf haalt dit beeld vaak de aanvraag binnen.
04
Je bus, je pand, je gereedschap
Voor iemand die je nog niet kent, is het geen kleinigheid dat je echt bestaat en ergens zit. Dezelfde foto's kun je ook in je Google-bedrijfsprofiel zetten, waar ze meetellen.
05
Daglicht, met het licht in je rug
Meer regels heb je niet nodig. Ga met je rug naar het raam staan, veeg de lens af en maak er tien in plaats van één. Bewerken hoeft niet.
De maten die ik aanhoud
Hier zit het gewicht. Een telefoonfoto is zo'n vier megabyte, terwijl je op je site met vijf procent daarvan toekunt zonder dat iemand verschil ziet.
- Bestandsformaat
- WebP
- Ongeveer 30% lichter dan JPEG bij hetzelfde beeld, en al jaren in elke browser te gebruiken. AVIF is nog lichter, maar geeft meer gedoe.
- Breedte
- 1600 pixels
- Genoeg voor een schermbreed beeld op een scherp scherm. Voor een foto in een kolom is 800 al ruim.
- Gewicht per foto
- onder 250 kB
- Grote schermbrede foto's mogen richting de 300. Kom je daarboven, dan zit er detail in dat niemand ziet.
- Hele pagina
- onder 1 MB
- Alles bij elkaar: tekst, opmaak, lettertypen en beeld. Blijf je daaronder, dan laadt je site op 4G meestal binnen een seconde.
Een foto verkleinen van vier megabyte naar tweehonderd kilobyte
- 01
Verklein eerst de afmetingen
Een foto van 4032 pixels breed terugbrengen naar 1600 haalt al driekwart van het gewicht weg, en aan de kwaliteit merk je niets. Deze stap doet het meest en wordt het vaakst overgeslagen.
- 02
Sla op als WebP, kwaliteit rond 80
Onder de 70 gaan vlakke stukken zoals een lucht zichtbaar korrelen. Boven de 90 lever je bytes in voor verschil dat niemand ziet.
- 03
Geef breedte en hoogte mee
Dan houdt de browser ruimte vrij voordat de foto binnen is, en schuift de tekst niet weg onder je vinger. Ontbrekende afmetingen zijn een van de twee oorzaken van een slechte CLS-score.
- 04
Laad wat onder de vouw staat later
Foto's die je pas ziet als je scrollt, hoeven niet mee in de eerste lading. Daar is één woord in de code voor. Doe dat níet bij de bovenste foto, want die is meestal je LCP en moet zo vroeg mogelijk binnen zijn.
- 05
Schrijf een alt-tekst
Beschrijf in normaal Nederlands wat er te zien is: "nieuwe cv-ketel in een bijkeuken in Capelle". Mensen die de foto niet zien hebben dat nodig, en een zoekmachine weet alleen zo wat erop staat. Sier-elementen krijgen géén alt-tekst.
Zelf doen
Wat je vandaag zelf kunt afwerken
Vink af wat je hebt gedaan. Er wordt niets bewaard, bij een volgend bezoek staat de lijst weer leeg. Dat is een keuze: iets opslaan in je browser om een vinkje te onthouden staat slecht op een site die uitlegt waarom je zo weinig mogelijk van je bezoekers wilt weten.
0 / 6
Of je laat het doen
Website laten maken in Capelle aan den IJssel
Bij een nieuwe site regel ik dit in één keer: jouw foto's in de juiste maten en met de afmetingen meegegeven, zodat je er later niet meer naar hoeft om te kijken.
doorlooptijd 2 tot 5 weken · vaste prijs vooraf
Vragen
Wat mensen hier nog over vragen
Staat je vraag er niet bij? Mail me, dan schrijf ik hem erbij. Binnen één werkdag antwoord. Meestal dezelfde dag.
Maximaal 1600 pixels breed en onder de 250 kilobyte per stuk. Een foto die zo van je telefoon komt, is drie tot zes megabyte, zo'n twintig keer te veel. Breng eerst de afmetingen terug en sla hem daarna op als WebP met kwaliteit rond 80.
Gebruik WebP. Dat is ongeveer 30% lichter dan JPEG bij hetzelfde beeld en werkt al jaren in elke browser. AVIF is nog iets lichter, maar het extra gedoe weegt meestal niet op tegen de winst. PNG gebruik je alleen voor beeld met scherpe lijnen of doorzichtigheid, en logo's zet je het liefst als SVG op je site.
Nee. Vrijwel alles wat je via Google Afbeeldingen vindt is van iemand, en sommige partijen controleren daar actief op en sturen claims. Gebruik je eigen foto's, of beeld met een licentie die je kunt aantonen. Eigen werk overtuigt bovendien meer.
Een alt-tekst is een korte beschrijving van wat er op de foto staat, en ja, je hebt hem nodig. Mensen die de foto niet kunnen zien zijn erop aangewezen, en een zoekmachine weet alleen zo wat erop staat. Schrijf hem in normaal Nederlands. Foto's die er alleen voor de sier staan, krijgen géén alt-tekst.
Volgende stap
Zullen we eens kijken waar bij jou de uren weglekken?
Een gesprek van drie kwartier, bij jou op locatie. Je krijgt sowieso een lijstje mee met wat ik zou aanpakken, of je nu met mij verder gaat of niet.
Binnen één werkdag antwoord. Meestal dezelfde dag. · Je spreekt Kaz, niet een callcenter.