Inhoudsopgave maken

Een inhoudsopgave is een enorm handig iets wanneer je groteren pagina’s hebt op je blog en het soms te lang is om overzicht te houden en om zo eventjes te scrollen. Dan is een inhoudsopgave maken een eenvoudige manier om aan dit probleem op te lossen. Daarnaast heeft het ook SEO voordelen.

Waarom je een inhoudsopgave moet hebben

Het hebben van een inhoudsopgave op sommige webpagina’s vergroot het gebruiksgemak enorm. Zij navigeren dan eenvoudig en snel door je pagina heen. Het is dan ook alleen verstandig om een inhoudsopgave toe te voegen op langere pagina’s anders heeft het weinig toevoeging.

Daarnaast breng je een aantal linkjes aan op je pagina, iets wat Google fijn vind. Het kan ook zijn dat er extra linkjes ontstaan onder je zoekresultaten. Bezoekers hoeven dan niet helemaal te zoeken naar dat deel maar kunnen er direct heen.

Hoe doe je dat? Een inhoudsopgave maken

Voordat je daadwerkelijk kan gaan beginnen is het belangrijk dat je een aantal dingetjes op een rijtje hebt. Het begint bij het in je hoofd hebben van wat je allemaal in je inhoudsopgave wilt verwerken. Zijn dat alle koppen of slechts een aantal. Voor mijn SEO stappenplan heb ik er bijvoorbeeld bewust voor gekozen alleen de H2 en H3 koppen te verwerken. Toen ik het testte met ook met H4 koppen merkte ik dat het juist onoverzichtelijk werd. Niet alleen tijdens het maken was ik het bijna kwijt maar ook toen ik de pagina bezocht was het rommelig. Kijk dus goed van te voren hoe je het precies aan wilt gaan pakken.

Daarnaast zul je een klein beetje in de code van je blog of pagina moeten gaan werken. Is dat lastig? Totaal niet, het is belangrijk dat je goed weet hoe je pagina ingedeeld is en dat je verder niets aanpast. Je zou er ook een plugin voor kunnen gebruiken. Die zullen ongetwijfeld bestaan. Echter heb je voor zo iets eenvoudigs geen plugin nodig, zeker wanneer je weet dat dit je website wel zal vertragen.

Stappenplan inhoudsopgave maken

Wanneer je een inhoudsopgave gaat maken in WordPress zul je voordat je begint twee stukje code moeten hebben en deze vervolgens ook deels weten hoe ze zijn opgebouwd. Zoals je hieronder ziet heb je twee codes. Code 1 is voor de inhoudsopgave zelf en code 2 zet je neer op de pagina waar wilt heen gelinkt wordt.

Code 1 heeft drie mogelijkheden om zelf iets toe te voegen. De eerste is de alt-tag, dit is wat je ziet wanneer je met je muis over de link gaat. Dit heeft ook SEO voordelen.

Vervolgens heb je de link, deze begint altijd met een hastag. Deze wordt namelijk wanneer je er op klinkt achter de URL geplaatst. Vervolgens zoekt je browser naar het stukje code in de tekst met deze link. Daarom vul je bij code 1 en code 2 dezelfde link. Bij code 2 voeg je echter geen hastag toe, de tekst is wel hetzelfde.

Bij tekst voer je de tekst in die je wilt die mensen aan de voorkant zien.

Inhoudsopgave maken code

Om het iets te verduidelijken geef ik je een voorbeeld. Voor het voorbeeld maak ik een inhoudsopgave voor deze pagina. Ik ga nu de stukje code maken voor de stappenplan deel van deze pagina:

<a title=”Inhoudsopgave stappenplan” href=”#stappenplan”>Stappenplan inhoudsopgave maken</a>

Dit ziet er vervolgens zo uit wanneer je het in de code plakt:

Stappenplan inhoudsopgave maken

Vervolgens heb ik het andere stukje code geplakt boven de het kopje ‘Stappenplan inhoudsopgave maken’. Dit stukje code ziet er zo uit:

