Snellere mobiele sites dankzij AMP voor Drupal

Drupal, AMP, Inbound Marketing, content
Written by Jeroen Marinus

Wie de grote marketingblogs volgt of dagdagelijks bezig is met digital marketing, is vast al in contact gekomen met de term 'AMP'. AMP staat voor Accelerated Mobile Pages, extra snelle, voor mobiele toestellen aangepaste varianten van site pages. We leggen verderop uit waarom AMP essentieel wordt voor je digital marketing.

Wat is AMP? 

De bedoeling van Google is om er dankzij AMP voor te zorgen dat webpagina's met rich content (teksten, foto's, video's...) extra snel laden op mobiele toestellen. Dit om niet alleen de gebruikte bandbreedte te beperken, maar vooral om de gebruikerservaring op die toestellen te verhogen. Mobiele sites die anders soms na 3-4 seconden laden, worden in een AMP-variant vaak in een fractie daarvan geopend. Om dat effect te bewerkstelligen, heeft Google een nieuw open source framework ontwikkeld. 

AMP-voorbeeld.png

Dit alles vanuit het idee dat het mobiele deel van het internet enkel beter kan worden, als het ook sneller werkt. Een idee dat mee werd ingegeven door heel wat onderzoek door Google. Enkele punten die uit dat onderzoek naar voor kwamen (op basis van Google Analytics- en DoubleClick-analyses van meer dan 10.000 mobiele sites), zijn volgende:

  • 53% van de mobiele bezoekers van je site haken al meteen af, als de site langer dan 3 seconden nodig heeft om te laden
  • de gemiddelde laadtijd op een 3G-netwerk is 19 seconden
  • het gemiddelde aantal server requests van mobiele sites is 214, wat voor heel wat dataverkeer zorgt

Dit soort elementen verklaart mee waarom AMP voor Google zo belangrijk is.

Wat is de impact op uw digital marketing?

De SEO-specialisten van Moz vatten het mooi samen in deze blogpost: AMP wordt heel erg belangrijk. Google hamert al een tijdje ontzettend hard op mobiel-vriendelijkheid en een lage laadtijd op mobiele sites, met betere rankings in de zoekresultaten als direct gevolg. Maar wat is nu de concrete impact op je online marketing? Een paar elementen:

  • 'Voorrang' voor AMP-content in de zoekresultaten
  • AMP zal goede content (op blogs, bijvoorbeeld) nog belangrijker maken
  • De grote data-spelers zijn bezig met analysesystemen voor AMP-content
  • Dankzij het open-source karakter van de technologie, mogen we ons aan blijvende evoluties verwachten
  • AMP implementeren betekent ook uw bestaande HTML analyseren en opwaarderen. Betere code en sitestructuur (en content) zijn net als AMP belangrijke SEO-factoren.

Hoe zit het eigenlijk met AMP en uw Drupal-site?

AMP implementeren in Drupal 7 of Drupal 8 kan zonder al te veel moeilijkheden. De community heeft namelijk door middel van een werkgroep een set van tools ontwikkeld om AMP op een eenvoudige manier mogelijk te maken binnen Drupal.

Deze tools zijn:

  • de Drupal AMP module
  • het AMP basisthema
  • een PHP library die HTML code omvormt tot valide AMP code

Deze drie tools werken samen en zorgen ervoor dat de content van een website omgevormd kan worden om conform te zijn met de AMP-standaard. Deze tools opzetten kan je samenvatten in 3 grote stappen:

1. Bepalen welke content je in AMP moet tonen

Om AMP binnen Drupal toe te passen moet je de technologie activeren per content type. Als eerste stap denk je dus best even na over welke content je als AMP wil gaan tonen. Niet alle content in een website is toegelaten of heeft een AMP-versie nodig. Zo zijn formulieren niet toegelaten en heeft een AMP-versie van enkel een headerafbeelding niet veel zin. Pagina's met veel content zijn hier prioritair.

2. De tools installeren en configureren

Nu je weet welke content je wel en niet wil tonen in een AMP-versie, kunnen we de tools installeren en configureren. Als eerste activeer je de technologie voor de content types die je een AMP-versie wil geven. Dit geeft je voor elk content type een extra 'view mode' waarin je kan bepalen hoe die content getoond moet worden. Je krijgt daarmee de mogelijkheid om in de AMP-versie van de content bepaalde stukken niet of net wél te tonen tegenover de niet-AMP-versie. Zo kun je bijvoorbeeld net dat ene element dat niet toegelaten is binnen AMP verbergen, zodat je de rest van de content toch kan tonen. Daarnaast kun je in de configuratie van de module ook je Google Analytics, Google AdSense en Google Doubleclick ID's instellen.

3. Re-design/styling van thema voor AMP

De implementatie van AMP voor Drupal gebruikt een apart thema om ervoor te kunnen zorgen dat alle HTML code binnen de standaard blijft. Het meegeleverde basisthema is uiteraard leeg en is niet bedoeld om rechtstreeks te gebruiken.

De bedoeling is om een nieuw designthema aan te maken dat verder bouwt op het bestaande basisthema. Om het er correct uit te laten zien en binnen de AMP-standaard te laten passen is er uiteraard wat design- en stylingwerk vereist.

Na deze drie stappen zijn de AMP-versies van de content beschikbaar via een aangepaste URL. In het geval van Drupal is dat door een '?amp' parameter toe te voegen aan de bestaande URL. De module zal er ook voor zorgen dat er in de code van de normale versie van de pagina een verwijzing wordt gelegd naar de AMP-versie. Op deze manier kan Google tijdens het crawlen van de site de AMP-versies ontdekken.

Nog een belangrijk aandachtspunt: Eén van de drie tools, de PHP library, dient om normale HTML code in de pagina te behandelen en om te vormen tot HTML code conform de AMP standaard. Doordat niet alle HTML-tags toegelaten zijn, zou het kunnen dat deze library een deel code gaat verwijderen waardoor bepaalde functionaliteiten anders, foutief of zelfs helemaal niet meer kunnen gaan werken. De impact voor de meeste sites zal echter uiterst beperkt blijven.

Benieuwd of uw site en digital marketing voordeel kunnen doen bij de implementatie van AMP? Mia ontwikkelde een basispakket om u snel en optimaal te kunnen helpen. Contacteer snel onze specialisten voor meer informatie!

contact opnemen met Mia