Wat is een canonical URL?
Een canonical URL is een HTML-tag, <link rel="canonical" href="...">, die in de <head> van een pagina staat en zoekmachines vertelt welke URL de 'hoofdversie' is wanneer dezelfde of vergelijkbare content op meerdere URL's bereikbaar is.
Waarom is het nodig? Duplicate content
Neem example.com/product en example.com/product?utm=fb: technisch twee verschillende URL's, exact dezelfde content. Zonder canonical kan Google de verkeerde versie indexeren, kunnen ranking-signalen zoals links versplinteren over meerdere URL's, of kan in zeldzame gevallen een duplicate-content-penalisatie optreden.
Andere veelvoorkomende bronnen van duplicate URL's: filterparameters op een productoverzicht, sorteervolgorde-parameters, en http- versus https-varianten van dezelfde pagina.
Hoe implementeer je het in HTML
Voeg de tag toe in de <head> van je pagina: <link rel="canonical" href="https://example.com/product" />. Elke pagina, ook de canonical zelf, zou een self-referencing canonical moeten hebben — een tag die naar zijn eigen URL wijst. Dat is de standaardpraktijk voor elke unieke pagina.
Cross-domain canonical
Een minder vaak gebruikte toepassing: wanneer dezelfde content op twee verschillende domeinen staat, bijvoorbeeld een gesyndiceerd artikel dat ook op een partnersite verschijnt, kun je de canonical op de kopie laten wijzen naar het origineeldomein. Dat voorkomt dat de kopie gaat ranken in plaats van het origineel.
Veelgemaakte fouten
Een paar fouten komen structureel voor en zijn de moeite waard om te controleren op je eigen site.
- Self-canonical ontbreekt: de pagina verwijst naar niets, of per ongeluk naar een andere pagina.
- Canonical wijst naar een noindex-pagina — een tegenstrijdig signaal voor zoekmachines.
- Canonical wijst naar http in plaats van https, of omgekeerd.
- Inconsistentie in trailing slash tussen de canonical en de daadwerkelijke URL.
- Canonical die niet matcht met de hreflang-set op meertalige sites.
In Next.js: via alternates.canonical
In Next.js stel je de canonical in via de metadata-API, in plaats van handmatig HTML te schrijven: export const metadata = { alternates: { canonical: "https://example.com/product" } }. Dit genereert precies dezelfde <link rel="canonical">-tag, maar dan type-safe en centraal beheerd per pagina.
Wil je weten of je site duplicate-content-risico's heeft?
Vraag een technische SEO-check aan →