Meta-tags en HTML: een overzicht

<meta name= "Naam van het element" content="toegewezen inhoud"/>

Title (titel)

Strikt genomen is de title geen meta-element, maar een onafhankelijke HTML-tag. Vanwege het belang voor de interactie met user-agents vermelden we deze toch vaak in combinatie met andere meta-tags. Het is een verplicht element in de HTML-header en bevindt zich meestal voor alle andere meta-tags. Een webbrowser leest de tag en toont de inhoud in de titelbalk van een tab of venster, als standaardnaam bij het instellen van bladwijzers en in de geschiedenis van de webbrowser. Daarnaast gebruiken alle grote zoekmachines de title-tag als kopje bij de vermelding in de zoekresultaten. De inhoud van dit kopje beïnvloedt natuurlijk het klikgedrag van internetgebruikers.

Volgens Google is de title één van de 200 factoren die gebruikt worden bij het berekenen van de ranking in de organische zoekresultaten. Voor optimale SEO-resultaten moet je ervoor zorgen dat de titel niet langer is dan de maximumlengte van 55 tekens. Ook raden we aan om het belangrijkste keyword van een website in de title-tag te plaatsen. Dit is een voorbeeld van de title van deze pagina:

<title>Meta-tags: de belangrijkste tags op een rij | STRATO</title>

Tekencodering

Is de tekenset nog niet in de http-header gedefinieerd? Dan moet je deze informatie via HTML doorgeven. Dit voorkomt bijvoorbeeld dat leestekens verkeerd worden weergegeven. Om de tekenset of tekencodering te specificeren, gebruik je de volgende meta-tag:

<meta charset="utf-8"/>

Deze meta-specificatie is ook relevant als een browser HTML-bestanden niet via http ontvangt, maar rechtstreeks van de harde schijf opvraagt.

Paginabeschrijving (Description)

De tag description (ook meta-description genoemd) biedt ruimte voor een korte beschrijving van de inhoud van de pagina. Aangezien zoekmachines als Google en Bing deze meta-tag gebruiken en de informatie ervan tonen in de zoekresultaten, raden we je aan deze korte tekst zorgvuldig te schrijven. Het bepaalt immers ook weer het klikgedrag van gebruikers. Sterker nog, de description geldt als een van de belangrijkste HTML-meta-tags voor zoekmachineoptimalisatie (SEO). Website-eigenaren mogen maximaal 160 tekens (inclusief spaties) gebruiken voor de description. Als de tekst langer is, wordt deze afgekapt in de zoekresultaten weergegeven en is de beschrijving dus niet volledig zichtbaar. De meta-description is hoofdzakelijk gericht op de internetgebruikers die de zoekopdracht plaatsen en moet daarom een beknopte samenvatting geven van de pagina-inhoud. Volgens Google dienen website-eigenaren ervoor te zorgen dat elke pagina op hun site een individuele beschrijving heeft die precieze informatie weergeeft over de inhoud van die pagina. Dit attribuut biedt de gebruiker een duidelijke toegevoegde waarde en helpt websitebeheerders om meer kliks in zoekmachines te genereren. Ter illustratie tonen we de meta-beschrijving van deze pagina:

<meta name="description" content="Welke meta-tags moet je gebruiken? Waar letten
browsers en zoekmachines op? Lees ons overzicht van belangrijke HTML-meta-tags."/>

Trefwoorden (keywords)

Het keyword-tag biedt websitebeheerders de mogelijkheid om trefwoorden voor een zoekmachine te definiëren. Als een internetgebruiker de database van een zoekmachine raadpleegt op desbetreffende trefwoorden, moet deze meta-tag ervoor zorgen dat HTML-pagina’s verschijnen die voorzien zijn van deze zoektermen. In de beginjaren van het internet was dit één van de belangrijkste meta-tags voor SEO. De zoekmachines gebruikten de tag destijds als hoofdkenmerk voor de ranking in resultatenlijsten. Vandaag de dag is de meta-tag irrelevant voor Google, omdat het heel eenvoudig misbruikt kan worden, bijvoorbeeld door de naam van je grootste concurrent te gebruiken. Bing en de andere grote zoekmachines hechten ook weinig waarde aan de meta tag van het keyword. Kortom, voor de zoekmachineoptimalisatie van je website is deze meta-tag vrijwel irrelevant.

Het feit dat trefwoorden die in de meta-informatie zijn opgeslagen geen (of slechts een kleine) positieve invloed hebben op de organische zoekresultaten, betekent echter niet dat je deze HTML-meta-tag willekeurig kunt gebruiken. Verkeerd gebruik kan je ranking zelfs negatief beïnvloeden. Als je de tag gebruikt, moet je beslist de juiste trefwoorden kiezen. Vermijd daarom het overmatig gebruik van trefwoorden (keyword stuffing) en het gebruik van keywords die niet bij je content passen. Aangezien sommige lokale zoekscripts en meta-zoekmachines zelfs nog steeds de informatie in het keyword-meta-tag gebruiken, raden we je aan deze meta-tag in te voordeel te laten gelden en er een paar relevante keywords in te plaatsen. Afzonderlijke trefwoorden worden met een komma van elkaar gescheiden. Een trefwoordenzin mag overigens uit verschillende elementen bestaan.

<meta name="keywords" content="trefwoord 1, trefwoord 2, trefwoord 3"/>

Author en copyright

Met de meta-tags ‘author’ en ‘copyright’ kunnen webbeheerders in de HTML-code opslaan wie de website heeft gebouwd en bij wie het auteursrecht van inhoud rust. Sommige contentmanagementsystemen wijzen de author tag automatisch toe en noemen altijd de naam van de persoon die de pagina het laatst bewerkt heeft. Dit heeft als voordeel dat beheerders kunnen achterhalen wie welke pagina beheert. Er is overigens geen wettelijke verplichting om deze HTML-meta-tags te gebruiken.

