• Tel.: 0511-9239990

AMP-Landingpages für SEO und SEA

04.April 2018 - Online-Marketing -

5 Billionen AMP-Seiten gibt es schon im Netz – Zeit, sich genauer mit dem Thema zu befassen. Wir stellen euch das AMP-Project und die Updates von der AMP Conf 2018 in Amsterdam vor.

AMP-Landingpages

Was sind AMPs?

Das Accelerated Mobile Pages Project wurde 2015 von Google als Open-Source-Projekt ins Leben gerufen. Ziel ist es, Webseiten mobil schneller und passender anzuzeigen. AMP-Seiten werden oftmals zusätzlich zu bereits bestehenden Unterseiten einer Website bereitgestellt und nur auf mobilen Endgeräten ausgespielt. Somit kann die Performance im mobilen Bereich erhöht werden, ohne bereits rankende Seiten der Domain zu verlieren. AMPs  sind an dem Blitz-Symbol in den SERPs leicht zu identifizieren. Außerdem stehen sie immer an oberster Position, was einen klaren Vorteil für ihre Betreiber bedeutet.

Warum AMPs?

Die Seitenladezeit stellt gerade im Bereich der mobilen Internetnutzung einen entscheidenden Faktor dar. Nicht nur, dass die Ladezeit eine Auswirkung auf Google-Rankings hat – viel wichtiger ist die User-Experience. Eine Webseite, die langsam lädt, sich fehlerhaft auf dem Handy-Display darstellt oder keinerlei Ladevorgang zulässt, ist heute ein absolutes No-Go. Mobile Nutzer sind oftmals zusätzlich durch ihr Datenvolumen und die verfügbare Bandbreite eingeschränkt.

Mobil-optimierte Seiten und Responsive Design waren die ersten Schritte, um die Nutzererfahrung im mobilen Bereich zu verbessern. AMPs stellen nun die nächste Optimierungsstufe dar, da sie neben den ursprünglichen „Desktop“-Varianten der Websites existieren können. Egal, mit welcher Hardware der User auf die Seite zugreift, er bekommt immer die optimale Page präsentiert.

Warum sind AMPs schneller?

Bisherige Bemühungen, Webseiten mobil zu beschleunigen, fanden häufig in Form von “Vereinfachung” der Seite statt: Der Verzicht auf Rich-Media-Elemente und ein simpleres Design verbesserten die mobile Performance. Durch Besonderheiten im HTML, Java Script und Cache wird nun die Ladezeit der AMP-Seiten noch stärker verringert. Text und Grundgerüst der AMPs ladet der Browser schon im Hintergrund, bevor der Nutzer überhaupt eine AMP angeklickt hat. Dafür entwickelte das AMP-Project drei grundlegende Neuerungen:

  1. AMP HTML

Entspricht dem altbekannten HTML, allerdings mit vielen Einschränkungen, um die Performance zu verbessern. Dazu ersetzen AMP-spezifische Tags (die sogenannten AMP HTML components) die eigentlichen Tags. AMP-Project stellt dazu auf seiner Website alle erlaubten HTML-Tags vor. Jede AMP-Seite wird zudem mit dem Tag <html ⚡> gekennzeichnet.

  1. AMP JS

Das spezielle AMP Java Script sorgt für ein asynchrones Laden der Webseiten-Inhalte, wobei zuerst die sichtbaren Elemente einer Seite geladen werden. Dem Nutzer erscheint die Seite somit visuell bereits geladen, obwohl sie technisch gesehen noch im Aufbau ist. In der JS-Library lassen sich alle Skripte finden, die auf einer AMP zugelassen sind, um eine schnelle Ladezeit zu ermöglichen. Das AMP-Project stellt diese kostenlos online zur Verfügung.

  1. Google AMP Cache

Alle AMPs werden über das Google-CDN (content delivery network) ausgeliefert. Die Ladezeit verringert sich weiter, da die Seiten direkt aus dem Cache des CDN geladen und Bilder für das Endgerät optimal skaliert an den Browser gesendet werden. Inhalte, die nicht above the fold sind, laden erst, wenn der Nutzer tatsächlich bis zu dem Inhalt scrollt.

Weitere Vorteile von AMPs:

  • Ein spezielles „AMP-Analytics“-Tag bindet Analytics und andere Tracking-Systeme können ein.
  • Adssind möglich, allerdings müssen Banner festgelegte Formate einhalten.
  • Formulare und Paywalls sind ebenfalls möglich.
  • Durch die schnelle Ladezeit – nur wenige Millisekunden – ist die Absprungrate niedriger und die Performance besser.
  • AMP-Plug-ins sind von WordPress und anderen CMS-Anbietern verfügbar.
  • Howtos auf der AMP-Webseite erleichtern den Einstieg.
  • Der Open-Source-Quellcode steht jedem kostenlos zur Verfügung.

AMPs und SEA

Eine SEA-Landingpage hat das Ziel, zu verkaufen oder Leads zu generieren. Daher sollten die AMPs auch genau auf dieses Ziel abgestimmt sein. Response-Elemente und übersichtlich aufbereitete Informationen bilden die Hauptelemente. Call-to-actions und die wichtigsten Informationen sollten „above the fold“ sichtbar sein.

Die AMPs, welche sicherlich ursprünglich von Facebook Instant Articles inspiriert sind, bieten auch Betreibern von E-Commerce-Shops einen großen Nutzen. Besonders bezahlter Traffic über Anzeigen etc. ist wertvoll, denn teuer eingekaufte Klicks ohne Conversion ruinieren jede Bilanz.

Warum sollte ich eine AMP als SEA-Landingpage erstellen?

  • AMPs sind auf das Wesentliche reduziert.
  • Sie nutzen geringen Platz auf Displays perfekt.
  • Durch die kurze Ladezeit entstehen niedrigere Absprungraten.
  • Keine Ablenkungen für den User und direkter Abschluss auf der AMP sind möglich.
  • Filter-, Such- und Sortierfunktionen sind ebenfalls möglich.
  • AdWords-Kampagnen können besser performen.
  • Besserer Qualitätsfaktor für maßgeschneiderte Landingpages mit vielen Ziel-Abschlüssen.
  • Inhalte sind perfekt auf die Suchanfrage abgestimmt.

Wichtig ist an dieser Stelle, dass der Nutzer die passenden Informationen, Produkte und Leistungen wiederfindet, die ihm in der angeklickten Anzeige versprochen wurden.

AMP-Project bietet auf der Seite AMPbyExample.com viele Informationen und Beispiel-Codes an. Die für E-Commerce nützlichen Funktionen, die bereits auf den AMPs möglich sind, findet ihr hier: https://ampbyexample.com/introduction/amp_for_e-commerce_getting_started/

Große E-Commerce-Seiten, die AMPs schon erfolgreich nutzen, sind Zalando, airbnb und ebay. Allerdings sollte bei der Entscheidung, ob man AMPs für einen Shop einsetzt, immer auch bedacht werden, dass es viele Einschränkungen in der Programmierung gibt, die umgangen werden müssen. Die Usability entscheidet letzten Endes, ob es zum Abschluss auf einer Seite kommt.

Extratipp zur erfolgreichen Gestaltung einer E-Commerce-Abschluss-Seite: https://www.crazyegg.com/blog/perfect-mobile-ecommerce-checkout/

AMPs und SEO

Gerade bei News-Artikeln liegt es nahe, AMPs zu verwenden, da Google nur diese im News-Karussell platziert. Es ist davon auszugehen, dass die Ranking-Vorteile für AMP-Seiten noch steigen werden und jeder gute SEO das Thema jetzt schon auf dem Schirm haben sollte.

AMP könnte sich im Bereich Content-Darstellung ebenfalls als revolutionär erweisen – auch wenn SEO bislang eher mit umfangreichen Informationen und Texten in Verbindung stand. Aber glaubt man den AMP-Vertretern, geht der Trend zu „bite sized rich visual Content“. Die neuen AMP-Stories beinhalten Bilder, kurze Texte, Videos, Audio, Animationen und Engaging-Elemente. Ziel ist es, zu unterhalten und Informationen in “Häppchen” und hübsch aufbereitet darzustellen. Dass die bereits erstellten Beispiel-AMP-Stories ansprechend und unterhaltend sind, ist unbestritten. Aber ob diese Entwicklung gerade im News-Bereich als positiv zu bewerten ist, sei dahin gestellt.

AMP-Stories: https://www.ampproject.org/stories

Probleme der AMPs und Lösungsansätze

Wie fast jede neue „Erfindung“ hatten auch die AMPs zu Beginn mit einigen Kinderkrankheiten zu kämpfen.

Auch wenn Plug-ins für WordPress und andere CMS-Anbieter verfügbar sind, ist im Nachgang noch einiges an Programmierarbeit nötig, um die AMP-Seite an das eigene Website-Design anzupassen. Gibt es Probleme beim Erstellen des AMP-HTML-Codes oder wird dieser nur teilweise umgesetzt, sind keine Verbesserungen der Ladezeit zu erwarten.

