I need a hero-image: zo kies je het juiste beeld voor je website

Hero-image McEnroe

Iemand bezoekt je website en ziet als eerste een schermvullende foto. Die opening, dat beeld is belangrijk. Het doet iets met hem – als het goed is. Het is de hero-image. Die foto selecteren, dat is een ontzettend lastige klus.

Als een website wordt ontworpen, zet de designer vaak een placeholder op die plek. ‘Zoiets moet het worden, maar dat moeten de contentmensen later maar uitzoeken.’ Op dat moment maakt niemand zich er nog zorgen over, maar heel vaak loopt de selectie van die foto uit op een worsteling. Eén foto die het juiste gevoel weergeeft en de hele organisatie representeert– ga er maar aan staan.

Uit ervaring weten we dat er toch richtlijnen zijn die de keuze makkelijker maken. Makkelijker en beter te verkopen aan de stakeholders in de organisatie. Twee deskundigen, contentspecialist Matthijs de Kievit en Designer/beeldredacteur Nadine Salas, vertellen  over hun werkwijze. Daarna geven we belangrijke inhoudelijke tips.

hero-image van ingenieursbureau

De hero-image van een ingenieursbureau: goed gekozen, niet te letterlijk gedacht. Soms moeten mensen daaraan wennen.

Praten over beeld met je klant, hoe doe je dat?

Nadine Salas: ‘Als ik hero-images voor een klant moet selecteren, laat ik die klant altijd eerst in lades en archieven graven naar oude brochures en andere beeldmateriaal. Ik wil kunnen zien met welke foto’s zij zich tot nu toe representeren. Dat is namelijk beeldtaal die ze snappen en waarover je met ze kunt praten. Aan de hand hiervan kun je vragen stellen en suggesties doen.’

‘Meestal heeft de opdrachtgever geen idee wat ze wil. Mensen weten pas wat ze willen als ze het ZIEN. In de productiefase gebruik ik daarvoor wel stockwebsites. Die beelden zijn natuurlijk niet ideaal, maar je hebt dan iets waar mensen tegenaan kunnen roepen/plassen. ‘Ik wil zoiets, maar dan in de Nederlandse situatie, bijvoorbeeld.’

Betekenis

‘Beleidsmensen willen vaak de dat de foto  een letterlijke weergave is van het vakgebied. Er moeten dan bijvoorbeeld vijf verschillende elementen te zien zijn. Daarmee lopen ze natuurlijk vast. Ze maken daarom vaak collages, maar die zijn heel druk en de betekenis gaat helemaal verloren.’

‘Ik zeg dan dat ze de abstract moeten denken. De foto krijgt dan pas betekenis in relatie tot de titel van de pagina. Als je een pagina hebt over bijvoorbeeld Energietransitie, snapt iedereen het als je daar een abstact beeld met een swoosh of lijnen in beweging op plaatst. Dit geeft dus veel meer speelruimte.’

Zie de foto als onderdeel van het design

Matthijs de Kievit: ‘Simpel gezegd: de foto moet passen. Zijn de kleuren afgestemd op de stijl in het design? Is er in de foto voldoende ruimte voor bijvoorbeeld buttons, call-to-actions of andere elementen? Sturen de zichtlijnen in het beeld de bezoeker naar de juiste plekken, bijvoorbeeld de blikken van de personen op de foto en de perspectieflijnen. De compositie zorgt ook voor een bepaalde vibe die moet passen.’

Kijken en scrollen

‘De hero-image hieronder is een goed voorbeeld. De lijnen van dak en vloer en de blikken van de twee mannen wijzen naar het midden en naar beneden, zodat je naar de CTA kijkt. Bovendien is de onderste helft van de foto lichter dan de bovenkant. Het is logisch voor de bezoeker om naar beneden te scrollen. En ruimte genoeg voor tekst en ander elementen, ook al wordt die hier nauwelijks gebruikt.’

Hero-image McEnroe

Wat laat je zien?

Toon je product – of juist niet

Verkoop je een product op je website? Een fysiek, concreet product? Dat is dan makkelijk. Je toont het gewoon, je maakt een foto met d boormachine, de brandkast, de bank erop. Al dan niet terwijl het gebruikt wordt – dat geeft meteen meer informatie over het product. Wil je hiermee ook iets vertellen over wat het product met de gebruiker doet? Dan wordt het tricky.