<meta name="author" content="auteursnaam"/>
<meta name="copyright" content="auteursrechthebbende"/>

Instructies voor webcrawlers (robots)

Eén van de belangrijkste taken van meta-tags is het geven van indexeringsinstructies voor zoekmachine-crawlers. Deze kun je per pagina via robot-meta-tags definiëren. De volgende meta-tags kun je gebruiken om te bepalen of een pagina is opgenomen in de index van een zoekmachine en in zoekresultaten mag verschijnen. Je kunt ook aangeven of een crawler links naar uitgaande pagina’s mag volgen of moet negeren. Meta-tags voor robots zijn dus voor je SEO-resultaten uiterst relevante HTML-meta-tags.

Index

Om de zoekmachine in staat te stellen een HTML-pagina te indexeren, gebruik je de volgende meta-tag:

<meta name="robots" content="index"/>

Aangezien indexering van webpagina's overeenkomt met het standaardgedrag van webcrawlers (zoekrobots), is deze specificatie over het algemeen overbodig.

Noindex

Als je niet wilt dat een HTML-pagina in de zoekmachine-index verschijnt, moet je dit expliciet definiëren. Dat doe je met de hieronder genoemde meta-tag. Die verbiedt namelijk een zoekprogramma om de inhoud van een HTML-pagina op te nemen in de database:

<meta name="robots" content="noindex"/>

Het name-attribuut ‘robot’ is gericht aan alle zoekmachine-crawlers en het content-attribuut ‘noindex’ verbiedt het indexeren. Als je indexering alleen voor specifieke robots wilt verbieden, doe je dit via een alternatief name-kenmerk, zoals ‘googlebot’.

Follow

Webcrawlers volgen gewoonlijk alle uitgaande links op een HTML-pagina. Indien gewenst kun je dit handmatig instellen via deze meta-tag:

<meta name="robots" content= "follow"/>

Zoals je begrijpt, is deze meta-eigenlijk overbodig, omdat de crawlers de link dus sowieso volgen. Maar als je dat juist niet wilt, dan heb je deze tag nodig.

Nofollow

Hiermee voorkom je dat de zoekrobot de links op deze pagina volgt, bijvoorbeeld naar andere pagina’s of andere websites. Je gebruikt de meta-tag als volgt:

<meta name="robots" content= "nofollow"/>

Vervolgens behandelen crawlers deze pagina alsof er helemaal geen links op staan. Maar de meta-tag blokkeert alleen de links. De zoekmachine neemt de inhoud van de pagina gewoon op in de database.

Je kunt de meta-tags index/noindex en follow/nofollow individueel of in combinatie gebruiken. Zo kun je aangeven dat een pagina in de index kan worden opgenomen, maar dat de crawler de links moet negeren. Als alternatief kunnen beide acties van de zoekrobot worden uitgeschakeld of toegestaan.

<meta name="robots" content="index,nofollow"/> 
<meta name="robots" content="index,follow"/>
<meta name="robots" content="noindex,nofollow"/>

Cache-control

Om snelle laadtijden te garanderen, is het gebruikelijk om websites op proxyservers of in de cache van de browser op te slaan. Als je de site dan later nog eens raadpleegt, laadt hij veel sneller. Dit proces kun je uitschakelen via de meta-tag ‘cache-control’ met de waarde no-cache:

<meta http-equiv="cache-control" content="no-cache"/>

Webpagina's die van deze meta-tag zijn voorzien, worden bij elk bezoek opnieuw van de webserver geladen. Dit vertraagt het ophalen van pagina's. Maar het is zeer nuttig als een website bijvoorbeeld steeds nieuwe inhoud bevat.

Expires

In plaats van caching volledig te blokkeren, kun je met het attribuut ‘http-equiv’ een vervaldatum geven. Dat doe je met deze meta-tag:

<meta http-equiv="expires" content="Vervaltijd in seconden"/>

Je kunt elke vervalperiode via deze meta-tag aan een HTML-pagina toekennen. Om een expiratietijd van 12 uur in te stellen, kies je bijvoorbeeld 43.200 seconden. Na afloop van de ingestelde periode krijgt de webbrowser van een bezoeker het verzoek om de HTML-pagina van het oorspronkelijke adres te laden. Kies je een vervaltijd van 0 seconden? Dan wordt de inhoud bij elk bezoek opnieuw vanaf de webserver geladen.

<meta http-equiv="expires" content="0"/>
<meta http-equiv="expires" content="43200"/>

Als alternatief kun je tijdsduur en exacte data en tijden definiëren. Deze moeten in internationaal formaat en volgens Greenwich Mean Time (GMT) gespecificeerd worden.

<meta http-equiv="expires" content="Sat, 07 Feb 2016 00:00:00 GMT"/>

Refresh

Meta-tags met het attribuut ‘http-equiv’ bieden de mogelijkheid om een eenvoudige vorm van forwarding in te stellen. Net als bij de expires-tag stel je een expiratietijd in. Zodra die is bereikt, worden user-agents zoals webbrowsers of zoekmachine-crawlers doorgestuurd naar een vooraf gedefinieerde URL. In de voorbeeldcode stuur je bezoekers na 10 seconden door naar de STRATO NL website.

<meta http-equiv="refresh" content="10; url=http://www.strato.nl/"/>

Let op: niet elke browser ondersteunt de refresh-meta-tag. De W3C (de commissie die toezicht houdt op de standaardisering van het internet) raadt daarom aan om HTML-statuscode 301 te gebruiken in plaats van een forward via een meta-tag.