Website-SEO met metadata
Websites optimaliseren met metadata
Met metadata krijg je veel voor elkaar. Je kunt daarmee bijvoorbeeld je site met Rich Snippets in zoekresultaten laten opvallen of beter op Facebook of Twitter laten overkomen. Maar dan moet je je wel eerst door een jungle aan formaten heen zien te worstelen.
Metadata is geen rocket science, maar wel relevant voor de weergave van een pagina in een zoekmachine, browser en in nog talrijke andere toepassingen. Met een mooie weergave via Googles Rich Snippets of met de nieuwe Rich Cards krijg je meer toeloop naar je website. Maar er valt nog veel meer te beinvloeden met metadata.
Als je er voor het eerst voor gaat zitten, kan het al vrij snel verwarrend worden. Meta-informatie op websites is op zeer veel verschillende manieren te formuleren. Een aantal vult elkaar aan, andere zijn eerder concurrenten: Schema.org, Open Graph, RDFa, JSON-LD, Microdata, Microformats… Zonder een idee waar je het moet zoeken lijkt het meer op voodoo dan SEO. Metadata voor websites ontstonden tegelijk met de HTML-standaard. Het <meta>-element is de oudste manier om metadata in een document te stoppen. In de meest gebruikelijke vorm staat het in de HTML-head en bevat een name- en een content-attribuut:
<meta name=”description” content=”Tekst met omschrijving ...”>
"description", "keywords", "author" en "generator" zijn gestandaardiseerde namewaardes. Alleen description is van belang voor zoekmachines. Het is niet relevant voor de ranking, maar voor de presentatie
van de hits. keywords wordt door de grote zoekmachines genegeerd. Veel websitebouwers schenken daardoor weinig aandacht aan HTML-metadata. Ze vertrouwen erop dat Google de relevante data binnen hun sites opduikelt. Hierdoor blijven er veel mogelijkheden liggen.
<meta>-tags hebben nog veel meer toepassingen. name kan namelijk elke willekeurige waarde aannemen. Nuttig en vrij gangbaar is bijvoorbeeld viewport (zoomwaarde voor mobiele apparaten), robots (regels voor het indexeren door zoekmachines) en diverse ontwikkelaarspecifieke waarden. Op de plek van name kun je ook http-equiv (doorgestuurde http-header), charset (codering), property (RDFa) of itemprop (Microdata) zetten.
Dublin Core
De eerste poging om een site te beschrijven met behulp van description en keywords is meer dan twintig jaar geleden gedaan. De Dublin Core Metadata Initiative (DCMI) is genoemd naar een buitenwijk van Columbus in Ohio, niet naar de Ierse hoofdstad.
De eerste en bekendste incarnatie van deze als RFC 5013 en ISO 15836 beschreven standaard heet Simple DCV en bevat 15 elementen. Dit zijn een ID (identifier, bijvoorbeeld ISBN of URL) technische data (format, type, language), inhoudelijke data (title, subject, coverage, description), personen en rechten (creator, publisher, contributor, rights), koppelingsinformatie (source, relation) en datum (date). De huidige status van Dublin Core heet Terms en voegt aan deze woordenschat nog eens veertig begrippen toe.
In HTML ziet dat er zo uit: Soms zie je ook een schrijfwijze met hoofdletters ("DC.creator"). De invloed van Dublin Core zie je op veel plekken terug, bijvoorbeeld in RDF of Schema.org, maar in de dagelijkse praktijk op het web heeft het aan gewicht verloren. Voor de zoekmachineoptimalisatie zijn er betere oplossingen. In diverse nichegebieden leeft DC nog wel, zoals in bibliotheken of bedrijfsnetwerken.
Schema.org
Schema.org heeft Dublin Core opgevolgd en is vandaag de dag de meest relevante metadata-vocabulaire. Het stamt af van een initiatief van Google, Yahoo, Bing en Yandex. Daardoor ondersteunt het vier van de meest relevante zoekmachines (afgezien van Oost-Azië).
Schema.org kun je in Microdata, RDFa of JSON-LD neerpennen. Een aantal voorbeelden zijn te zien in het kader op de voorlaatste pagina van dit artikel. Je kunt het in de body of head neerzetten. Google heeft een voorkeur voor JSON-LD, maar de andere notitiewijzes werken ook. Dit is via een testtool van Google te controleren (zie de link aan het eind van het artikel). De vocabulaire is hiërarchisch opgebouwd. De stam wordt gevormd door Thing, die alle children en grandchildren eigenschappen zoals url, identifier, name en image laat erven. Een laag hoger vertakt de boom in acht branches: Action (bijvoorbeeld Like, Vote of Reply), CreativeWork (tekst, muziek, films et cetera), Event, Intangible (een mengelmoes, onder andere voor vluchten, rekeningen, aanbiedingen) Organization, Person, Place en Product. Zo is een BlogPosting een SocialMediaPosting, in een Article, dat weer afstamt van CreativeWork. Soms komen de erflijnen weer samen: een LocalBusiness (restaurant of bloemist) is zowel een Place als Organization.
Door deze hiërarchie met tot wel zes lagen heb je voor een aantal items bijna honderd verschillende toegestane attributen. De basisvocabulaire bevat tegen de 600 items, en daar komen er via officiële uitbreidingen nog bijna 200 bij. Wil je bijvoorbeeld je scriptie voorzien van de juiste metadata, dan kun je daar Thesis voor gebruiken. Deze staat op http://bib. schema.org gedefinieerd. Alle kernbegrippen en de officiële uitbreidingen hebben een canonical URL, die achter de root van schema.org wordt geplakt. Een voorbeeld: http://schema.org/Restaurant. Ondanks deze grote verzameling zitten er nog wel wat gaten in. Een yoga-instructrice of modeltreinenshop zal moeite hebben om hun aanbod te beschrijven.
Google-Schema
De Google zoekfunctie verleidt je om Schema.org te gebruiken. Als je dat toepast, heeft je site meer kans om in de zoekresultaten als Rich Snippet te verschijnen. Normaal gezien bevatten zoekresultaten
alleen een titel, URL en korte beschrijvende tekst. Een Rich Snippet verrijkt dit met extra features, bijvoorbeeld breadcrumb-navigatie, een foto of prijzen en datums.
De details hangen voor een deel af van de betreffende categorie content. Bij recepten, events, producten, reviews of cursussen krijg je veel extra. Maar ook bloggers, retailers en bedrijven kunnen rekenen op een speciale behandeling bij artikelen, boekpresentaties, muziek, video's, podcasts, adresgegevens en nog veel meer.
De hitcounter kan zelfs al een zoekbox bevatten. Voor zo'n Sitelinks Search Box moet je wel een zoekmachine voor je eigen website-content hebben. En als je helemaal grandioos scoort in de zoektreffers kun je in de Knowledge Graph met de juiste opmaak je Knowledge Graph-kaart verrijken met belangrijke gegevens. Dit lijkt op een beknopte Wikipedia-entry en verschijnt op je desktop naast en op je smartphone boven de lijst met zoektreffers.
Google heeft sinds maart er weer een schepje bovenop gedaan: de content van Rich Snippets wordt op mobiele apparaten zeer opvallend weergegeven. Een Rich Card kan de scherminhoud van een smartphone vullen en lijkt meer op een productpresentatie of Pinterestpost dan een saaie kale Google-treffer. Zet je ook nog eens AMP in, dan kan je site in de Top Stories-carrousel belanden.
Overigens is Schema.org niet alleen relevant voor SEO. Via de Knowledge Graph Search API antwoordt Google op zoekqueries van derden met gestructureerde data in het JSON-LD-formaat volgens Schema. org. Deze gegevens zijn weer met wat programmeerwerk verder te bewerken.
Open Graph
Wat Schema.org voor zoekmachines regelt, regelt Open Graph voor social media. Dit geldt vooral voor Facebook, maar ook Pinterest, LinkedIn of Google+. De naam Open Graph staat voor het uitbreiden van de Social Graph, het netwerk van relaties binnen sociale netwerken tot willekeurige objecten op het web. Een simpele websitebeschrijving ziet er zo uit:
Open Graph-tags moeten in de head staan en gebruiken de RDFa-syntaxis. De vier tags hierboven voor de titel, soort content, canonical URL en image URL zijn vereist. Daarnaast moet je in RDFa-stijl de og.namespace definiëren.
Voor og:type stelt Open Graph een hele rits met default waarden tot je beschikking: "website", "article", "book", "profile", "video" en "audio". Die laatste twee zijn nog verder te specificeren, bijvoorbeeld in "music. song" of "video.movie".
De optionele eigenschappen zijn onder andere og:description (omschrijvende tekst), og:locale (bijvoorbeeld "nl_NL"), og:video en og:audio voor aanvullende multimedia content. Die laatste twee bieden opties om het nog specifieker aan te geven, zie het voorbeeld van YouTube op pagina 74: