Google AMP oder Ladevorgang beschleunigen im WordPress-Blog

Mobil online sein ist inzwischen so ein fester Standard, dass man auch beim Erstellen von Inhalten und Webseiten nicht drum herum kommt. Das Problem dabei ist, dass Seiten, die am Computer über einen Festnetzanschluss schnell laden, dies nicht zwangsläufig auch auf dem Smartphone tun. Oft gibt es ja auch Probleme mit der Anbindung oder gerade ist mal kein LTE verfügbar. Facebook hat deswegen die Instant Articles ins Leben gerufen, mit denen die Inhalte über ein Handy schneller ausgeliefert werden. Was Facebook kann, kann Google auch und nennt sich dort: AMP.

Accelerated Mobile Pages – AMP. Wie bitte?

Klingt mal wieder eher unaussprechlich als nützlich, aber frei übersetzt heißt das: Schnelle bzw. beschleunigte mobile Seiten. Mit dem Verfahren sollen also Seiten für Smartphones schneller auf dem Handy angezeigt werden. Das Verfahren ist vor allem für statische Seiten gedacht, die keine besonderen JavaScript-Funktionen nutzen. Für AMP gibt es extra HTML-Tags, die den Seitenaufruf so beschleunigen sollen. Hier ein Beispiel, dass auch im Browser meiner Meinung nach spürbar funktioniert:

Wie werden AMP-Seiten gefunden / erkannt?

Die Lösung hierzu befindet sich im Quellcode einer Seite. Sowohl die “normale” Seite, als auch die AMP-Seite haben einen Verweis im Quelltext stehen, der auf die jeweils andere Seite verweist. So können Clients und Suchmaschinen erkennen, dass es noch eine andere Version gibt, die vielleicht geeigneter ist. Der Verweis sieht zum Beispiel für diese Seite so aus:

<link rel=”amphtmlhref=”https://blog.medienman.de/?p=2407/amp/” />

Dieser Tag verweist also  auf der Standard-Seite auf die AMP-Seite. Umgekehrt gibt es das auch für die Standard-Seite auf der AMP-Seite:

<link rel=”canonicalhref=”https://blog.medienman.de/?p=2407″ />

Ich würde es probieren, wie erstelle ich AMP-Seiten in WordPress?

Google hat ein Tutorial veröffentlicht, wie man AMP-Seiten am besten schreibt. Es ist leicht verständlich aufgebaut und lässt sich so auch sehr gut nachbauen. Aber meine Lust, alle Blog-Artikel nachzubearbeiten war etwas gering. Gut, dass Automattic ein Plug-In geschrieben hat, dass das für Posts in WordPress-Blogs automatisch macht. Es heißt “AMP” und kann über das WordPress-Plugin-Verzeichnis installiert werden. Nach der Installation und Aktivierung – läuft es einfach. Wenn man jetzt einer beliebigen Seite einfach nach der URL “/amp/” anfügt, erhält man die AMP-Version der Seite. Außerdem sind auf jeder Seite die oben angesprochenen Verweise integriert, so dass auch Suchmaschinen nach und nach die beiden verschiedenen Varianten entdecken.

So macht man sein WordPress-Blog innerhalb von 5 Minuten AMP-Fit. Und das mit letztlich nur 3 Klicks.

Gibt es keine Probleme mit dem AMP-Plugin?

Doch, leider schon. Zum einen kann das Plugin tatsächlich nur Posts. Übersichtsseiten oder ähnliches beherrscht es nicht. Außerdem ist das Layout natürlich wesentlich entschlackt. Es fehlen Sidebars und andere Widgets. Auch die Kommentare werden aktuell mit diesem Plugin nicht in AMP ausgeliefert, sondern fehlen einfach ganz. Hier ist dann noch etwas Nachentwicklung notwendig, die jeder selber vornehmen kann. Alle Infos dazu direkt auch in der Dokumentation des Plugins: https://github.com/Automattic/amp-wp/blob/master/readme.md

Wer also mal mit AMP spielen möchte, findet meiner Meinung nach schnell eine Möglichkeit, es auszuprobieren. Aber ganz ums Anpassen kommt man bei dem Anspruch, mehr als nur die Inhalte darzustellen, nicht rum.

Veröffentlicht von

Fachinformatiker, Medienliebhaber und – konsument, Rheinländer, kleiner Radiomacher, Schreiber dieses Blogs

, am

1 Kommentar Schreibe einen Kommentar

  1. Seit einigen Wochen ist ein neues AMP-Plugin für WordPress veröffentlicht worden: https://wordpress.org/plugins/wp-amp-it-up/

    Es bietet einige zusätzliche Features wie z.B. eine Übernahme eines Google-Analytics-Tracking (wenn vorhanden) und die Integration von Social-Share-Buttons. Teilweise werden auch Kommentare dargestellt, kommt aber immer darauf an, ob die Kommentare den entsprechenden Schema-Tags unterliegen.

Schreibe einen Kommentar