<a name=”stappenplan”></a>

Vanaf de voorkant zie je hier niks van maar aan de achterkant staat een stukje code waar naar toe wordt gelinkt. Bij het maken van een inhoudsopgave werkt dit hetzelfde. Je plaatst in je inhoudsopgave de stukje code 1 en vervolgens zet je de stukjes code 2 boven de juiste koppen. Ik neem je mee aan het onderstaande stappenplan om jou inhoudsopgave ook zo op te bouwen.

Stukjes code die je nodig hebt (op de delen waar je zelf iets in moeten vullen vind je driemaal een 0):

<a title=”000″ href=”#000″>000</a>

<a name=”000″></a>

Let op: het kan zo zijn dat wanneer je in de code editor aan het werken bent er automatisch extra aanhalingstekens bij komen. Deze zorgen ervoor dat de linkjes niet meer werken. Verwijder deze dus altijd zodat ze er uit zien zoals in het voorbeeld.

Stap 1 Bepaal waar je inhoudsopgave moet komen

Voordat je kan gaan beginnen is het belangrijk dat je goed bepaald waar je inhoudsopgave moet komen. Je zult deze plaats namelijk moeten onthouden om vervolgens de code hiervoor te plaatsen. Weet je niet precies waar dit is zul je snel de weg kwijt zijn.

Stap 2 Plaats de code voor de inhoudsopgave

Wanneer je plek terug heb gevonden binnen de code editor kun je de code gaan plaatsen. Door dit netjes onder elkaar te doen zul je merken dat je beter het overzicht bewaart. Wanneer je de code hebt geplakt kun je hem in de visuele editor verder bewerken zodat de lay-out naar wens is. Zo kun je er bijvoorbeeld een lijst van maken.

Inhoudsopgave maken voorbeeld

Stap 3 Plaats de andere code voor de kopjes

Nu je inhoudsopgave gereed is kun je de andere stukjes code plaatsen voor de kopjes waar je naar toe dient te plaatsen. Zonder deze code weet je browser namelijk niet precies waar je heen moet linken.

Plaats deze stukjes code telkens voor de kopjes. Pas het stukje code wel aan naar wat je in je inhoudsopgave hebt ingevuld. Voeg vervolgens niet de hashtag toe anders werkt je inhoudsopgave niet.

Inhoudsopgave maken code voor kopjes

Recente blogs

WhatsApp business inzetten voor je bedrijf

WhatsApp business inzetten voor je bedrijf

WhatsApp is met ruim twee miljard (!) gebruikers een gigantisch social media platform. We realiseren het ons niet altijd maar WhatsApp maakt een groot deel uit van ons dagelijks leven. Bellen en sms'en is ouderwets en het betalen hiervoor al helemaal. Ben jij...

Lees meer
Conversie van je webshop verhogen

Conversie van je webshop verhogen

Je hebt een webshop? Je krijgt bezoekers en regelmatig worden er producten bij je gekocht. Toch wil je deze daadwerkelijke aankopen wel eens omhoog krikken. Een webshop wordt nou eenmaal afgerekend op het aantal verkopen (conversies). Meer verkopen realiseren kun je...

Lees meer
Testimonials verzamelen

Testimonials verzamelen

Je kent het wel, je loopt een winkel in en wordt direct aangesproken door een verkoper. Deze verkoper gaat jou natuurlijk vertellen waarom je dit product zou moeten kopen. In je achterhoofd weet je zijn commerciële belangen bij het verkopen van deze spullen, meestal...

Lees meer

Schijf je in voor de nieuwsbrief

Wil je op de hoogte blijven van het laatste nieuws en een seintje ontvangen wanneer er een nieuwe blog online komt? Schrijf je dan in voor onze nieuwsbrief.

Controleer je inbox of spammap om je inschrijving te bevestigen. Bedankt!

Pin It on Pinterest

Share This