Landingspagina maken voor een goede affiliatewebsite: info en voorbeeld

Landingspagina maken affiliate website

Dit artikel is onderdeel van deze gratis cursus affiliate marketing, waar je stap voor stap leert hoe je een affiliatewebsite maakt.

Eerder heb je al nagedacht over de juiste website-structuur en vervolgens een eerste brainstorm gedaan over de soort content die je wilt gaan schrijven op je website. Nu is het (eindelijk!) tijd om te beginnen met het opvullen van de pagina’s en categorieën. In dit hoofdstuk ga ik het hebben over de content en opbouw van een goede affiliatewebsite. Ik richt me daarbij voornamelijk op de categorieën en pagina’s. Hoe bouw je deze goed op? Wat moet je hier op kwijt?

Tip: Ik bouw de website op in Woocommerce, waar ik producten als affiliate uitwerk in een review. Voor deze basiscursus geef ik deze stappen verder niet. Deze volgen in een latere module. Je kan de redirect op het eind overslaan. De landingspagina’s moet je natuurlijk wel gewoon maken!

Categoriepagina’s opbouwen

De standaard editor van de categoriepagina is echt heel erg slecht. Deze stamt nog uit het jaar 0 van WordPress. Jammer, want de Gutenberg editor vind ik persoonlijk wel een stap vooruit in de editor van pagina’s en berichten. Achter de schermen zeggen ze dat ze er al jaren mee bezig zijn om deze editor ook in categorieën te krijgen. Het duurt wel heel lang! Dit is voor mij een reden om deze standaardcategorieën niet te gebruiken. Ik stuur deze pagina’s door naar een pagina die ik zelf helemaal mooi op kan maken.

Dit doe ik met de Woocommerce productcategorie, als je dit niet hebt, dan kun je de landingspagina gewoon opmaken via het stappenplan, maar dan zonder redirect op het eind!

Categoriepagina opmaken mooi

De standaard editor is niet zo handig.

Goed om te weten: Er zijn mensen die beweren dat je geen redirect moet maken van een categoriepagina naar een andere pagina. Redirects zouden negatief zijn voor SEO. Ik ben er zelf ook geen groot fan van, maar ik merk qua ranking weinig tot geen verschil van de pagina’s die doorgestuurd zijn. Wat ik wel merk is dat de verkopen vanaf die pagina’s een stuk hoger zijn dan die van websites waar ik de normale categoriepagina gebruik! Overweeg voor jezelf of je de standaard-categoriepagina gebruikt of mijn methode gebruikt.

Een landingspagina voorbeeld stap-voor-stap

Voor mijn nieuwe website over GPS-trackers heb ik eerder al veel soorten categorieën bedacht. Deze categorieën moet ik allemaal op gaan vullen. Hier begin ik altijd mee met een nieuwe website. Deze categorieën zijn enorm belangrijk. Je kan ze zien als landingspagina’s. Wellicht dat je deze term al eens eerder bent tegengekomen. Dan weet je hoe belangrijk deze zijn!

Definitie: Landingspagina’s (Engels: Landing page) zijn een pagina op een website. De bezoeker komt op deze pagina binnen of je zorgt dat de bezoeker naar deze pagina wordt geleid. De pagina’s zijn zo ingericht dat de bezoeker wordt aangespoord om een actie te ondernemen,  zoals het kopen van een product of het inschrijven voor een nieuwsbrief.

Stap 1: Pagina aanmaken

Ik maak zelf altijd een nieuwe pagina aan, waar ik later de categorie naar doorverwijs (zie uitgelichte kader bovenaan genaamd Goed om te weten). Ik begin met de pagina hond. Uit keywordonderzoek is namelijk gebleken dat veel mensen zoeken naar informatie over GPS trackers voor honden. Eerder heb ik daar de volgende structuur voor bedacht:

