Positives Ranking auf mobilen Endgeräten mit Google AMP

AMP - Accelerated Mobile Pages

Es ist schon lange kein Geheimnis mehr, dass die Zukunft des Browsens auf mobilen Endgeräten stattfindet. Immer dabei und immer zugänglich spezialisieren sich Firmen immer mehr auf das Bewerben von Produkten auf Online Plattformen. Sie schauen die privaten TV-Sender und wundern sich, dass in der Werbepause nur noch Werbung mit Online-Versand beworben wird? Stellen Sie sich vor, dass ein Interessent sofort vom Bildschirm auf das Smartphone wechseln kann, um das gesehene weiter zu erforschen, oder gar eine Bestellung abzuschicken. Anders wie bei Offline Werbung müsste man erst auf Öffnungszeiten und Anreise zum lokalen Geschäft machen, welches in vielen Fällen nicht sofort möglich ist und bis die Möglichkeit besteht, die Werbung schon lange in Vergessenheit geraten ist.

Google Accelerated Mobile Pages Google Now Cards Assistant

Auch genau dieses Prinzip spiegelt sich bei AMP wieder. Bei einer Suche im Netz soll die Antwort zum Problem möglichst sofort verfügbar sein. Während Facebook mit Instant Articles vorgelegt hat, zieht Google mit Accelerated Mobile Pages hinterher. Lädt eine Seite zu langsam, oder ist diese nicht zu erreichen, ist der Interessent schon beim nächsten Suchergebnis und schaut sich bereits den Mitbewerber an.

Was ist AMP - Accelerated Mobile Pages?

AMP ist eine neue Schnittstelle, die einen Webseiten-Inhalt mit minimalen Informationen - insbesondere abgespecktem Design - innerhalb Sekunden-Bruchteile vollständig lädt. Anders zur normalen Webseite wird bei Accelerated Mobile Pages auf fast alle visuellen Dinge verzichtet. Es erscheint schon fast wie das Lesen eines Zeitungsbeitrags, wo bis auf einige Bilder und Text nichts vorgefunden wird. Gerade bei den mobilen Geräten soll es mit AMP möglich sein mit sehr kleinen Datenmengen, oder auch mit schlechter Verbindung ein hervorragendes Leseergebnis eines AMP-Artikel zu erhalten.

AMP im Webdesign

Generell kann AMP komplett getrennt vom Webdesign geführt werden, sodass sich beide Versionen - also die Schnittstelle zu Accelerated Mobile Pages und dem eigentlichen Weblayout - nicht gegenseitig stören. Auch bei Änderungen am Design wären beide Ansichten getrennt und können unabhängig Veränderungen mit sich bringen. Bei Veränderungen des Inhalts - also neue Datensätze, könnte man einen bestimmten Datensatz zum Beispiel ganz bequem vom AMP Ergebnis ausblenden. Falls es sich hierbei dann zum Beispiel um irrelevant Zusatzinformation handelt.

Google Accelerated Mobile Pages

Bis auf die großen Seiten wie News-Outlets und Tageszeitungen scheint sich da noch niemand mit AMP ausgiebig beschäftigt zu haben. Gerade deshalb liegt bei einer Umstellung zu AMP so viel Potenzial. Im Suchmaschinen-Ranking werden AMP-Artikel den normalen vorgezogen. Das heißt im Klartext, dass bei gleicher relevanz, auf jeden Fall eine Accelerated Mobile Pages das Suchergebnis dominiert.

Wie sieht die Integration von AMP aus?

Der erste Schritt ist, sich das AMP-Projekt auf der Webseite des Herstellers anzuschauen. Dort gibt es sehr ausführliche Dokumentation über Code- und Anwendungsbeispiele, die man bei einer eigenen Implementation nutzen kann.

Zum AMP Projekt - Accelerated Mobile Pages Dokumentation

Es kommt im speziellen Fall darauf an, auf welcher Plattform die eigene Webseite läuft. Während wir unsere Schnittstelle einfach selbst nach den eigenen Bedürfnissen, sowie den Bedürfnissen des Kunden programmieren, ist man bei anderen Lösungen wie Wordpress, Jimdo, und 1&1 entweder auf Plugins von Drittanbieter angewiesen, oder sogar dem jeweiligen Anbieter Hoffnungslos ausgeliefert.

Während Wordpress für AMP Sicherlich ein Plugin anbietet, ist man mit diesem CMS mehr oder weniger Unflexibel, wenn es darum geht, das AMP Design speziell nach den eigenen Bedürfnissen anzupassen. Man kann sich vorstellen, dass ein solches Plugin für sehr viele Anwender auf Masse zugeschnitten ist und gerade im Detail entweder sehr mühsames Anpassen des Plugins vorgesehen ist, oder man es über andere Wege probieren muss.