Problematisch war bislang auch die Implementierung von Tracking. Da die AMPs aus dem Google Cache geladen werden, erfasst Analytics diese nur einzeln. Das bedeutet eine niedrige Sitzungsdauer, hohe Bounce-Rate und konstant eine Seite pro Sitzung. Um die Daten der AMPs auch im Analytics richtig zu erfassen und in das Gesamtergebnis einfließen zu lassen, ist wieder ein Programmierer gefragt.

Die AMP Conf 2018 in Amsterdam präsentierte bereits einige Lösungsansätze. Es wurde deutlich, dass die Entwickler des AMP-Projects sich intensiv damit befassen, die durch die Reduzierungen im Quellcode entstehenden Nachteile anderweitig auszugleichen. Das Ziel sei, alle Möglichkeiten einer “normalen” Website auch im AMP-Format zur Verfügung zu stellen – ohne Einbußen bei der Ladezeit.

Neue Projekte und Erweiterungen für AMP sind:

  • Analytics
  • Ausbau des AMP-Framework und noch mehr Möglichkeiten in Planung
  • AMP-Stories, ansprechendes „visual story telling“ trotz Einschränkungen im JS
  • GMail, dynamischer Content und interaktive Elemente über AMP in E-Mails
  • Eigenes JS, das wahrscheinlich zukünftig nötig sein wird

Diese Liste wächst ständig. Das Projektteam führt eine öffentlich einsehbare Agenda und nimmt stetig neue Ideen auf. Sie reagieren so auf die zuletzt laut gewordene Kritik und machen das Konzept für noch mehr Bereiche einsetzbar.

Fazit: „Mobile first“ war gestern – Das „User-first-Web“ ist die Zukunft

Die in Anlehnung an Facebook Instant Articles entstandenen AMPs sind mittlerweile weit über die Anwendung in den News hinaus gewachsen und für alle Website-Typen geeignet. Vorteile bieten sie vor allem im mobilen Ranking mit guter Performance und geringem Verbrauch von Datenvolumen.

Die zunächst bemängelten Abstriche im Design sind durch die geplanten Neuerungen wohl demnächst hinfällig.

Weitere Kritik an den AMPs gab es vor allem, weil die Seiten aus dem Google-CDN abgerufen werden, also einem zentralen Server. Das wirft natürlich Fragen hinsichtlich der immer strenger werdenden Datenschutzbestimmungen auf. Ganz zu schweigen von der Benachteiligung für Websites, die nicht „mitmachen“. Viele befürchten zu Recht eine Einschränkung des freien Webs. Auf der AMP Conf sprachen die zuständigen Entwickler um Malte Ubl allerdings vehement von der Erhaltung des “open web” – was wohl zu erwarten war.

Insgesamt muss das Projekt weiter ausreifen und einige offene Fragen in Hinblick auf Datenschutz und die inhaltliche Kontrolle stehen weiterhin im Raum. Es stellt sich die Frage, ob es nicht generell sinnvoll ist, Seiten “sauber” zu programmieren und mobil-freundliche Anpassungen vorzunehmen.

Speziell für SEA- und SEO-Seiten werden noch weitere Features kommen, die eine vielfältige Nutzung der AMPs ermöglichen. Über geplante und bereits umgesetzte Verbesserungen informiert die AMP-Roadmap https://www.ampproject.org/roadmap/

Klare Message auf der AMP Conf 2018 war zudem das “User-first-Web”. Auch wenn das AMP-Project zur Verbesserung der mobilen Performance und Ladezeiten existiert, rückt dank der technischen Erweiterungen und neuen Gestaltungsmöglichkeiten die User-Experience wieder in den Vordergrund.

Wenn Dir dieser Artikel gefallen hat, dann teile ihn bitte!

(2 votes, average: 5,00 out of 5)

Ein Beitrag von Anja Franke

Anja Franke ist seit Oktober 2017 Junior SEO-Managerin bei Aufgesang. Sie ist in den Bereichen SEO und PPC tätig, wobei ihr Schwerpunkt im SEO-Content liegt. Nach ihrem Studium der Tiermedizin arbeitete sie zunächst im Produkt-Management und Marketing eines Pharmazieunternehmens. Nebenberuflich arbeitet sie als selbstständige Künstlerin und liebt es, in ihrer Freizeit zu Malen oder Zeit mit ihrer Hündin Else zu verbringen.



Wissenswertes

Branchen

  • Digitale Wirtschaft
  • Investitionsgüter
  • IT
  • Mode
  • Lebensmittel
  • Lifestyle
  • Startups

Leistungen

Rechtliches