UA-2131491-6

Leesvoer - oftewel ons blog

Anker links

Het hoe en waarom van de ankerlink

Vandaag mocht ik weer vragen beantwoorden in het vragenuurtje van de Academie van Ik help jou online. We hadden het onder andere over de ankerlink.

ankerlinks
Eerste hulp bij ankerlinks

De ankerlink

Een ankerlinks is een link die naar een stuk tekst op dezelfde pagina verwijst. Erg handig wanneer je een pagina hebt met veel tekst of met een inhoudsopgave. Maar je kunt bijvoorbeeld ook linken naar een formulier of een knop.

Waarom een ankerlink gebruiken?

Waarom zou je een ankerlink willen gebruiken? Ankerlinks hebben een aantal voordelen:

  • Bij pagina’s met veel tekst zorgen ankerlinks voor een betere gebruikerservaring. Lezers kunnen gelijk naar dat gedeelte gaan, waar zij geïnteresseerd in zijn.
  • De ankerlinks komen ook van pas wanneer je vanaf sociale media naar een bepaald deel van je pagina wilt linken.
  • Wanneer je ankerlinks in de vorm van een inhoudsopgave gebruikt worden deze in de zoekresultaten van Google weergegeven. Zie hiervoor onderstaand voorbeeld van het zoekresultaat van de Wikipediapagina van Barack Obama.
  • Je kan een ankerlink ook inzetten om terug naar het begin van de pagina te gaan.
Ankerlink Google
Ankerlink in zoekresultaten

Eventuele nadelen van het gebruik van ankerlinks

Hoewel ankerlinks nuttig kunnen zijn, moet er wel met een aantal zaken rekening worden gehouden:

  • Lezers die gelijk naar datgene gaan wat ze willen lezen, lezen de rest van de pagina niet en kunnen dus informatie missen.
  • Wanneer je je domeinnaam wijzigt of om een andere reden een 301 verwijzing nodig gaat hebben, heb je een probleem. Voor ankerlinks wordt namelijk het hekje-teken (#) gebruikt en deze wordt niet naar de server gezonden.

Dat schrijvende, de voordelen wegen over het algemeen op tegen de nadelen.

Toevoegen van een ankerlink

Er zijn verschillende manieren om een ankerlink te maken: via je teksteditor, handmatig via html-tags in de teksteditor – je voegt dan dus zelf code toe – via een plugin,  of via een Chrome Extensie.

Via je teksteditor

In bepaalde page builders zoals Divi kun je eenvoudig een anchor link toevoegen. Dit is ook het geval met Gutenberg (de nieuwe teksteditor van WordPress 5). Hier highlight je de tussenkop en in het geavanceerde blok in de rechterkolom kun je vervolgens de ankerlink toevoegen.

Handmatig

Zet de teksteditor op “handmatig” in plaats van op “visueel” en ga op zoek naar datgene naar waar je wilt linken. Aan deze tekst (of knop of formulier) voeg je een id toe. Dit klinkt ingewikkeld maar dit is een voorbeeld van een ankerlink naar tussenkop: <h2 id=dit-is-de-anker-link>De tussenkoptekst</h2>.

De ankerlink is nu aangemaakt en nu kun je de link gaan aanmaken. Switch de teksteditor terug naar “visual”en selecteer de tekst waarvan je een link wilt maken. Je klikt op link maken en typt een hashtag (#) direct gevolgd door de id (#dit-is-de-anker-link) en slaat deze op. En dat is alles!

Let op: gebruik voor elke ankerlink een unieke id!

Met een plugin

Er zijn verschillende plugins waarmee je ankerlinks eenvoudig kunt toevoegen:

  • TinyMCE Advanced – waarmee je extra functionaliteiten aan je teksteditor kan toevoegen en inclusief het maken van ankerlinks
  • Voor het gebruik van ankerlinks in inhoudsopgaven kun je de Easy Table of Contents plugin gebruiken
  • En voor het linken naar tussenkopjes kun je de WP Anchor Header plugin inschakelen
TinyMCE Advance teksteditor
Veel mogelijkheden met de TinyMCE Advanced teksteditor

Via Chrome

Chrome heeft ook een extensie waarmee je ankerlinks kan toevoegen: Anchor Links Chrome extension.

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *