01
apr
2016
Miller Digital blog - Online strategie

Accelerated Mobile Pages , handig voor mijn website! Of toch niet?

Je hoort van een collega dat er iets nieuws is gevonden op Mars. Je pakt direct je smartphone en zoekt op Google naar 'Mars'. Je ziet een aantal mogelijkheden uitgestald aan de bovenkant en wanneer je deze aantikt heb je het betreffende artikel direct tot je beschikking zonder merkbare laadsnelheid. Handig!

Tegenwoordig is laadsnelheid een grote factor in de populariteit van je website. Afgezien van het feit dat je website door Google benadeeld wordt als die langzamer laadt dan andere websites, wat al destructief op zich kan zijn, haken bezoekers ook nog eens af als het laden in hun ogen te lang duurt. Je website laadt op een smartphone altijd iets langzamer wanneer deze niet met het Wi-Fi verbonden is. Dat resulteert in het feit dat Google heeft besloten dat een website die voor de smartphone geoptimaliseerd is altijd voorrang krijgt bij de bezoeker.

Accelerated Mobile Pages

Aan het eind van 2015 is er in samenwerking met Google en Twitter een project genaamd Accelerated Mobile Pages (AMP) geïntroduceerd welke het langzame laden van websites op smartphones aan de kaak stelt en er tevens een oplossing voor biedt. Je maakt een sterk versimpelde versie van je pagina waar alleen tekst, een paar kleine afbeeldingen en een beperkte hoeveelheid styling op te vinden is en Google slaat deze versie op. Wanneer je pagina dan op Google getoond wordt, krijg je onder het kopje “Top stories” een galerij van afbeeldingen en titels met daaronder de tekst “AMP”.

Links het zoekresultaat, rechts de AMP-pagina die zonder laadtijd getoond wordt

Door deze aan te tikken wordt alles getoond wat de tekstuele pagina zou moeten laten zien. Zo is het niet mogelijk om scripts van derden of formulieren te tonen. AMP is namelijk bedoeld voor tekstuele pagina's waar niets meer op verandert. De pagina wordt uitgelezen en opgeslagen (gecached) waardoor het mogelijk is om de pagina zeer snel uit te laden en te tonen.

AMP werkt door een extra pagina op je domeinnaam te zetten en hiernaartoe te linken in de voor de gebruiker onzichtbare informatie (met een link-tag in de) van je website. Zo krijg je bijvoorbeeld dat blogpost.html in de code toont dat blogpost-amp.html ook bestaat. Op deze pagina staat de basis voor elk HTML-document (zoals deen de), maar zijn een aantal andere HTML-tags vervangen. Een voorbeeld is een afbeelding, die normaal gesproken met wordt geladen, maar nu met . De tags worden op een andere manier getoond op basis van een berekende prioriteit en de schermresolutie.

Eigenlijk biedt AMP dus een makkelijke en gedocumenteerde manier aan om je pagina's sneller aan de bezoeker te presenteren. Het verschil met een voor de smartphone geoptimaliseerde website, met bijvoorbeeld een responsive design, is dat er twee verschillende pagina's op internet te vinden zijn met dezelfde inhoud: de gewone versie die door iedereen met een internet browser te zien is en de AMP versie die alleen zichtbaar is in de Google zoekresultaten.

Voor- en nadelen

AMP is momenteel nog niet veelgebruikt. Als AMP door meer mensen wordt gebruikt bestaat de kans dat het in het verloop van de komende jaren wordt uitgebreid, verbeterd en versneld. AMP is namelijk open source, wat betekent dat iedereen er gratis een bijdrage aan kan leveren. Dit is een voordeel voor de openheid en eerlijkheid van het project; iedereen kan de code immers inzien.
De AMP-pagina wordt van je eigen domein uitgelezen en gecached op de servers van Google. Deze gecachte versie wordt gebruikt om de pagina te tonen in de zoekresultaten. Dit houdt in dat een op social media gedeelde link naar de AMP-pagina altijd doorlinkt naar het domein van Google waardoor het verkeer naar die pagina niet naar jouw eigen domein gaat. Hierdoor wordt het op dit moment lastig om dit verkeer te meten.

Zoals eerder gezegd wordt door AMP de laadsnelheid voor je pagina enorm verhoogd omdat er veel minder wordt geladen. Ook zorgt AMP voor een iets betere SEO via Google omdat je pagina bovenaan de zoekresultaten te zien is. Dit kan betekenen dat je pagina in de toekomst zelfs lager dan andere pagina's in Google komt wanneer je geen AMP gebruikt. Het kan wel een groot nadeel zijn dat er zo weinig op je AMP-pagina te vinden is. Veel blogs en websites gebruiken de reactieservices van Disqus of Facebook; dit is niet meer toegestaan door het verbod op scripts van derden. Het is echter wél mogelijk om Google Analytics en advertenties op de pagina te plaatsen.

Het is een groot voordeel dat deze dienst volledig gratis te gebruiken is. Hierdoor kun je door een klein beetje tijd in de pagina te steken een boost krijgen in je SEO zonder hier periodiek voor te betalen. In combinatie met advertenties is het dus mogelijk om met AMP extra verdiensten te maken. De willekeurigheid waarmee de resultaten getoond worden is wel een probleem. Zo kan het zijn dat de AMP-resultaten bij de ene zoekopdracht voor “The Netherlands” wel te zien zijn, maar bij dezelfde opdracht die tien minuten later is uitgevoerd niet, terwijl daar geen duidelijke reden voor is.

De concurrenten

AMP is tevens een aanval op hoe Facebook en Apple hun Facebook Instant Articles en Apple News hebben geïntroduceerd. Deze twee platformen komen op hetzelfde neer als AMP, waar pagina's worden omgezet naar smartphone-vriendelijke pagina's, maar zijn verschillend in hun uitvoering. Zo worden Facebook Instant Articles alleen aan gebruikers van de mobiele app van Facebook getoond en is Apple News alleen zichtbaar voor gebruikers van iPhone en iPad. Daardoor is de markt voor deze twee platformen kleiner dan die van AMP. Een ander groot verschil is het feit dat AMP open source is en dat Facebook Instant Articles en Apple News afgesloten zijn; een ontwikkelaar weet dus nooit precies wat hij bij de twee concurrenten wel en niet kan verwachten.

Waarom zijn deze platformen nodig?

Dat je met deze drie platformen de code van je pagina moet herzien en met specifieke eisen in je achterhoofd moet bewerken betekent dat je veel tijd kwijt bent aan onderzoek en uitvoering. In dat geval zou je net zo goed aandacht kunnen besteden aan het verbeteren van je algehele mobiele ervaring door bijvoorbeeld een responsive design te maken. Mits goed uitgevoerd zou dit de laadsnelheid van je pagina op grotere schaal kunnen verbeteren, in plaats van alleen voor Google, Facebook of Apple.

Websites worden steeds groter omdat ze steeds ingewikkelder worden door bijvoorbeeld scripts, die over het algemeen altijd geladen worden. Voorbeelden hiervan zijn scripts die aspecten van gebruikerservaring kunnen meten (Google Analytics, Hotjar, Lucky Orange, etc.) of die de website wat meer leven in blazen (sliders, menu's, lightboxes, etc.). Ook worden de afbeeldingen steeds groter om grotere schermresoluties te kunnen omvatten. Een pagina waarop een afbeelding van bijvoorbeeld 1600 pixels breed wordt getoond, hoeft deze afbeelding niet op deze breedte te laten zien op een smartphone met een schermresolutie van bijvoorbeeld maar 320 pixels breed, terwijl dit toch vaak wel wordt gedaan.

Verkeerde oplossing voor een grootschalig probleem

AMP, Facebook Instant Articles en Apple News maken gebruik van een probleem in de wereld van mobiel internet. In plaats van een algehele oplossing te bieden, bieden ze een oplossing die alleen voor zichzelf te gebruiken is. Deze oplossingen vragen daarnaast om duplicatie van je inhoud, waardoor er naast een versie van je website (inclusief een responsive layout) ook nog eens een AMP-versie, een Facebook Instant Articles-versie en een Apple News-versie bestaat. Dat kost extra tijd aan onderhoud. Voor commerciële doeleinden zou het geen slecht idee zijn om met deze drie platformen te werken. Echter is het beter voor de algehele gebruikerservaring van de mobiele website om je te focussen op welke inhoud de gebruiker echt moet zien en wat het dus waard is om daar nog een extra seconde op

Heb je vragen over Accelerated Mobile Pages, over responsive layouts en andere manieren om je mobiele gebruikerservaring te verbeteren of over hoe je verder je SEO-positie kan versterken? Laat het ons gerust weten! Stuur mij persoonlijk een bericht via leon@millerdigital.nl

Is dit artikel interessant voor je? Lees meer gerelateerde artikelen
Responsive Technische ontwikkelingen