Wat is het verschil tussen een header en een hero?
Het verschil tussen een header en een hero is dat de eerste je navigatiebalk is en de tweede je eerste beeld.
De header staat op elke pagina hetzelfde. De hero verschilt per pagina en staat er soms helemaal niet.
Ze worden vaak door elkaar gehaald, en dat leidt tot verwarring bij een offerte.
De header
Logo, menu, één knop. Functioneel en overal gelijk, zodat bezoekers weten waar ze aan toe zijn.
Meer daarover lees je bij wat je in je header zet.
De hero
Het blok direct daaronder: een grote afbeelding of kleurvlak met een kop, een zin en meestal een knop.
Dat is waar je vertelt wat je doet en voor wie. Meer daarover lees je bij hero.
Waarom ze vaak samen genoemd worden
Omdat ze allebei bovenaan staan en samen bepalen wat iemand in de eerste seconde ziet.
Dat samenspel is belangrijk: een hoge header duwt je hero van het scherm. Meer daarover lees je bij above the fold.
Mijn vuistregels
- Header functioneel en laag, hero inhoudelijk en overtuigend.
- Niet elke pagina heeft een hero nodig.
- Zorg dat je kop in de hero boven de vouw staat.
- Wees in een offerte precies over welke van de twee je bedoelt.
Die laatste voorkomt dat je betaalt voor iets anders dan je in gedachten had.
Wanneer je geen hero gebruikt
Bij een artikel of een informatieve pagina. Daar wil je bezoeker meteen bij de tekst, niet eerst langs een groot beeld.
Een kop en een korte inleiding werken daar beter.
Wat ze gemeen hebben
Beide worden op mobiel het hardst getroffen. Wat op een breed scherm ruim oogt, vult op een telefoon je hele beeld.
Meer daarover lees je bij hoe een header op mobiel werkt.