Erster Eindruck: Blitzschnell geladen mit AMP

Ein kleines Icon neben den Suchbegriffen zeigt einen Kreis mit einem Blitz darin. Gemeint ist, dass diese Seite über die Google Suchmaschine, wenn man mit dem mobilen Gerät dort sucht, blitzschnell geladen wird. Zu diesem Zweck muss von einer Internetseite, die normalerweise in HTML ausgegeben wird eine spezielle Programmierung in der Sprache AMP erfolgen. AMP ist die Abkürzung für "Accelerated Mobile Pages", also beschleunigte mobile Webseiten.

Direkt aus dem Google Cache...

Bei der Anzeige des Ergebnisses landet der Nutzer nicht direkt auf der Webseite und dem eigentlichen Webserver, sondern in einer vorbereiteten speziell präparierten Version der Seite auf den Servern von Google. Der Vorteil daran ist für jeden, der es ausprobiert, schnell zu erkennen. Schnell im wahrsten Sinne des Wortes: Blitzschnell. Die Anzeige einer AMP-Seite ist nach dem Klick auf das Suchergebnis praktisch ohne bemerkbare Verzögerung gemacht. Die Suchmaschine liefert mit ihrer vollen Kraft global die Seite hocheffizient und blitzartig aus.

Weil eine schnelle Ladezeit auch zur besseren Nutzererfahrung beiträgt, hat man mit einer AMP-Version der eigenen Internetseite auch höhere Chancen besser zu verschiedenen Begriffen in Google gelistet zu werden. Denn die Nutzererfahrung ist für die Suchmaschine eine relevantes Kriterium in der Sortierung ihrer Ergebnisse.

Wie funktioniert AMP mit dem Blitz im Suchergebnis?

Dass Google dieses Icon anzeigt, macht die Suchmaschine von selbst, wenn eine entsprechende AMP-Version der Webseite vorliegt und Google diese Version kennt. Stets müssen die Seiten des eigenen Internet-Auftrittes mit einer entsprechenden AMP-Version verlinkt sein, das wird in den Templates der Webseite eingebaut. Damit ist ein Link gemeint, den man im CMS einfach in einen Text gibt, sondern dieser muss aus der Logik heraus geschaffen werden und im Header der Seite mitgeschickt werden.

Die Webseiten - also alle Subseiten des Internetauftrittes - müssen dazu speziell in AMP programmiert werden. Wichtig sind für AMP einige Eigenschaften, die (leider) auch dazu führen, dass die Seite in der Gestaltung weniger flexibel ist. Diverse JavaScript-Themen sind in AMP nicht machbar und die CSS-Dateien dürfen nicht extern sein, sondern der gesamte CSS-Code muss vollständig in der Seite eingebaut sein. Außerdem braucht die AMP-Webseite eine sogenannte "Boilerplate". Und auch die "Befehle" der Sprache sind manchmal anders.

Beispielsweise ein Bild einzubinden ist in HTML mit dem Code <img src="/datei-pfad/bild.jpg" alt="Bild" /> zu machen, in AMP sieht dieser Befehl dann so aus: <amp-img src="/datei-pfad/bild.jpg" alt="Bild"></amp-img>.

Ähnliche Änderungen am Code müssen nicht nur für Bilder sondern auch für andere Inhalte gemacht werden, wie beispielsweie iFrames, die zur Anzeige einer Landkarte genutzt werden. Oder die Einbindung von Videos, auch diese wird in AMP anders programmiert als in normalem HTML.

Warum dann 2 Versionen?

Man könnte jetzt fragen, wieso nicht einfach die ganze Webseite als AMP programmiert wird und tatsächlich ist das möglich eine Webseite einfach nur in AMP zu bauen. Das Problem dabei ist eher, dass eben einige Funktionen, die eine moderne Webseite benötigt, dort nicht realisiert werden können. Daher geht es bei AMP vor allem um den ersten Eindruck. Aber wie das bei einem "Ersten Eindruck" so ist, wenn man den einmal gut gemacht hat, hat man eine gute Chance darauf, dass der Kunde im Internet weiterklickt und Dienstleistungen, Services oder Produkte bestellt. Es gibt eben auch im Internet keine zweite Chance für den ersten guten Eindruck.