Bei Jimdo, 1&1 sowie andere Hosting-Baukästen, erwarte ich, dass es dort erst gar keine Umsetzung geben wird. Nach der Methode WYSIWYG wird bei solchen Baukästen meist einfach nur statische Inhalte erstellt, die nach keinem bestimmten Schema laufen und genau deswegen, lässt sich dieser Datensatz dann eher recht mühsam in AMP für den gesamten Kundenstamm von Baukastensystemen Umwandeln.

AMP Link im Head (original Template)

Genau wie andere Informationen für Suchmaschinen - Beispielsweise Beschreibungen, Index-Optionen, usw. - wird auch AMP im Head-Bereich eines jeweiligen HTML Dokument spezifiziert. Wenn man bei der Programmierung zum Beispiel je nach URL eine spezielle AMP-URL anbietet, könnte man diesen Anwendungsfall für diverse Seiten - Beispielsweise Blogbeitrag - automatisieren...

In unserem Beispiel filtern wir alle URLs von unseren Blogbeiträgen, welche mittels speziellem AMP-Template für unsere Blogbeiträge über den Head-Bereich an die Suchmaschine gemeldet wird. Der amphtml-Link setzt dabei eigentlich nur fest, dass eine AMP-Version zur Verfügung steht, und wo die Suchmaschine dafür suchen muss. Nur weil man einen entsprechenden Link setzt, heißt es leider noch lange nicht, dass die Seite für AMP gültig ist.

AMP Body - Accelerated Mobile Pages Template

Das Template, welches in der AMP Version geladen werden soll ist vergleichbar wie eine eigene HTML Version der jeweiligen Seite. Grundgenommen verfügt diese über einen eigenen Html, Head und Body bereich, der komplett individuell und unabhängig vom normalen Webseiten-Template aussehen kann.

Innerhalb des Head-Bereich kann man sich auf verschiedene Funktionen des AMP-Projekts verweisen, sodass man zum Beispiel ein Sidebar Menü nutzen kann. Es ist auch zwingend notwendig, dass alle Design-Elemente also zum Beispiel das Styling innerhalb des Head-Bereichs spezifiziert wird. SO kann man sich mit Klassen, Divs und anderem Styling sein eigenes Mikro-Layout mit AMP programmieren.

Innerhalb des Body-Bereich kann man wie gehabt, ganz normal über HTML mit Div's und Klassen loslegen und kann per HTML sein Template aufbauen. Aufpassen muss man dann allerdings mit Videos, sowie Bildern, denn da gibt es eigene Tags. Wer es in dem Fall gewohnt ist ein Bild per HTML Tag einzubinden, liegt da falsch:

<img src="url-zum-bild.jpg" />

Ist nicht gültig. AMP besitzt für diese Anzeige einen eigenen Tag, der erfordert ist.

<amp-img src="url-zum-bild.jpg"></amp-img>

Parameter wie Höhe und Breite kann wie gehabt genutzt werden. Genau wegen diesem Problem wird man gerade bei Wordpress, sowie bei den Baukastenlösungen auf probleme Stoßen. Man müsste also jegliche Anzeige von Bilder und Videos von dem normalen HTML zu AMP-Html umwandeln und das auf tausenden von Seiten. In der Praxis ist das zwar nicht so schwer, allerdings um das trotzdem individuell in eigene Templates einbauen zu lassen, lässt kein Standard für alle finden.

AMP nutzen oder nicht?

Accelerated Mobile Pages sind ein modernes Werkzeug um Seiteninhalte sehr schnell auf mobilen Smartphones und Tablets anzeigen zu lassen. Es gestaltet sich zwar nicht ganz so einfach, die eigene Seite mit AMP kompatibel zu machen, allerdings bewirkt es für Betreiber, sowie Besucher für viele Vorteile.

Genau wie andere Standards wie zum Beispiel eine sichere Verbindung an Bedeutung gewinnt, so kann man mit der migration zu AMP punkten und in Form von bevorzugten Suchmaschinen-Ranking belohnen lassen. Unsere Implementation war innerhalb von kurzer Zeit vollzogen. Diesen Service bieten wir auch für unsere Kunden an. Wir freuen uns auf Ihre Anfrage.

Kontaktieren Sie uns jetzt!
Anderen über Positives Ranking auf mobilen Endgeräten mit Google AMP erzählen

Was würden Sie über dieses Thema wissen wollen? ( 0)

* = Partnerlink