Je homepagina, wat moet erop, waar begin je? Je hebt natuurlijk heel veel te vertellen, want je bent niet zomaar een bedrijf. Jij bent hèt antwoord.
Met al die informatie kan het snel een chaos worden. Met name op de homepagina moet je doseren. Daarom een artikel over de opbouw van je homepagina. Voor de meeste website is dit de meest geschikte indeling.
De Header
De header staat niet alleen op je home-pagina, maar komt terug op elke pagina. Tenzij je specifieke redenen hebt om dat anders te doen natuurlijk.
De header is meestal tussen de 80 tot 120 pixels hoog.
1 – Je logo
Een open deur, je logo.
Maar hoé gebruik je je logo op je website.
Ik zie nog te vaak dat het logo heel groot midden op de pagina beland. Natuurlijk ben je er trots op wil je het laten zien.
Je hebt er heel erg je best op gedaan om het zelf te ontwerpen. Of je hebt er heel veel geld voor betaald om het door iemand anders te laten doen.
Maar het gaat niet om jou, het gaat om de klant.
Het logo is puur bedoeld als herkenning van je bedrijf.
Is je logo niet duidelijk herkenbaar wanneer je het verkleind?
Dan is je logo niet goed ontworpen.
Een logo is in een header tussen de 50 en 80 pixels hoog.
Zorg dat er voldoende lege ruimte omheen zit.
Het moet een beetje kunnen ademen.
2 – De menubalk
Nog een open deur misschien, maar toch een om goed over na te denken.
Hoeveel items staan er in je menu?
Ideaal is maximaal 5.
Staan er meer dan 5, dan krijgen bezoekers keuzestress. Te veel keuze is geen keuze. Je moet ze helpen.
Dat is best puzzelen.
De meest voorkomende menu items zijn:
home, over, diensten, contact
Wanneer je ook nog een blog hebt of portfolio, webshop, cursussen, dan ga je in de knel lopen.
De home kun je vaak laten vervallen. De meeste bezoekers weten wel dat je daar ook komt door op het logo te klikken.
Maar als dat niet genoeg is, begint de echte puzzel.
Begin met de vraag, wie zijn je bezoekers en wat zoeken ze?
Bij de website van Araumi Daiko hadden meer dan 20 verschillende pagina’s om 4 soorten bezoekers te informeren.
– Bestaande studenten die les- en training info zochten
– Potentiële nieuwe studenten voor lessen
– Geïnteresseerden om optredens te bezoeken
– Bedrijven die een optreden of bedrijfsworkshop willen boeken.
Het menu is geminimaliseerd tot:
Academie – Performances – Bedrijfsevents – Agenda
De menu items zijn specifiek gericht op de 4 typen bezoekers.
Waneer hierop wordt geklikt klapt er een mega-menu open waar de bezoeker verder wordt geholpen.
De meer algemene menu items (over, route, contact) zijn in een extra menubalk geplaatst. Deze is qua vormgeving duidelijk ondergeschikt en daardoor niet storend.
Je ziet ook vaak dat de minder belangrijke menu-items naar de footer worden verplaatst.
De Hero
De hero-section is wat je bezoeker als eerste ziet. Het moet meteen raak zijn. In dit vorige artikel lees je alles over deze held van je website. In dat artikel zie je ook verschillende varianten, ga ik dieper in op de onderdelen en worden er concrete voorbeelden genoemd.
3 – Beeld
Laat hier een sprankelend beeld zien van je product of dienst.
Het beste werkt een afbeelding met een persoon. Iemand waarin de bezoeker zichzelf kan herkennen.
Ben je een dienstverlener?
Dan werkt het goed om jezelf hier te laten zien.
Doodeng, ja.
Maar voor je bezoeker is het fijn om alvast een beeld van je te hebben. En zorg dat het een goede professionele foto is.
Ik werd me hier zelf pijnlijk bewust van tijdens een webinar.
De verteller liet haar vorige hero-section zien met een afbeelding van haarzelf. Eentje van een vakantiefoto waar ze wel aardig opstond. Met wat photoshop werkte het wel.
Ik glimlachte tevreden want ik had precies hetzelfde trucje uitgehaald.
Toen zette ze daarnaast haar nieuwe hero-foto, gemaakt door een fotograaf. Haarscherp, zelfverzekerd, stoer en toch vrouwelijk.
Ze vroeg:
“Zeg nou zelf, wie zou jij inhuren als designer.”
Ai, ik vloekte nog-net-niet-hardop toen ik me realiseerde dat ik mezelf met zo’n beeld dus niet zou inhuren.
Zorg dus voor een goede foto.
4 – Wat doe je
Een website wordt beoordeeld in een paar seconden. En die beoordeling zit hem met name in de tekst die je hier neerzet.
Vertel kort en duidelijk wat je doet en wat je bezoeker hier aan heeft. Dit weet je precies want je hebt je klant goed onderzocht.
In het artikel over de hero-section noemde ik deze drie voorbeelden:
> Coaching voor kunstenaars die een eigen bedrijf op willen zetten
> Handgemaakte geurkaarsen voor een romantische sfeer in huis
> Uitlaatservice voor drukke mensen met drukke honden
5 – Volgende stap
Een zogenaamde call-to-action. Wat wil je dat je bezoeker doet op je website. Je moet ze een beetje op weg helpen.
Wil je dat ze direct een afspraak maken.
Wil je dat ze eerst al je diensten bekijken.
Wil je dat ze eerst vooral zelf even rondkijken.
Het kan allemaal.
Jij bepaalt de route van je bezoeker, het klantproces.
Je diensten
Laat je diensten zien op je home-pagina. Het maakt duidelijk of ik als bezoeker iets aan je heb of niet.
6 – waar je diensten onder vallen
Wat verkoop je of wat voor diensten biedt je aan. Waar help en ondersteun je mee.
7 – Drie van je belangrijkste diensten
Heb je meer dan 3 verschillende diensten?
Probeer je hier te beperken tot de 3 belangrijkste.
Net als bij de menubalk wil je de info doseren voor je bezoeker.
Geef een korte samenvatting voor wie de dienst bedoeld is. Misschien is een service bedoeld voor de doe-het-zelfer en een andere service juist voor degene die het graag uit handen geeft.
Zo kan je bezoeker al direct een geschikte keuze maken.
Ze klikt op de knop eronder en komt op de pagina die geheel gewijd is aan die ene service. Op dit moment is ze al méér dan geïnteresseerd, een potentiële klant.
Op de service-pagina’s kun je nog doorlinken naar extra ondersteunde diensten die je ook aanbiedt.
Over jou
Je bezoeker is al aardig verder gescrold op je pagina.
Nu wil ze toch echt wel eens weten wie je bent.
Hier stel je jezelf even voor.
8 – Intro over jou/team
Een korte intro over wie je bent.
Let op, het gaat niet echt over jou maar over je klant.
Wat je bezoeker zich afvraagt is: “Wie is dit en waarom zou ik haar inhuren?”
Daar moet je dus zo goed mogelijk antwoord opgeven.
Je hond en cavia komen pas op de vervolgpagina.
(tenzij jij natuurlijk van de hondenuitlaatservice bent)
9 – Hoe je er uit ziet
Heb je jezelf nog niet laten zien in de hero?
Dan kom je er hier echt niet meer onderuit. Je potentiële klant wil weten met wie ze in zee gaat. Daar hoort een gezicht bij.
Doe je leukste kleding aan en zorg dat je net naar de kapper bent geweest. Met andere woorden, zorg dat je zelfverzekerd over komt.
Sommige voelen zich zelfverzekerder als ze hoge hakken dragen.
Doe dat, ook al staan ze niet op de foto.
Ben je, net als ik, een beetje gammel op hoge hakken. Houd dan lekker je sneakers aan.
Het loont om te investeren in goede foto’s van jezelf.
10 – Link naar meer over
Wanneer het raak is wil je bezoeker meer weten over jou. Of misschien heb je wel een team. Daar kun je hier naar linken.
Op die pagina vertel je meer over het waarom of je missie van je bedrijf.
Reviews
11 – Wat klanten over jou zeggen
Je kunt zelf wel vertellen dat jij de beste bent.
Maar het is geloofwaardiger als je een ander dat laat zeggen.
12 – Reviews van klanten
Zorg dat je een vragenlijst paraat hebt die je naar klanten kunt sturen om feedback te vragen. Uit deze feedback kun je mooie statements halen om hier te gebruiken.
Laat vooral meerdere reviews zien. Het versterkt je betrouwbaarheid. Je kunt ze tegelijk laten zien of laten rouleren in een carrousel.
Ja, je mag knippen in testimonials van klanten. Zolang de strekking en betekenis hetzelfde blijft. Vaak is het ook nodig om te knippen, want je wilt ook geen langdradige verhalen.
Kort en bondig, is het toverwoord voor alles op de home-pagina.
Vraag ook of je een foto van de klant mag plaatsen. Een gezicht bij een review maakt het nog sterker.
Tot slot
De footer
Eigenlijk verdient de footer niet zo’n zielig plekje onderaan.
De footer is een extra menubalk waar je heel veel informatie in kwijt kunt. Alles wat voor de header menubalk niet belangrijk genoeg was gaat in de footer.
In de footer staat de saaie info als je algemene voorwaarden en privacy statement. Ook het copyright statement vind je hier.
Verder is het handig om contactgegevens hier neer te zetten. Zo hoeft je geïnteresseerde bezoeker niet te zoeken naar je e-mailadres. Natuurlijk zijn er nog veel meer onderdelen die je kunt plaatsen op je home pagina.
Is dit alles
Nee, maar wel het belangrijkste.
Je kunt ook nog denken aan portfolio, blog, publicaties, enz.
Deze onderdelen zijn afhankelijk van wat voor bedrijf je bent.
Dit artikel, deel 1, is de basis van elke website.
Deel 2 lees je hier, dat zijn de extra’s op de home-pagina.