Het komt vaak voor dat organisatie geen producten in de aanbieding hebben, maar diensten. Die zijn lastiger te tonen. Bekijk deze voorbeelden van een contentbureau, een gemeente. Ze laten zien wat ze doen: mensen helpen  door naar ze te luisteren en ze een formulier te overhandigen, of achter een PC content invoeren en een website ontwerpen. Maar wat je ziet zijn mensen achter een beeldscherm.

Hero-image contentbedrijf

In deze gevallen kun je beter nadenken over het effect van je dienst. Wat haalt het uit, wat is het resultaat? De valkuil hier is dat je je te letterlijk gaat denken: mijn dienst maakt mensen blij, ik laat blije mensen zien!

hero-image van de site van Amsterdam

De gemeente Amsterdam laat een vredig, vrolijk en opgeruimd stadsbeeld zien. Goede foto. Maar er zijn mensen die denken: moet dít Amsterdam voorstellen?

Denk niet letterlijk – denk creatief

Foto’s die letterlijk uitbeelden wat je doet of verkoopt zijn plat. Vaak te plat. Ze hebben geen toegevoegde waarde, ze staan op je site omdat er nou eenmaal een plek is ingeruimd voor een foto. Interessante foto vertellen iets. Daarvoor kunnen je denken in metaforen.

Hero-image Hardt

Hardt is een bedrijf dat lightrail wil aanleggen, maar toont niet die rail zelf.

Door te denken in metaforen, ben je gelijk overgestoken van je product naar je boodschap. Wat wil je meegeven aan je bezoeker?

Hero-image super.global

Het gevoel dat je achterloopt, met humor verbeeld. Werkt!

Een afslag die organisaties hier vaak nemen, is dat ze met de foto een sfeer willen neerzetten. Een ‘toon’ die bij de organisatie past. Dat kan goed werken, maar belangrijk is dat je hierbij de connectie met de doelgroep maakt. Zo laat Triodos een vrouw zien, een voorbeeld van de mensen voor wie het doen. De foto is de illustratie bij een tekst, maar geeft ook een toon waarbij Triodos-klanten zich kennelijk herkend zouden voelen.

Hero-image triodos.de

Triodos, de nieuwe Duitse site.

Maar veel bedrijven kiezen voor een sfeerbeeld dat misschien wel iets over henzelf zegt, maar niet betekenisvol is voor de bezoeker. Zo gebruiken opvallend veel bedrijfjes in Rotterdam een stadsbeeld, meestal met Erasmusbrug of Centraal Station, als hero.

Hero-image rotterdam

Rotterdams stadsbeeld op de site van een webbedrijf: betekenisvol of paginavulling?

Geen stock

Je kunt stockfoto’s gebruiken in het proces, maar publiceer uiteindelijk geen stockfoto op je site. Als je bezoekers een stockfoto zien, denken ze: een stockfoto. Je put dus uit je eigen archief of laat een beeld maken. Desnoods laat je een stockfoto namaken. Wil je toch een stockfoto? Zoek dan een beeldbank met foto’s die minder stock-achtig zijn: met natuurlijk licht, zonder shiny filter, op een herkenbare, niet-anonieme locatie. Er zijn beeldbanken met Nederlandse stockfoto’s, bijvoorbeeld Nationale Beeldbank.

Moeten er mensen op je foto staan? Daarover zijn geen wetten uitgeschreven. Wel is er onderzoek dat erop wijst dat beelden met mensen beter onthouden worden, zie dit rapport van Institute of Electrical and Electronics Engineers. op Skyword.

Investeer in stijl

Als je aandacht vraagt met een grote foto, maak het dan interessant. Hou het onderwerp van je foto simpel, maar zorg dat hij visueel aantrekkelijk is. Investeer in art direction, compositie en beeldkwaliteit. Zelf iets maken, medewerkers laten fotograferen – niet doen.

We zijn benieuwd naar jouw ervaringen, tips en goede voorbeelden. Of heb je vragen? Laat ze achter in de comments, of app ons gewoon even! Op basis daarvan maken we dan een vervolg op dit artikel.

0 antwoorden

Plaats een Reactie

Meepraten?
Draag gerust bij!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *