06082 928047Anfahrt

AMP: Accelerated Mobile Pages

Accelerated Mobile Pages(kurz AMP) ist ein von google initiiertes Projekt zur Beschleunigung der Auslieferung von Webseiten. Im Vordergrund stehen dabei mobile Webseiten. Grundsätzlich können aber auch Desktop-Versionen mit AMP programmiert werden. Der Suchmaschinenbetreiber verfolgt mit AMP das Ziel, das Surf-Erlebnis(=User Experience) mit mobilen Endgeräten deutlich zu verbessern. Laut Statistik zahlt sich das auch für die Webseiten-Betreiber aus;

Siehe: https://www.thinkwithgoogle.com/marketing-resources/experience-design/mobile-page-speed-website-load-time/

Wir möchten in diesem Artikel einen kleinen Überblick über AMP geben und aufzeigen, warum AMP auch für TYPO3-Website-Betreiber nicht nur möglich sondern auch empfehlenswert ist.

AMP ist - sehr vereinfacht ausgedrückt - ein abgewandeltes HTML, das aufgrund der unten beschriebenen Technik extrem schnell ist/wirkt. Da AMP diversen Einschränkungen unterliegt und nicht zwingend von jedem Browser unterstützt wird, ist die häufigste Lösung, zwei Versionen der Website auszuliefern: einmal im bisherigen HTML-Format und einmal im AMP-Format. Beide Seiten-Typen sind jeweils gegenseitig verknüpft, so dass die Suchmaschine entscheiden kann, welche Variante sie verlinkt(z.B. AMP auf mobilen Geräten und HTML auf Desktop-Systemen). Das ist vor allem auch vor dem Hintergrund der Browserkompatibilität noch relativ wichtig.

Wie funktioniert AMP?

AMP basiert im wesentlichen auf drei Säulen:

  • AMP-HTML und Restriktionen an die Verwendung von HTML/CSS und JavaScript
  • AMP-JS: JavaScript zur Abbildung der gesamten Logik und damit u.a. zum optimierten Ressourcenmanagement
  • AMP-Cache: auf CDN-Servern von google werden die Seiten zwecks kurzer Ladezeiten gespeichert

Besonders schnell werden die Seiten durch zwei Konzepte:

Pre-rendering

Im Suchergebnis von google wird der erste Viewpoint(also der Teil der Seite, der auf dem jeweiligen Display ohne zu scrollen sichtbar sein muss, auch bekannt unter dem Namen "above-the-fold-content") von AMP-Seiten mit hoher Klickwahrscheinlichkeit geladen, ohne dass der Besucher etwas davon mitbekommt(über einen sogenannten "hidden iframe"). Klickt der Besucher dann auf einen solchen Link, ist die Seite SOFORT da. 

Wenn also in der google-Suche ein Suchbegriff eingegeben wird:

  • sucht google die für diesen Begriff qualifizierten Links(=Suchergebnis)
  • kalkuliert(aufgrund des Besucherprofils) auf welche Links der Besucher mit hoher Wahrscheinlichkeit klicken wird
  • lädt den "above-the-fold-content" dieser Seiten, der mit dem Display des Besuchers korrespondiert

Da die Seiten aus Sicherheitsgründen nur aus dem google cache geladen werden, haben Sie eine andere URL, was zu erheblicher Kritik geführt hat.

Besipiel:

Die AMP-Seite www.wacon.de/news_artikel.html wird im google-Suchergebnis so angezeigt:

www.google.com/amp/wacon.de/news_artikel.html

Hintergrund ist einerseits die Tatsache, dass noch gar nicht klar ist, ob die Seite überhaupt aufgerufen wird und Analyse-Tools somit falsche Daten aufnehmen würden. Und zweitens, dass google nur den Seiten vertraut, die schon im AMP Cache liegen, da diese auf jeden Fall auf Validität geprüft wurden. 

Dynamisches Laden von Ressourcen

AMP läd nur die Bilder(oder andere Ressourcen), die tatsächlich gerade angezeigt werden müssen("Above the Fold"). Wenn der User also nach unten scrollt, werden die dann anzuzeigenden Bilder auch erst geladen. Dadurch wird der erste Aufruf der Seite extrem beschleunigt. Diese Methode wird in ähnlicher Form bereits seit längerem - unabhängig von AMP und google - mit JavaScript angewendet und nennt sich Lazy Loading.


Technische Vorgaben

Die wichtigsten technischen Aspekte im Kurzüberblick:


Welchen Nutzen kann AMP für eine TYPO3-Website haben?

AMP wurde ursprünglich entwickelt, um die Seiten von Publishern auf mobilen Endgeräten zur Verfügung zu stellen. Tatsächlich stehen diese auch unter Druck, AMP-Seiten alternativ zu normalen Seiten anzubieten. So kommen z.B. in das News-Carousel von google nur AMP-Seiten(erkennbar an dem Blitz rechts oben im News-Teaser):

Über kurz oder lang werden jedoch nicht nur Verlagshäuser sondern alle professionellen Webste-Betreiber, die an einem guten Ranking interessiert sind, AMP implementieren müssen. Auch ohne die Notwendigkeit in den News-Ergebnissen erscheinen zu müssen. Grund hierfür ist die immer stärkere Fokussierung von Suchmaschinen, auf schnelle mobile Webseiten. Aktuell unterhält google noch zwei verschiedene Indizes: einen für die Suche vom Desktop, einen für die mobile Suche. Der Suchmaschinenbetreiber, hat aber bereits angekündigt, bald nur noch den mobilen Index als Hauptindex weiterführen zu wollen. Gleichzeit wird immer wieder betont, wie wichtig die Optimierung der Website für mobile Endgeräte ist. U.a. auch die Seitengeschwindigkeit. 

Auch mit TYPO3 ist die Auslieferung von AMP-Seiten möglich! Sollten Sie also das Content Management System TYPO3 im Einsatz haben, können wir Sie als Internetagentur diesbezüglich beraten und Ihnen konzeptionelle Lösungen anbieten und auch realisieren. 

Technisch wird die AMP-Integration über eine if-condition im TYPOSCRIPT-Template realisiert, so dass derselbe Inhalt in zwei verschiedenen Versionen(HTML und AMP) ausgeliefert werden kann. Der Redakteur hat bei dieser Lösung keine zusätzliche Arbeit. Wie das genau funktioniert, erklären wir Ihnen gerne in einem persönlichen Gespräch.


Links

Offizielle Projekt-Website: https://www.ampproject.org/

Schnelleinstieg und Templates zum selber bauen: https://www.ampstart.com

Sie möchten die Sichtbarkeit Ihrer TYPO3-Website und die User Experience für Ihre Besucher mit AMP verbessern? Dann kontaktieren Sie uns einfach über unten stehendes Schnellkontakt-Formular und wir werden uns umgehend bei Ihnen melden. Für Besuche im Rhein-Main-Gebiet fallen dabei keine Kosten an.