Probleme mit AMP? Diese Tipps können helfen

Das Thema AMP beschäftigt die Webmaster zur Zeit wie kaum ein anderes. Das liegt natürlich vor allem daran, dass Google das Framework fördert und bei jeder sich bietenden Gelegenheit auf dessen Vorteile hinweist. Viele Pioniere der ersten Stunde haben bereits Plugins zur Unterstützung von AMP installiert, stoßen jedoch auf Probleme bei der Validierung. Die folgenden Tipps können dabei helfen, die eigenen AMP-Seiten fit zu machen.

Die Abkürzung AMP steht für "Accelerated Mobile Pages" und beschreibt ein System, das Webseiten schneller macht. Dazu werden ein abgespecktes HTML und JavaScript verwendet und auf ein Google-eigenes Content Delivery Network (CDN) zurückgegriffen, um Daten zu cachen und schnell ausliefern zu können.

Es gibt bereits erste Plugins für die gängigsten Content Management Systeme WordPress und Joomla, die sich jedoch allesamt noch in einer frühen Entwicklungsphase befinden und daher noch nicht fehlerfrei funktionieren können. So kann es zum Beispiel zu Problemen bei der Validierung des Codes und zu unvollständigen oder falschen strukturierten Daten kommen. Das ist ärgerlich, denn nur wenn sowohl die Validierung als auch das strukturelle Markup korrekt sind, hat eine AMP-Seite auch die Chance, in den Google-Ergebnissen zu erscheinen.

Glücklicherweise leistet Google, natürlich auch im eigenen Interesse, derzeit viel Support für Publisher bei Problemen mit AMP. Im Webmaster Center Help-Forum werden entsprechende Fragen meist sehr schnell beantwortet. So auch im Fall eines Webseitenbetreibers, der eine WordPress-Seite mit AMP-Plugin besitzt. Bei der Validierung seiner Seiten erhält er jedoch viele Fehlermeldungen.

Vorgehensweise bei AMP-Problemen

Um die Ursache erkennen und beheben zu können, empfiehlt Google-Mitarbeiter Tomo T. als Antwort die folgende Vorgehensweise (Hinweis: Diese Tipps sind nicht nur für WordPress, sondern auch für Joomla oder andere Content Management Systeme geeignet):

1. Auswählen einiger Artikel zum Testen im AMP HTML-Validator. Anschließend
   1. jeweils einen Artikel im Browser (Google Chrome) öffnen,
   2. "#development=1" an die URL anhängen,
   3. mit F12 die Chrome DevTools-Konsole öffnen (dabei die Emulation mobiler Geräte aktivieren) und auf die Anzeige möglicher Fehler achten.
   4. Anschließend die angezeigten Fehler beheben (lassen). Eine Beschreibung möglicher Fehler ist hier zu finden.
2. Prüfen, ob das Schema-Markup der AMP-Seiten richtig gesetzt wird. Dazu am besten das Structured Data Testing Tool verwenden. Insbesondere beachten, dass
   1. NewsArticle, Article oder VideoObject-Markup vorhanden ist,
   2. keine AMP-Fehler oder -Warnungen angezeigt werden,
   3. das Logo sich im Rahmen 600*60 Pixel bewegt,
   4. das Logo den UI-Richtlinien für Logos im Karussell entspricht.
3. Prüfen, ob die Verlinkung zwischen HTML- und AMP-Seiten richtig gesetzt ist:
   1. Gibt es eine rel=amphtml-Verlinkung auf den kanonischen Seiten (also den HTML-Seiten), die jeweils auf die zugehörige AMP-Seite zeigt?
   2. Gibt es auf den AMP-Seiten jeweils eine Verlinkung auf die kanonische Gegenseite per rel=canonical?
   3. Gibt es eine rel=amphtml-Verlinkung auf der mobilen Webseite (falls eine eigenständige mobile Webseite besteht)?
4. Externe Ressourcen prüfen:
   1. URLs von allen eingebetteten iFrames, Videos, Fonts, Pixeln, Analytics-Skripten, Anzeigen etc. müssen per HTTPS abgerufen werden.
   2. Keine protokoll-relativen URLs verwenden. Das kann zu Problemen führen, wenn ein Artikel über Googles AMP-Cache geladen wird. Wenn eine Webseite von einem anderen Cache geladen wird (zum Beispiel von cdn.ampproject.org), dann verweist eine relative URL nicht auf den tatsächlich beabsichtigten Canonical-Link. Das heißt: nur absolute URLs verwenden.

Auch wenn ein CDN von einem Drittanbieter genutzt wird, kann es bei AMP-Seiten zu Problemen kommen. Der Grund ist, dass manche CDNs für das asynchrone Laden von JavaScript zusätzlichen Code in die Webseite einfügen, der dann zu Validierungsfehlern führen kann.