Accelerated Mobile Pages – AMP

Design

Update 29.04.2016

 

Was sind Accelerated Mobile Pages?

Die Accelerated Mobile Pages (AMP) sind ein Projekt, das Google ins Leben gerufen hat, um die Ladezeiten von mobilen Webseiten zu optimieren. Aktuell sind die Ladezeiten von Webseiten zu lang. Dies liegt aber nicht unbedingt an der geringen Bandbreite im Mobilfunknetz, sondern an den umfangreichen Webseiten.

Seit einigen Jahren zählt die Ladegeschwindigkeit zu den Rankingfaktoren bei Google. Aus diesem Grund engagiert sich Google stark im Projekt Accelerated Mobile Pages. Ziel dieses Projektes ist, die Ladezeiten von Webseiten auf mobile Devices zu verkürzen.

Hierfür entwickelt Google ein Open-Source-Framework und stellt diesen kostenlos zur Verfügung. Es werden gezielt Webseiten von „Ballast“ befreit, der auf mobilen Devices nicht zwingend benötigt wird. Seit der Gründung des Projekts haben sich mehr als 160 Verlage (https://www.ampproject.org/who/) der Initiative angeschlossen.

Der Ansatz des Frameworks sieht vor, die http-Anfragen einer Webseite zu reduzieren.

Die Webseite wird mit AMP HTML nicht mehr komplett vor der Benutzung geladen. Während des Ladeprozesses kann die Webseite schon verwendet werden. Im ersten Schritt werden nur die Bilder geladen, die der Nutzer auch wirklich sieht. Dies reduziert das Datenvolumen, bis die Seite komplett verwendet werden kann.

Zu beachten ist, dass aus Performance-Gründen Javascript-Code von Drittanbietern aus der Webseite entfernt wird und nicht mehr funktioniert. Im CSS-Bereich dürfen keine Übergänge und Animationen verwendet werden und die Datei darf maximal 50.000 Byte groß sein.

Vor- und Nachteile

Bei zu langen Ladenzeiten von mobile Webseiten steigt auch die Absprungrate. Mit AMPs werden nach Dave Besbris (Vice President of Engineering at Google) mobile Webseiten 4-mal schneller geladen und die Datenlast ist 10-mal weniger als bei gewöhnlichen mobilen Seiten.

Nach Schätzungen von Stefan Gerstmeier (COO von Neofonie Mobile) können Publisher mit AMPs ihren Content zwischen 15 und 85 Prozent schneller auf mobilen Endgeräten darstellen. Dieser Vorteil ist besonders für Publisher und Medienhäuser interessant, die umfangreichen Content auf ihrer Webseite anbieten. Mit der Verwendung von AMPs wird das Search Ranking verbessert und der Verbreitungsgrad gesteigert.

AMPs können als Pendant zu Facebooks Instant Articles gesehen werden. Hier sollten folgende Unterscheidungen berücksichtig werden: AMPs ist ein Open Source Projekt. Quellcode, Code-Beispiele und Dokumentationen sind frei verfügbar und im Gegensatz zu Instant Articles bleiben die Publisher immer im Besitz der Inhalte, da diese auf ihren eigenen Servern gehostet werden. Von den Artikeln wird nur aus Performance-Gründen Cache-Datei bei Google gespeichert.

Fazit
Google hat eine erste Demoseite in einem Blogsystem erstellt. Diese soll auf mobile Device schneller geladen werden als herkömmliche mobile Webseiten. Für führende CMS und Blogsysteme wie WordPress werden bereits Plug-ins angeboten. Wer nicht auf Berichte andere Entwickler warten möchte, sollte sich schon jetzt das Framework genauer ansehen.

Hier könen Sie sich das Framework im Detail ansehen: AMP Project
Hier geht es zur Demoseite.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.



Weitere Artikel zu Design

Bei der heutigen Landingpage handelt es sich um eine Microsite bei der man... Mehr lesen »

Ich zeige euch 13 coole Header-Effekte für Webseiten, die beim Scrollen... Mehr lesen »

CSS – das Design der Website Im ersten Teil der HTML Blogserie habe ich... Mehr lesen »


Weitere Artikel von Michael
Design Landingpages Online Marketing
Update 29.04.2016   Was sind Accelerated Mobile Pages? Die Accelerated... Mehr lesen »

Landingpages
WordPress ist eine fantastische Open Source Software, mit der man nicht nur... Mehr lesen »

Online Marketing
Auf vielen Webseiten bekommen Nutzer zur Begrüßung einen sogenannten... Mehr lesen »

Top-Beiträge

Facebook

Bilder posten auf Facebook

Nicht jedes Bild passt in das neue Konzept der Facebook Chronik. Aber wie müssen Bilder jetzt... Mehr lesen »
Design

13 coole Header-Effekte für Webseiten

Ich zeige euch 13 coole Header-Effekte für Webseiten, die beim Scrollen animiert werden. Manche... Mehr lesen »
Facebook

Bilder einfügen in Facebook-Kommentaren – Gut oder schlecht?

Bereits im Juni war es bei Facebook-Profilen schon möglich Kommentare mit Bildern zu versehen. Für... Mehr lesen »
^