Hero Banner of Hoofdcategorieën als eerste building block van je homepage

Een hero-banner trekt snel de aandacht en maakt een sterke visuele indruk, terwijl hoofdcategorieën gebruikers direct naar belangrijke secties leiden. Denk na over de prioriteit van inhoud en functies op je website. Een hero-banner kan een krachtige call-to-action (CTA) benadrukken en visueel aantrekkelijk zijn, terwijl hoofdcategorieën bezoekers helpen om snel te vinden wat ze zoeken.

Overweeg of je meer waarde hecht aan visuele impact of aan de directe toegankelijkheid van informatie. Hoewel een hero-banner een opvallende eerste indruk kan maken, neemt hij ook veel schermruimte in beslag. Die ruimte kan ook worden gebruikt voor praktische, direct bruikbare inhoud, zoals hoofdcategorieën.

Hieronder zijn verschillende opties voor hero-banners en hoofdcategorieën. Hoewel deze elementen primair bedoeld zijn voor de homepage, kunnen ze ook worden toegepast op andere pagina's zoals landingspagina's, collectiepagina's, blog's en informatiepagina's. Houd er rekening mee dat sommige van deze elementen er anders uit kunnen zien op pagina's zonder volledige breedte, zoals pagina's met een linkermenu.

Optie 1: (Full-width) Hero-banner met een afbeelding als achtergrond (met keuze tussen rechthoekige of afgeronde hoeken)

Variant 1: Hero banner met tekst in het middle

Variant 2: Hero banner met tekst links

Optie B: (Full-width) Hero banner met keuze tussen rechthoekige of afgeronde hoeken

Variant 1: Hero banner met afbeelding links

Hoofdcategorieen - 2 card components

Optie A: 2 cards naast elkaar - symmetrisch grid (2 cards onder elkaar op mobiel)

Variant 1:

Variant 2:

Variant 3:

Optie B: 2 cards naast elkaar - asymmetrisch grid (2 cards onder elkaar op mobiel)

Variant 1:

Variant 2:

Bekijk ook de lijst met card components en content-blokken