Wat is AMP?

Het World Wide Web is vervuild met ontelbare mobiele websites die zo traag zijn dat ze ons geduld behoorlijk op de proef stellen. Dat is een groot probleem, zeker gezien het feit dat we tegenwoordig meer gebruik maken van mobiele apparaten zoals smartphones en tablets dan van desktop computers en laptops. Daarom heeft Google, in samenwerking met een aantal andere bekende technologiebedrijven, een nieuw initiatief gelanceerd: het AMP Project.

Wat is AMP en hoe werkt het?

AMP is een afkorting van Accelerated Mobile Pages. Het is een open source framework waar mobiele websites op ontwikkeld kunnen worden. Wat AMP precies doet is eigenlijk heel simpel: het zorgt ervoor dat een webpagina ontdaan wordt van alle overbodige content, zodat de ‘uitgeklede’ versie van de pagina zo snel mogelijk aan de gebruiker getoond kan worden. Met andere woorden: AMP zorgt ervoor dat alleen de essentie van een webpagina wordt weergegeven.

Wanneer een standaard webpagina een AMP-equivalent heeft, wordt er in de broncode van de standaard webpagina een link naar de AMP pagina geplaatst. Omdat de meeste AMP pagina’s bijzonder snel te vinden zijn door webcrawlers, kunnen zoekmachines en doorverwijzende websites ervoor kiezen om naar de AMP versie van een webpagina te linken in plaats van naar de standaard versie.

Hoe wordt een AMP website gebouwd?

Op een AMP pagina kan men slechts een beperkte hoeveelheid technische features toepassen; alleen op die manier kunnen die supersnelle laadtijden gerealiseerd worden. Zo zijn bepaalde animaties bijvoorbeeld niet toegestaan.

Het AMP framework is opgebouwd uit drie belangrijke componenten:

  • AMP HTML
    Dit component is in feite standaard HTML, alleen dan met een aantal restricties om een meer betrouwbare performance te realiseren
  • AMP JS
    Dit JavaScript component zorgt ervoor dat de AMP HTML pagina’s snel gerenderd kunnen worden 
  • AMP Cache
    Dit component is in staat om gecachete AMP pagina’s te ‘serveren’ 

AMP pagina’s werken ook met CSS, wat nodig is om de opmaak van de webpagina te bepalen. Maar in tegenstelling tot bij een doorsnee website staat die CSS niet in externe stylesheets. Dat werken zonder externe stylesheets is voor veel web ontwikkelaars best gek; zij hebben altijd geleerd om content en opmaak te scheiden. Maar wie de specificaties van AMP een beetje door heeft gelezen, weet dat het plaatsen van CSS in de HTML voor een betere performance zorgt. Om het uiterlijk van de pagina te bepalen, dient men gebruik te maken van de <style amp-custom> tag. Deze tag staat binnen de <head> van de HTML. Dat ziet er in de broncode van een webpagina ongeveer zo uit:

<html>

<head>

<meta charset="utf-8">

<link rel="canonical" href="index.html" >

<style amp-custom>

/*Hier komt de CSS */

body {

background-color: white;

}

</style>

<script async src="https://cdn.ampproject.org/v0.js"></script>

</head>

<body>Hier komt de content van de webpagina te staan</body>

</html>

Wat is het doel van AMP?

Zoals gezegd is het AMP Project opgezet om de prestaties van mobiele websites te verbeteren en zo een betere gebruikerservaring te realiseren. Een ander voordeel is dat code voor meerdere platformen en apparaten gebruikt kan worden. Dankzij AMP is het dus niet meer nodig om voor elk apparaat een aparte versie van een website te ontwikkelen. Er kan gewoon één website worden gebouwd die er op alle apparaten goed uitziet en snel laadt. 

Wat zijn de voordelen van AMP?

Dankzij het AMP Project is het mogelijk om websites te ontwikkelen die veel sneller laden. Op die manier kunnen we met zijn allen bijdragen aan een sneller mobiel web. Onderzoek heeft uitgewezen dat mobiele websites die draaien op het AMP framework maar liefst vier keer sneller laden, en de data zelf tot wel acht keer sneller. Hierdoor krijgen uw bezoekers een veel meer gebruiksvriendelijke ervaring, en zullen bezoekers uw website minder snel wegklikken (uw bounce rate gaat omlaag). En dat kan weer leiden tot meer conversies en dus meer winst.

AMP versus andere frameworks

