Een beeld zegt meer dan duizend woorden: een uitdrukking die iedereen kent, maar die toch niet consequent wordt toegepast in webdesign. Door het belang van tekst voor zoekmachineoptimalisatie is visuele content de laatste jaren een beetje op de achtergrond geraakt. Met name kleinere bedrijven met minder budget kiezen ervoor om te focussen op tekst en gratis of goedkope stockfotografie te gebruiken voor beeld. Dat is jammer, want ook beeld is een belangrijk onderdeel van een goede website. Daarom in dit artikel zeven tips voor de fotografie op je website.
Wat is visuele content?
Content is een van de negen bouwstenen voor een goede website. ‘Content’ betekent letterlijk ‘inhoud’ en is een verzamelnaam voor alles wat informatie kan overdragen. We hebben het dan over tekstuele content, maar ook visuele content, zoals foto’s en video’s. In dit artikel hebben we het specifiek over foto’s.
Tip 1: Schakel een professionele fotograaf in
Tegenwoordig heeft bijna iedereen een smartphone die mooie foto’s kan maken. En online vind je honderden gratis of goedkope stockfoto’s. Waarom zou je dan nog geld uitgeven aan een professionele fotograaf? Omdat een professionele fotograaf weet wat het inhoudt om te fotograferen voor zakelijke websites. Dat vraagt namelijk om andere foto’s dan de selfies die je op Instagram zet, of de kiekjes die je in de familie-app stuurt. En hoewel je tegenwoordig kwalitatief goede stockfoto’s tegen een lage prijs kunt krijgen, zijn deze niet speciaal gemaakt voor jouw bedrijf en jouw website. Ze komen daardoor vaak niet authentiek over of passen gewoon niet helemaal bij jouw bedrijf. Bovendien kan het zomaar voorkomen dat jouw concurrent dezelfde stockfoto’s gebruikt als jij! Kortom, wil je echt laten zien wie jij bent, wat jouw bedrijf of organisatie uniek maakt en waar jullie je in onderscheiden? Dan kan dat alleen met ‘echte’ foto’s van een professionele fotograaf.
Tip 2: Licht de fotograaf goed in
Je huurt dus vooral een professionele fotograaf in om kwalitatief goede en authentieke foto’s te krijgen, die echt passen bij jouw bedrijf/organisatie. Daarvoor is het wel belangrijk dat je jouw fotograaf goed brieft. Bespreek met je fotograaf wie de doelgroep is van jouw website en dus van de foto’s. Leg ook uit wat het doel van je website is en bespreek welke foto’s je nodig hebt voor welke pagina’s, zodat hij hier rekening mee kan houden.
Tip 3: Zorg dat webdesign en fotografie bij elkaar aansluiten
Idealiter schakel je al in het ontwerpproces van de website een fotograaf in. Zo kun je ervoor zorgen dat de fotograaf foto’s maakt die (letterlijk en figuurlijk) ‘passen’ in het ontwerp en dat de webdesigner een ontwerp maakt dat past bij de beelden. Heb je al een webdesign en moet je dit nog ‘vullen’ met foto’s? Dan is het belangrijk om goed te kijken welke foto’s je nodig hebt. Denk bijvoorbeeld aan: liggende of staande foto’s, headerfoto’s of ‘gewone’ foto’s, achtergrondfoto’s, etcetera. Ook zal je fotograaf willen weten of er ruimte op de foto’s moet zijn om tekst toe te voegen.
Tip 4: Kies de juiste bestandsindeling
Zijn de foto’s gemaakt en bewerkt? Dan is het nu tijd om de foto’s op je website te plaatsen. Hierbij is het belangrijk om op een aantal dingen te letten. Het eerste is het gebruik van een juiste bestandsindeling.
Het kan zijn dat je RAW- en PSD-bestanden van de fotograaf hebt gekregen. RAW-bestanden zijn de ruwe, onbewerkte afbeeldingen. PSD staat voor Photoshop Document. In een Photoshop-document zijn de foto’s mét bewerkingen opgeslagen. Deze bestanden zijn daardoor heel zwaar. Beide bestandsindelingen zijn niet geschikt voor je website.
Werk in plaats daarvan met JPEG (JPG), PNG of GIF. Deze formaten zijn speciaal ontworpen om foto’s te verkleinen en online te verspreiden. In de meeste gevallen zul je JPEG moeten gebruiken voor de foto’s op je website.
Tip 5: Kies de juiste resolutie
Een ander belangrijk punt om rekening mee te houden bij het plaatsen van de afbeeldingen is de resolutie. Hoe meer pixels je foto bevat, hoe scherper de foto. De foto heeft dan een hoge resolutie.
Het voordeel van een foto met een hoge resolutie is dat deze er mooier (scherper) uitziet. Het nadeel is dat een foto met een te hoge resolutie een lange laadtijd heeft en daarmee je website vertraagt.
Wat betekent dit in de praktijk? Een foto die de hele breedte van de website beslaat (bijvoorbeeld een header), moet minstens 1920 pixels breed zijn. Als maximale breedte kun je 2400 pixels aanhouden. Voor een afbeelding die maar de helft van de paginabreedte inneemt (bijvoorbeeld een foto bij een blogpost) kun je met minder pixels af: vanaf 1200 pixels zou de afbeelding scherp genoeg moeten zijn.
Tip 6: Maak je fotobestand nog minder zwaar
Heb je de juiste resolutie en de juiste bestandsindeling gebruikt, maar laadt de afbeelding nog steeds traag? Dan zijn er nog een aantal manieren om je fotobestand lichter te maken. Veel foto’s bevatten namelijk onnodige data, zoals locatiegegevens, datum en tijdstip waarop de foto is gemaakt, de naam van de fotograaf en de gebruikte sluitertijd. Dit noem je metadata. Door deze metadata te verwijderen, wordt de foto lichter.
Let op: Bij het plaatsen van de foto op de website kun je opnieuw metadata toevoegen, zoals een titel en een alt-beschrijving. Deze metagegevens zijn juist wél belangrijk om in te vullen, omdat ze blinden en slechtzienden helpen de afbeelding te begrijpen en omdat ze zoekmachines vertellen waar de afbeelding over gaat.
Tip 7: Zorg voor responsive design
Ten slotte is het altijd belangrijk om ervoor te zorgen dat je website responsive is. Dit betekent dat de website zich automatisch aanpast aan het scherm van de gebruiker. De gebruiker kan de website goed bekijken en lezen, of hij daar nu een desktop, mobiel of tablet voor gebruikt. Wij gebruiken WordPress voor het maken van websites en kiezen dan natuurlijk voor responsive thema’s, waarin alle onderdelen van de site (dus ook de foto’s) automatisch meeschalen.
Gebeurt dit bij jou niet, of vind je de manier waarop de afbeeldingen geschaald worden niet mooi? Dan kun je een focal point instellen. Daarmee geef je aan welk deel van de afbeelding sowieso getoond moet worden, zodat het belangrijkste deel van de afbeelding in beeld blijft bij kleinere schermen.
Een andere optie is een crop tool inbouwen in je site, zodat je voor elke toepassing (desktop-, tablet- of mobiele schermen) de afbeelding handmatig bij kunt snijden.
Mindworkz webdesign inclusief fotografie
Wil jij ook een website waar beeld en tekst elkaar aanvullen? Wij helpen je graag bij het ontwerpen van jouw nieuwe website. Graag betrekken wij de fotograaf er al in het ontwerpproces bij, om tot een optimaal resultaat te komen. Neem contact met ons op voor meer informatie.