Maßnahmen für AMP-Versionen

Damit die eigene Webseite als AMP-Version verfügbar ist, sind folgende Maßnahmen von einer Webagentur zu machen:

• Umsetzung des Rahmen-Templates als AMP-Programmierung im "Boilerplate", CSS und speziellen JavaScript-Funktionen
• Umsetzung aller Templates für die einzelnen Module der Webseite
• Integration von Querverweisen für die "echte Webseite" zu ihrer jeweiligen Schwester-Version in AMP-Programmierung

Diese Maßnahmen können aufwendig sein und daher auch einiges an Geld kosten. Dabei ist aber zu beachten, dass niemand den Betreiber einer Webseite dazu zwingt alle Subseiten in AMP umzusetzen. Wer Schritt für Schritt gehen möchte, sollte neben dem Rahmen-Template in dem die Elemente wie Navigation, Logo, Bilder, Footer mit Navigation, Sprachauswahl etc. enthalten sind, zunächst die wichtigsten Inhalte in AMP ausgeben lassen, die für Suchmaschinen-Rankings interessant sind. Das eigene One-Page-Layout mit 20 Zeilen Text aber dafür 18 Bildern, 6 Animationen und 3 Video-Clips ist hier nicht das wichtigste Thema. Auch das Kontaktformlar ist möglicherweise nicht so wichtig oder der Kundenlogin. Wichtig dagegen sind die Beschreibungsseiten von einzelnen Produkten in AMP-Form, speziell dann, wenn dort sogar ein Button ist, mit dem man dieses Produkt dann auf der tatsächlichen (HTML) Webseite bestellen kann.

Null Ladezeit...

Der wichtigste Erfolg, den man mit AMP hat, ist quasi 0 Sekunden Ladezeit für die Internetseite. Den Schwerpunkt der AMP-Programmierung sollte man vor allem auf die eigenen "Statischen" Seiten legen, die sich nicht sehr oft verändern. Oder man lässt entsprechende Inhalte in einem entsprechenden Format von der Originalwebseite nachladen.

Warum in eine AMP-Webseite nachladen?

Das Nachladen von tatsächlichen Inhalten hat einen ganz einfachen Hintergrund. Die von Google im lokalen Speicher auf den Google Servern abgespeicherte Version kann möglicherweise einige Wochen alt sein. Wenn es dabei um sehr statische Informationen geht wie um die Beschreibung eines Produktes oder einer Jahresmitgliedschaft in einem Verein, dann ist das meistens in Ordnung. Wer aber eine Seite sehr oft aktualisiert, wird feststellen, dass es nicht förderlich ist, wenn eine ständig auf Google Servern zwischengespeicherte Version für die Nutzer sichtbar ist. Hier kann man in AMP dann Programmierungsteile einbauen, die dafür sorgen, dass die tatsächlichen Originalinhalte nachgezogen werden, wenn der Nutzer die Seite öffnet. Das beeinflusst aber das Ladezeit-Erlebnis natürlich. Daher:

• Laufend aktualisierte Webseiten: AMP nur für das Grundgerüst, aber nicht für die Inhalte.
• Statische Webseiten: AMP für den kompletten Inhalt

Zu diesen laufend aktualisierten Webseiten gehören beispielsweise auch die eigenen News-Übersichten. Dagegen dürfen in den meisten Fällen aber die statischen Inhalte eines Artikels im News-Bereich sehr wohl längerfristig bleiben, denn die tatsächliche Nachricht vom 14. Juni, wird ja nicht am 16. Juni schon umgeschrieben. Bei der Übersichtsseite kann es aber sehr wohl sein, dass bereits 2 Tage später 3 neue Nachrichten erscheinen müssten.

Für genau solche Überlegungen trifft aber die Digital-Agentur entsprechende Vorkehrungen. Die Ladegeschwindigkeit ist auch beim Nachladen trotzdem besser, weil die Seite - noch ohne ihre textlichen Inhalte - bereits fertig gerendert (also berechnet) ist im System von Google bei AMP-Webseiten.