AMP in WordPress

WordPress
Gijs Hovens, 21 augustus 2017

Misschien heb je er al iets over gelezen: AMP. AMP staat voor Accelerated Mobile Pages en is een project van Google om het internet nog sneller te maken, in dit geval specifiek voor mobiele apparaten. AMP is geen servertechnologie maar een variant op HTML en JS in combinatie met een proxy-cache die door Google wordt beheerd. In AMP worden langzame technieken uitgesloten en worden standaard alle externe resources asynchroon ingeladen. We leggen uit hoe AMP in WordPress werkt en hoe je het installeert.

Als je AMP implementeert ontstaat er een AMP variant van een pagina náást de normale pagina. Deze pagina heeft alle overbodige elementen overboord gegooid waardoor de  AMP variant veel kleiner en sneller in te laden is.

screenshot of accelerated mobile page in search results

 

Voor- en nadelen

Accelerated mobile pages project logoHet voordeel van AMP is uiteraard dat jouw pagina’s sneller worden ingeladen voor mensen met een mobiele device. AMP telt nog niet mee voor de organische ranking. Google laat in sommige gevallen echter wel AMP content zien in een ‘caroussel’ bovenin de resultaten pagina, het gaat dan vooral om nieuws pagina’s maar dit verschuift langzaam naar normale pagina’s. Waarschijnlijk verdwijnt deze caroussel weer als de technologie voldoende geadopteerd is.

Het gebruik van AMP kent nogal wat nadelen. Door AMP op je site te implementeren kunnen diverse essentiële zaken zoals advertenties, tracking, interactiviteit (bijv. comment mogelijkheid) en uitgebreide opmaak verloren gaan in de AMP variant. Inmiddels zijn er meer plugins voor WordPress op de markt die je helpen AMP te implementeren zonder in te leveren op tracking en advertenties.

Google heeft voor sommige advertentienetwerken (waaronder hun eigen advertentie oplossingen) en bedrijven (bijv. social networks als twitter en youtube) integratie al makkelijk gemaakt.

De AMP variant van een pagina is kortom een volledig uitgeklede variant van je normale pagina. Dat is iets wat wij erg jammer vinden want ads zijn vaak essentiëel als verdienmodel en ook interactiviteit is een essentiëel onderdeel van (WordPress) blogs. Daarnaast is de AMP standaard niet open voor elk advertentienetwerk of social network en is het onduidelijk hoe je support voor je eigen platform kunt toevoegen.

AMP in WordPress implementeren

Mocht je ervoor kiezen om AMP in WordPress te installeren dan gaat dat relatief simpel mits je aanvaardt dat je ondersteuning voor een aantal zaken moet loslaten.

Optie 1: Via de Automattic AMP plugin i.c.m. de AMP Glue plugin van Yoast

Automattic heeft een AMP WordPress plugin uitgebracht. Deze plugin zorgt ervoor dat er voor je berichten een AMP variant wordt aangemaakt. Je kunt deze bekijken door /amp/ achter de URL van je bericht te zetten. Daarnaast voegt de plugin een ‘link rel’ metatag toe aan je <head> om aan bijv. zoekmachines te laten weten dat er ook een AMP variant beschikbaar is. Je hebt nu de meest basic implementatie van AMP.

Wil je je AMP pagina’s iets verder tweaken, dan kun je gebruik maken van de AMP Glue plugin van Yoast. Met deze plugin kun je per bericht of paginatype instellen of je er een AMP variant voor wil maken, kun je nog wat design zaken aanpassen zoals kleuren en icoontjes en kun je analytics toevoegen. Let er op dat het toevoegen van een tracking script zeer waarschijnlijk ertoe leidt dat de pagina’s niet meer door de validatie komen. Gebruik je liever geen Yoast, lees dan ons vergelijk van andere SEO-plugins.

Optie 2: Via de AMP for WP plugin

De AMP for WP plugin is een goed alternatief voor optie 1. Hij biedt veel meer opties om op een gebruiksvriendelijke manier design, menu indeling, social sharing buttons, tracking en ads te implementeren. Middels een intuïtief settings-scherm is makkelijk te bepalen of je alleen voor berichten of ook pagina’s een AMP pagina wil creeëren (iets wat de Automattic plugin niet kan). Je kunt daarna op individueel niveau nog bepaalde pagina’s uitsluiten. Ook zijn er diverse betaalde integraties beschikbaar om populaire plugins als ACF en Contact Form 7 compatibel met AMP te maken.

De makers ontwikkelen veel aan deze plugin en brengen regelmatig updates uit met nieuwe functionaliteit.

AMP testen

Nadat je een AMP plugin hebt geconfigureerd is het belangrijk te testen of de pagina’s valideren. Gelukkig heeft Google daar een tool voor gemaakt: de AMP Test. Je kunt als alternatief ook HTML code in ‘The AMP Validator‘ plakken. Daarnaast kun je validatiefouten van AMP ook terugvinden in de Google Search Console.

Conclusie

Wat ons betreft is AMP, zeker voor WordPress, een technologie die potentie heeft maar die nog niet af is. Heb je een nieuwssite of een grote blog? Dan kun je er mogelijk voordelen van plukken. De kans is echter groot dat advertenties en tracking dan essentieel voor je zijn. De huidige plugins maken het relatief eenvoudig om deze zaken te integreren maar vereisen wel het nodige testwerk en configuratie.

Extra Resources:

Smashing Mag
Copyblogger

Gijs Hovens - Gijs is marketing manager bij Savvii. Hij heeft al bijna 10 jaar lang diverse WordPress websites en houdt zich bezig met o.a. SEO, SEA, onze producten en het organiseren van de WordPress Meetup Nijmegen.

Er zijn 2 reacties

Servé Aarts

11 november 2017

Hallo Gijs,

het was me als absolute leek toch gelukt om de AMPforWP plugin te gebruiken, maar toen ik mijn posts via mijn mobiel bekeek, zag ik tot mijn schrik dat de Google-ads niet getoond werden. Ik heb toen via de plugin wat persoonlijke gegevens van mijn Adsense-account toegevoegd, zoals mijn PUB-code. Toch worden de advertenties niet getoond. Wat zie ik over het hoofd?

Nog iets heel anders. In je post komt deze tekst voor: "AMP IN WORDPRESS IMPLEMENTEREN

"Mocht je ervoor kiezen om AMP in WordPress te installeren dan gaat dat relatief simpel mits je aanvaart dat je ondersteuning voor een aantal zaken moet loslaten." Ik wil je op een tikfout attenderen: het is "aanvaardt" (vervoeging van "aanvaarden")

Graag je reactie/advies.

Reageer op Servé Aarts

Gijs Hovens

13 november 2017

> Hallo Servé,

Volgens AMPforWP heb je een betaalde extensie op hun plug-in nodig om AdSense te kunnen tonen: https://ampforwp.com/tutorials/article/step-step-guide-insert-ads-post-content-amp/.

Succes met de implementatie en dank voor je scherpte!

Gr. Gijs

Reactie achterlaten

Leer ons beter kennen!