Accelerated Mobile Pages (AMP)

Die Accelerated Mobile Pages, oder auch kurz AMP, heben die Surferfahrung von Nutzern mobiler Endgeräte auf ein neues Level. Das ist zumindest der Plan, der hinter der jüngst veröffentlichten Technologie des Suchmaschinen-Giganten Google steckt. Hintergrund des Open-Source-Projekts, dessen Entwicklung auf der Webplattform GitHub vorangetrieben wurde (und auch weiterhin wird), sind die bereits erschienenen ähnlichen Dienste der Konkurrenten Apple (Apple News) und Facebook (Instant Articles). Außerdem spielt das im Rahmen der Digital News Initiative (DNI) beschlossene Vorhaben, den digitalen Journalismus in den kommenden Jahren gezielt zu fördern, eine wichtige Rolle. Wie funktionieren die neuen mobilen Seiten? Und wer kann von ihnen Gebrauch machen?

Was steckt hinter den AMP?

Eine kurze Ladezeit ist eines der wichtigsten Qualitätsmerkmale einer modernen Internetseite. Da ein großer Teil des Internetverkehrs mittlerweile auf mobilen Endgeräten und auf Basis einer mobilen Datenverbindung stattfindet, suchen Webentwickler unentwegt nach Lösungen, die mobile Ansicht zu optimieren. Mit den Accelerated Mobile Pages bietet sich nun eine weitere Option für statische Webinhalte. Diese optimierten Seiten zeichnen sich durch einen speziellen HTML-Code aus, dem Google den Namen AMP HTML gegeben hat. Mit diesem Code programmierte Artikel werden beim Aufruf in zwei Schritten geladen:

Direkt nach dem Klick des Nutzers laden zunächst die elementaren Einheiten der Seite, etwa das festgelegte Layout.
Die weiteren Inhalte wie Text, Bilder und externe Ressourcen laden je nach Priorität im Hintergrund nach. So können User bereits durch den Text scrollen, bevor beispielsweise das Titelbild geladen wurde.

Neben dem AMP-HTML-Code sind die zum Projekt gehörende JavaScript-Bibliothek (AMP JS library), der Google AMP Cache sowie ein schlankes CSS (kleiner als 50 KB) für die technische Umsetzung verantwortlich. Die Besonderheiten der einzelnen Komponenten stellen wir Ihnen im Kurzüberblick vor:

AMP HTML

Der HTML-Code der Accelerated Mobile Pages unterscheidet sich vom regulären HTML insofern, dass einige standardmäßige Tags durch AMP-Tags ersetzt werden. Das gilt insbesondere für die Auszeichnung multimedialer Inhalte, die auf diese Weise erst geladen werden, wenn der Nutzer sie benötigt. So findet sich im AMP-HTML-Code z. B. der Tag <amp-img> anstelle von <img>, um ein Bild einzubinden. Eine Gesamtübersicht über die Tags der mobilen Google-Seiten finden Sie im AMP-Projektbereich auf GitHub.

AMP JS library

Die projekteigene JavaScript-Bibliothek verwaltet das Laden sämtlicher Website-Elemente. Alle externen Ressourcen verarbeitet sie asynchron, sodass der Rendering-Prozess ungestört von äußeren Einflüssen stattfindet. Ferner wird das Ausführen von IFrames-Elementen im Sandbox-Modus unterstützt, wodurch sich die Rechte der externen Betreiber einschränken lassen. Weitere Performance-Techniken sind die Vorkalkulation des Layouts oder das Blockieren langsamer CSS-Selektoren.

Google AMP Cache

Optional bietet Google ein hauseigenes proxybasiertes Content Delivery Network zur Auslieferung der Accelerated Mobile Pages an. Zu diesem Zweck werden alle relevanten AMP-HTML-Seiten im Cache gespeichert und automatisch optimiert. Durch die Dienste des CDN liegen alle relevanten Daten – die Seiten sowie alle JavaScript-Dateien und Bilder – an einem zentralen Ort. Zusätzlich nutzt der Cache HTTP/2 und überprüft die Funktionalität der mobilen Seiten.

Das bedeutet der Einsatz der Accelerated Mobile Pages

Bis dato richtet sich Google mit der neuen Wunderwaffe explizit an Zeitungsverlage und Blogplattformen wie WordPress bzw. deren Betreiber. Zu den offiziell aufgelisteten Startpartnern im Februar 2016 gehörten u. a. die Tagesschau, Sport1 oder die Süddeutsche Zeitung. Allgemein ergeben sich für alle Teilnehmer, die außerdem im Google-Newsfeed gelistet sind, folgende Vorteile durch die mobilen Seiten und die im Rahmen des AMP-Projektes angepasste Google-Suche:

bessere Positionierung im Nachrichten-Überblick, da AMP-Artikel als „Top Stories“ hervorgehoben werden
geringere Absprungraten bei Nutzern mobiler Geräte durch die schnelle Ladezeit der optimierten News
besseres Ranking der Website aufgrund der exzellenten Mobile-Optimierung, auch wenn die generelle Verwendung von Accelerated Mobile Pages laut Google keinen Ranking-Faktor darstellt

Für wen eignen sich AMP?

Die entscheidende Rolle, die die modernen mobilen Seiten in den Google-News spielen, macht ihren Einsatz für alle ambitionierten Zeitungsverlage und Blogbetreiber zum Pflichtprogramm. Diese profitieren im Gegensatz zu nicht teilnehmenden Konkurrenten von einer höheren Reichweite, zufriedeneren Lesern und einer besseren Bewertung durch Google dank einer optimierten Mobilpräsenz. Der zu leistende Aufwand ist vergleichsweise gering: WordPress bietet seinen Bloggern beispielsweise die automatische Umstellung auf eine AMP-Version ihres Webauftritts an, wenn dieser direkt vom WordPress-Unternehmen Automattic gehostet wird. Die Umstellung für selbst gehostete Blogs funktioniert problemlos mithilfe des WordPress-AMP-Plug-ins. Im Gegensatz zu den meisten Google-Diensten behält der Nutzer bei den Accelerated Mobile Pages außerdem die Kontrolle über seine Daten. Einzig die zwischengespeicherte Version (im Google AMP Cache) wird auf die Server des amerikanischen Unternehmens ausgelagert.

Es ist anzunehmen, dass Google die Accelerated Mobile Pages auch in Zukunft tatkräftig unterstützen wird, was die neue Technik langfristig für jeden interessant macht, der bei Google gefunden werden möchte. In Kombination mit der hervorragenden Geschwindigkeitsoptimierung könnten die modernen Mobilseiten dabei vor allem für den E-Commerce eine höchstinteressante Lösung werden. Insbesondere die Nutzererfahrung beim digitalen Einkauf mit mobilen Geräten könnte durch die AMP-Technik in bisher unerreichte Sphären vordringen.

Tipp: Hier können Sie kostenlos die mobile-Performance Ihrer Website checken:

Website-Check