Het AMP Project is natuurlijk niet het enige framework dat speciaal gebouwd is om mobiele websites te optimaliseren. Het wordt vaak vergeleken met Facebook Instant Articles en Apple News; alle drie werden in 2015 aangekondigd met het doel om te zorgen dat mobiele content sneller en makkelijker te consumeren zou worden. AMP biedt echter veel voordelen ten opzichte van andere soortgelijke frameworks. Ten eerste worden AMP sites direct door Google gecached, zonder dat ontwikkelaars hiervoor hoeven te betalen. Daarbij profiteren AMP sites van een grote boost in de mobiele zoekresultaten van Google. Het AMP project wordt bovendien ondersteund door een indrukwekkend aantal grote tech bedrijven, waaronder Twitter, Pinterest, Adobe Analytics, LinkedIn en WordPress.

Zijn AMP pagina’s echt zo snel?

Volgens Google laden de AMP pagina’s die in de zoekresultaten van Google worden weergegeven in minder dan 1 seconde, en verbruiken ze 10 keer minder data dan hun niet-AMP equivalenten. Maar concrete cijfers zijn altijd beter, en die zijn er volop: 

  • Gizmodo beweert dat AMP pagina’s drie keer sneller laden dan niet-AMP pagina’s.
  • Myntra, de grootste webwinkel voor mode in India, merkte na implementatie van AMP dat de algehele laadtijd met 65% en hun bounce rate met 40% gereduceerd was.
  • Events Ticket Center, een online marktplaats voor tickets voor concerten en sportevenementen, had voorheen pagina’s met laadtijden van 5 tot 6 seconden. Na implementatie van AMP laden hun pagina’s binnen net iets meer dan een seconde. 

Dit zijn slechts enkele voorbeelden, maar ze laten wel zien dat alle soorten websites baat hebben bij AMP. Het maakt niet uit of het gaat om nieuws sites, media sites, e-commerce sites of online marktplaatsen.

Zitten er ook nadelen aan AMP?

AMP websites moeten aan een aantal strikte richtlijnen voldoen. Die richtlijnen zijn misschien niet voor iedereen haalbaar. Gelukkig zijn de richtlijnen wel heel goed gedocumenteerd door Google; met de hulp van een AMP specialist moet het dan ook niet al te lastig om over te stappen.

Waarom is AMP integratie zo belangrijk?

Wanneer de voordelen van AMP u nog niet overtuigd hebben om AMP te integreren, dan moet u weten dat Google haar algoritmes inmiddels heeft aangepast om AMP websites hoger te laten scoren in de zoekresultaten. Met andere woorden: websites die geen gebruik maken van AMP worden benadeeld en zullen op een lagere positie in de zoekresultaten worden weergegeven. Dit moet voor u een goede drijfveer zijn om ook met Accelerated Mobile Pages aan de slag te gaan. 

Tot slot

Het AMP Project is in de afgelopen 3 jaar enorm gegroeid, en heeft het mobiele web compleet getransformeerd. Sommige tegenstanders maken zich nog steeds zorgen over de rol en de motieven van Google met betrekking tot het AMP Project. Ze zijn bang dat Google het project wil misbruiken om de werking van het mobiele web te beïnvloeden, en meer inkomsten uit advertenties te genereren. Maar Google heeft dit altijd stellig ontkend. “Het is niet zo dat we AMP hebben uitgevonden omdat we alles willen controleren, zoals mensen denken,” zei David Besbris, VP of Search Engineering bij Google. Hij verzoekt ons terug te denken aan hoe slecht de staat van het mobiele web er een paar jaar geleden uitzag, voor de geboorte van AMP. Nilay Patel beschreef het goed in zijn artikel “The mobile web sucks”, dat in 2015 op TheVerge.com verscheen. Hij had gelijk. Apple en Facebook probeerden er iets aan te doen door bedrijfseigen formats te creëren, en vervolgens uitgevers te overtuigen om hun nieuws in die formats op hun platformen te distribueren. Google’s oplossing was AMP, dat een open source oplossing biedt voor alle websites. Maar zoals Madhav Chinnappa, Google’s Director of Strategic Relations, verklaarde: “Ik raak een beetje geërgerd als mensen het Google’s AMP noemen, want dat is het niet… AMP is gecreëerd als een open source initiatief, en volgens mij is dat de reden dat het succesvol is.” 

Geïnteresseerd?

Heeft u interesse in een van de diensten die wij aanbieden? Vraag direct een offerte aan, we behandelen uw aanvraag zo snel mogelijk.

Direct offerte aanvragen


Gerelateerde pagina's