|-- Huisdier
|     -- Kat
|    `-- Hond

Ik maak dus een pagina aan voor Huisdier en een pagina voor Hond. Voor dit voorbeeld start ik eerst met de pagina huisdier, maar in principe werkt alles precies hetzelfde voor de categoriepagina. In mijn geval hond.

Stap 2: Opmaak van de pagina

Hoe je de pagina in gaat delen is grotendeels aan jezelf. Iedereen heeft een andere voorkeur als het gaat om stijl, afbeelding en kleur. Toch zijn er een aantal elementen die ik op deze belangrijke pagina’s die je niet moet vergeten. Hieronder staan de elementen die ik altijd op een landingspagina, zoals een categoriepagina, zet

  • Breadcrumbs
  • H1 titel
  • Afbeelding om de aandacht te trekken
  • Call-to-Action boven de vouw
  • Recente berichten van de categorie
  • Tekst, opgemaakt met H2 en eventueel H3 en H4 titeltags
  • Extra afbeelding met alt-tag
  • Metaomschrijving
  • Inhoudsopgave

Definitie: Boven de vouw (Engels: above the fold) verwijst naar het zichtbare gedeelte van een webpagina zonder te scrollen. Als het gaat om call-to-action (CTA), betekent dit dat de knop of link die bezoekers aanzet tot actie direct zichtbaar is als ze op de pagina komen. Waar het boven de vouw element zich moet bevinden is per schermgrootte anders. Zorg dus ook dat dit element op kleinere schermen, zoals een mobiele telefoon, zichtbaar is.

Stap 3: Elementen op de pagina zetten en opvullen

Nu is het tijd om de pagina op te vullen. Ik heb mijn website al aan kunnen melden bij affiliate-partners, zoals bol.com, maar dit kan pas als je voldoende content (minimaal 10 goedgevulde pagina’s / berichten) hebt staan. Ik gebruik dus al content egg op deze pagina. Naar mijn mening de beste manier om bezoekers naar de juiste webwinkel te leiden. Ik begin nu met het opvullen van de andere elementen op de pagina. Ik zal ze stuk voor stuk behandelen met daarbij een voorbeeld hoe het er bij mij uitziet.

Breadcrumbs

Dit element wordt standaard op een nieuwe pagina gevoegd. Ik gebruik hiervoor de Rank Math SEO plugin, in combinatie met de code uit dit broodkruimel stappenplan. In de onderstaande afbeelding zie je hoe het kruimelpad voor deze pagina er uitziet. Je ziet meteen de permalinkstructuur goed, in dit geval websitenaam/hoofdcategorie/subcategorie.

H1 titel en afbeelding om de aandacht te trekken

Voor deze pagina heb ik besloten om de H1 titel en de afbeelding met elkaar te combineren. De afbeelding trekt de aandacht van de bezoeker, bevat de H1 titel én heeft een alt-tag, wat weer goed is voor SEO-doeleinden. Een win-win-win dus! Hieronder zie je het voorbeeld:

GPS tracker voorbeeld H1 tag en afbeelding

Ik schakel voor deze pagina de H1 titel uit die normaal zou verschijnen. Dit kan je doen door in de pagina instellingen het element Titel te verbergen of het in de CSS te zetten voor alle pagina’s. Ik heb voor het tweede gekozen door de volgende code toe te voegen aan Extra CSS van de Customizer.

.page h1.entry-title {
   display: none;
}

Uitleg code:

  • .page: Dit is een class-selector die zoekt naar HTML-elementen met de class “page”. De stijlregels die volgen, worden toegepast op alle elementen met deze class.
  • h1.entry-title: Dit is een combinatie van element- en class-selectors. Het zoekt naar alle <h1> elementen met de class “entry-title” binnen de eerder geselecteerde “.page” elementen.
  • { display: none; }: Dit is de stijlregel die wordt toegepast op de geselecteerde elementen. In dit geval zorgt het ervoor dat de betreffende <h1> elementen met de class “entry-title” niet zichtbaar zijn op de webpagina. De display: none; eigenschap verbergt deze elementen volledig.

Call-to-Action boven de vouw

Dit element maak ik voor eigenlijk alle pagina’s anders op. Ik probeer een mooie affiliatepartner te vinden die ik boven de vouw kan weergeven. In dit geval is het makkelijk! Ik heb zelf een hond, die wegens jachtinstinct een GPS tracker draagt. Dit is ook de reden dat ik op dit onderwerp ben gekomen. Ik gebruik daar de Tractive tracker voor. Als ik mensen doorverwijs krijg ik een maand abonnement gratis. Ik vind boven de vouw hier wel een mooie plek voor. Je zou hier natuurlijk ook een button of tekstlink kunnen maken naar de beste tracker voor honden!

Boven de vouw CTA

Tip: Test deze CTA ook uit op een klein scherm, zoals een mobiele telefoon. Staat dit element hier ook boven de vouw en hoeft de gebruiker niet te scrollen? Dan is het goed! Anders moet je wat aanpassingen doen aan het ontwerp.

Nog meer CTA’s!

In normale pagina’s en berichten plaats ik zeker niet zoveel Call-to-Action (CTA) als op landingspagina’s. Aangezien ik de Hond-pagina erg belangrijk vind en mensen naar deze pagina hoop te leiden, plaats ik er nog extra buttons op. Dit doe ik in de vorm van een vraag. Als je op de buttons klikt, kom je uit bij een webwinkel via mijn affiliatelink. Dit element is overigens niet verplicht, maar dit soort pagina’s lenen zich er wel goed voor. Iets om te overwegen dus!

CTA buttons voorbeeld landingspagina

Recente berichten van de categorie

Voeg nu een widget toe zoals Recent posts of laatste berichten. Laad hier de categorie in die je wilt weergeven op de pagina. In mijn voorbeeld laad ik de laatste reviews en berichten in die te maken hebben met hond.

Tekst en toplijst

Nu begin ik met het toevoegen van tekst aan de pagina. Dit doe ik op meerdere plekken. Ik kies er daarnaast ook voor om een toplijst te maken met als H2 titel “De beste GPS trackers hond op een rij”. Dit is meteen goed voor de zoekwoorden op de pagina.

Toplijst

Daaronder plaats ik nog meer tekst, een afbeelding en de reviews van de trackers die ik uitgewerkt hebt of nog uit ga werken. Vaak gebruik ik deze pagina’s ook als een online to-do lijst. Zo weet ik zelf wat ik nog wil gaan reviewen en weet de bezoeker dat er nog nieuwe informatie verschijnt! In de tekst voeg ik nog een afbeelding toe met daarin een alt-tag. In totaal probeer ik altijd minimaal 500 woorden toe te voegen aan dit soort pagina’s.

GPS tracker voorbeeld landingspagina

Inhoudsopgave

Ik heb het automatisch toevoegen van de inhoudsopgave voor de landingspagina’s uitgezet. Dit beheer ik liever volledig zelf. Ik vind voor dit soort pagina’s de standaardlocatie gewoon niet heel mooi en handig. Het verpest ook vaak het boven de vouw element op de website. Ik voeg de table of contents in via de Easy Table of Contents plugin. Dit doe ik in dit geval handmatig, net voor de tekst, met de shortcode:

[ez-toc]

Metatekst

Via de Rank Math SEO plugin vul ik een metatekst in voor de pagina. Ik ga voor: “Zoek je een GPS tracker voor jouw hond? Dan zit je bij ons goed! Bekijk betrouwbare en onafhankelijke informatie over GPS honden trackers!”

Redirect aanmaken (alleen als je de website via Woocommerce opbouwt)

Ik wil nu dat de standaardproductcategorie Hond naar deze pagina wordt gewezen. Ik werk hiervoor met de productcategorieën van Woocommerce, maar in de basiscursus ga jij werken met de berichtcategorie. Je moet een redirect aanmaken. Een permanente 301-redirect aanmaken doe je via Rank Math SEO op de volgende manier

  1. Installeer Rank Math SEO: Log in op je WordPress-dashboard, ga naar ‘Plugins’ en klik op ‘Nieuwe toevoegen’. Zoek naar “Rank Math SEO” en installeer en activeer de plugin.
  2. Open Rank Math instellingen: Navigeer naar het Rank Math SEO-dashboard in je WordPress zijbalk en klik op ‘Redirections’. Als de ‘Redirections’ module nog niet is geactiveerd, schakel deze dan in via ‘Rank Math > Dashboard > Modules’.
  3. Voeg een nieuwe redirect toe: Klik op de knop ‘Add New’ (Nieuwe toevoegen) om een nieuwe 301-redirect te maken.
  4. Stel de oude URL in: In het veld ‘Source URLs’ (Bron-URL’s), voer de oude URL in die je wilt omleiden. Gebruik het relatieve pad van de URL, zoals “/oude-pagina”.
  5. Stel de nieuwe URL in: In het veld ‘Destination URL’ (Bestemmings-URL), voer de nieuwe URL in waarnaar je de bezoekers wilt sturen. Gebruik het volledige pad van de URL, zoals “https://www.jouwdomein.nl/nieuwe-pagina”.
  6. Kies redirect-type: Selecteer ‘301 Permanent Move’ als het redirect-type. Dit informeert zoekmachines dat de verhuizing permanent is en helpt bij het behouden van SEO-waarde.
  7. Sla de wijzigingen op: Klik op de knop ‘Add Redirection’ (Omleiding toevoegen) om de 301-redirect op te slaan.

De pagina is nu klaar. Althans, het voorlopige ontwerp. Ik druk nu op publiceren en herhaal deze stap voor álle categoriepagina’s en subcategorieën. Dit neemt zeker een hoop tijd in beslag, maar je hebt er wel veel profijt van als het eenmaal goed staat!

Huiswerkopdracht

Maak zelf van de categorieën en subcategorieën die je hebt verzonnen landingspagina’s. Neem hier goed de tijd voor!

Check het zoekvolume van je zoekwoord hieronder:

Foto van auteur

Edwin

Edwin is sinds 2012 volop bezig met websites ontwikkelen en affiliate marketing. Op MijnOnlineInkomen.nl deelt hij al zijn ervaring.

Wij schrijven onze teksten en reviews als onafhankelijke partij. Daarbij maken we soms gebruik van affiliate links. Meer hierover lees je in ons advertentiebeleid.