5 tips voor een slimme homepage header

Binnen 5 seconden weet een bezoeker of ze in jouw website toekomst zien of niet. Een goede landingspagina zorgt daardoor voor een langere bezoekersduur en overtuigt om door te klikken naar andere pagina’s. Nog een feitje: 70% van de bezoekers scrolt niet naar beneden wanneer het eerste beeld hen niet aanstaat. Wil je op beide vlakken goed scoren? Zorg dan voor een goede homepage header.

Homepage Header Tip 1: laat zien wat je doet

Het moet direct duidelijk zijn waar de website over gaat. De bezoeker moet boven de vouw in ieder geval het logo zien, een aansprekend beeld en een korte tekstuele uitleg van maximaal 70 woorden over jullie diensten, producten, missie of visie. Waar je de homepage header exact mee vult is afhankelijk van de doelgroep en jullie bedrijfswaarden. Heb je bijvoorbeeld een eetcafé dat bekend staat om de overheerlijke tosti’s laat dit dan naar voren komen. Werk je in een echt familiebedrijf kies dan voor een persoonlijke foto waarop het personeel wordt voorgesteld. Dit zegt veel meer dan de buitenkant van jullie pand.

Tip 2: zorg dat het beeld past

Zorg voor geschikte afbeeldingen voor retina-schermen. Hiermee komt de snelheid van de website niet in het gedrang, maar wordt een grotere upload getoont op retina-schermen. Houd hierbij rekening met de maximale breedte van de website en zorg dat je de header-afbeelding upload met een minimale breedte van 1920 pixels. Ruim 95 procent van de internetgebruikers gebruikt een scherm van dit formaat of kleiner. Voeg tot slot ook een mobiele header toe. Op veel responsive websites wordt de headerafbeelding van de desktopversie geschaald naar een kleiner formaat zodat deze op een mobiel scherm past. Dan zie je alleen niet meer wat er op het plaatje staat. Een goede responsive website biedt de mogelijkheid om een aparte header voor mobiele gebruikers te uploaden. Zo houd je de regie over wat je laat zien.

 

Trendrapport download

 

Tip 3: zorg voor een duidelijke navigatie

De tijd dat we al onze diensten en producten in de hoofdnavigatie verwerkten licht echt al heel ver achter ons. Vermoei bezoekers niet met 1000 keuzemogelijkheden, maar stuur ze naar pagina’s waar jij ze graag terugziet. Promoot bijvoorbeeld cases, jullie contactpagina en jullie diensten. Vanuit deze pagina’s link je vervolgens naar diepere lagen in de website. Zo stuur je bezoekers geregisseerd door de website. Verder heeft het een groot voordeel voor jouw online gasten: zij krijgen namelijk geen keuzestress.

Vermoei bezoekers niet met 1000 keuzemogelijkheden, maar stuur ze naar pagina’s waar jij ze graag terugziet.

Tip 4: zorg voor een top call-to-action

Verwerk een knop in de header. Zo hoeft de bezoeker niet te scrollen en kun jij diegene wel sturen naar die belangrijke pagina. Laat de button los ontwerpen van de header. Omdat beelden minder goed worden geïndexeerd dan tekst en afbeeldingen schalen bij verschillende schermgroottes. Ook levert het je minder werk op wanneer je een nieuw plaatje wil met dezelfde call-to-action of andersom.

Tip 5: video in de header

Wanneer je kiest voor een video in de header, zorg dan dat deze niet te lang duurt. Het moet echt een sfeerbeeld zijn van een aantal seconden. Heb je een uitgebreide bedrijfsvideo zet deze dan tussen de content bijvoorbeeld bij de contact-pagina, de over-ons-pagina of op een andere landingspagina waar de film relevant is. Plaats hem overigens ook op YouTube en werk de SEO daar bij. Omdat YouTube na Google wereldwijd de grootste zoekmachine is, wordt de video op deze manier goed gevonden.

Wanneer je kiest voor een video in de header, zorg dan dat deze niet te lang duurt.

Werk aan de perfecte website

In deze reeks gaven we eerder vijf tips voor perfecte afbeeldingen op jouw website en het downloaden van gratis fonts. Zo ben je al vrij compleet op de hoogte van alle belangrijke designzaken voor jullie site.

Geschreven door Mike Lelieveld op 31 augustus 2017.

Kennisblog

Regelmatig publiceren we - naast de workshops die we organiseren - artikelen over trends en ontwikkelingen uit ons vakgebied. Vind je onze blogs interessant en wil je op de hoogte blijven van nieuwe publicaties? Meld je hieronder aan voor de blog alert.

Blog alert

Meer artikelen