{"id":206,"date":"2017-03-02T01:14:06","date_gmt":"2017-03-02T00:14:06","guid":{"rendered":"https:\/\/quantenfrosch.at\/blog\/?p=206"},"modified":"2018-08-24T01:14:34","modified_gmt":"2018-08-23T23:14:34","slug":"was-sind-accelerated-mobile-pages-amp","status":"publish","type":"post","link":"https:\/\/quantenfrosch.at\/blog\/was-sind-accelerated-mobile-pages-amp\/","title":{"rendered":"Was sind Accelerated Mobile Pages (AMP)?"},"content":{"rendered":"<p>Eine kure Ladezeit ist heute ein entscheidender Faktor f\u00fcr den Erfolg oder Misserfolg vor allem bei mobil genutzten Internetseiten. Ein wachsender Anteil der Internetnutzer verwendet mobile Endger\u00e4te f\u00fcr den Einkauf und die Informationsbeschaffung im Internet. Aktuelle Umfragen belegen, das Internetuser in den meisten F\u00e4llen zu einer anderen Website wechseln, wenn der Ladevorgang mehr als 3 Sekunden in Anspruch nimmt. Im Oktober 2015 wurden aus diesem Grund die <strong>Accelerated Mobile Pages<\/strong>, kurz <strong>AMP<\/strong>, ins Leben gerufen.<\/p>\n<h2>AMP f\u00fcr verk\u00fcrzte Ladezeiten auf mobilen Endger\u00e4ten<\/h2>\n<p>Accelerated Mobile Pages sind ein plattform\u00fcbergreifendes Open-Source-Framework, dessen Entwicklung im Wesentlichen auf <a href=\"https:\/\/github.com\/ampproject\" target=\"_blank\" rel=\"noopener noreferrer\">GitHub <\/a>betrieben wird. Accelerated Mobile Pages basieren auf einem stark verschlankten CSS, einer eigenen JS library, dem Content Delivery Network (CDN) sowie einem angepasstem HTML Code mit spezifischen Tags. Unterst\u00fctzt wird das Accelerated Mobile Pages Project von Google. Hinter der Unterst\u00fctzung durch Google steckt sicherlich auch, dass \u00e4hnliche Dienste bereits von Facebook mit Instant Articles, oder von Appel mit den Apple News angeboten werden.<\/p>\n<h3>Wodurch unterscheiden sich AMP von herk\u00f6mmlichen Websites?<\/h3>\n<p>Accelerated Mobile Pages Websites unterscheiden sich von <a href=\"https:\/\/quantenfrosch.at\/ratgeber-responsive-webdesign\/\" target=\"_blank\" rel=\"noopener noreferrer\">normalen Websites<\/a> durch spezifische HTML-Tags, eine eigene JavaScript-Bibliothek und die Auslieferung der Inhalte \u00fcber das Google eigene Content Delivery Network.<\/p>\n<p>Innerhalb des HTML Quellcodes werden die \u00fcblichen HTML Tags durch AMP-Tags ersetzt. Insgesamt ist der Umfang des HTML Code deutlich geringer. Inhalte werden erst geladen, wenn der User sie ben\u00f6tigt und es erfolgt nur ein http request pro Seitenaufruf.<\/p>\n<p>Die JS library der Accelerated Mobile Pages verarbeitet externe Ressourcen asynchron und verwaltet das Laden aller Elemente einer Website. Ungest\u00f6rt von \u00e4u\u00dferen Einfl\u00fcssen erfolgt das Rendern der Seiten schneller. Langsame CSS Selektoren werden blockiert und das Ausf\u00fchren von IFrames-Elementen im Sandbox-Modus wird unterst\u00fctzt.<\/p>\n<p>Der Google AMP Cache. Optional erfolgt die Auslieferung der Websites \u00fcber das weltweite, proxybasierte Content Delivery Network (CDN) von Google. Hierzu werden die Seiten inklusive der JS Dateien und Bilder im Cache des CDN gespeichert, gegebenenfalls optimiert sowie auf ihre Funktionalit\u00e4t \u00fcberpr\u00fcft. Die Website-Inhalte werden bei Anforderung \u00fcber das auf HTTP 2.0 basierende Content Delivery Network ausgegeben.<\/p>\n<h3>Wo liegt der Vorteil von AMP?<\/h3>\n<p>Der gro\u00dfe Vorteil der Accelerated Mobile Pages ist die sehr kurze Ladezeit bei mobilne Websites. Neben dem eigenen HTML-Code sorgen die eigene JavaScript-Bibliothek, das sehr schlanke CSS von weniger als 50 KB und der Google CDN Cache daf\u00fcr, dass der Inhalt einer mobilen Website nicht in einem Zug, sondern nach und nach geladen wird. So werden zum Beispiel zun\u00e4chst nur das Layout, Text und das Titelbild der Website geladen. Bilder, weiterer Text und andere Inhalte von externen Ressourcen folgen im Hintergrund in der Reihenfolge ihrer Priorit\u00e4t. Das bedeutet f\u00fcr den Nutzer, dass er schon durch den Text der Website scrollen kann, w\u00e4hrend im Hintergrund der gr\u00f6\u00dfte Teil des Inhaltes nachgeladen wird.<\/p>\n<h3>Was sind die Nachteile von Websites auf der Basis von AMP?<\/h3>\n<p>Mit Accelerated Mobile Pages k\u00f6nnen durch die Restriktionen beim CSS verschiedene Layout Optionen f\u00fcr Websites, wie Animationen oder \u00dcberg\u00e4nge nicht genutzt werden. \u00c4hnliches gilt f\u00fcr Formulare, die wegen des stark verschlankten HTML nicht dargestellt werden k\u00f6nnen. Eingesetzt werden darf JavaScript Code nur in Extensions, in denen beispielsweise Facebook- oder Twitter-Embeds ausgef\u00fchrt werden und Javascript von Drittanbietern darf nur in einer Sandbox wie iframe ausf\u00fchrt werden . Allerdings kann nach Aussage von Google jede Seite auch mit AMP ihr eigenes Werbenetzwerk und alle Werbeformate nutzen. Dies jedoch unter der Voraussetzung, dass der User dadurch in seiner Experience nicht beeintr\u00e4chtigt wird. Ebenso sollen Accelerated Mobile Pages verschiedene Abodienste und Paywalls problemlos unterst\u00fctzen. Insofern sind bei der Nutzung von Accelerated Mobile Pages keine Nachteile zu erwarten.<\/p>\n<h3>Wer nutzt AMP?<\/h3>\n<p>Die Nutzer der ersten Stunde waren 30 renommierte, internationale Verlage und Medienh\u00e4user. Darunter aus Deutschland Spiegel Online, FAZ, Sport 1, Bild, S\u00fcddeutsche Zeitung und Welt, um nur ein paar zu nennen. Von Anfang an dabei gewesen ist auch <a href=\"https:\/\/quantenfrosch.at\/onpage-optimierung-wordpress-seo-tipps\/\">WordPress<\/a>. Mittlerweile ist der zweite CMS Bolide Joomla ebenfalls mit von der Partie. F\u00fcr beide CMS sind Erweiterungen erh\u00e4ltlich, die die Nutzer bei der Umsetzung unterst\u00fctzen. Die Zahl der AMP Nutzer insbesondere aus der Welt der Medien und gro\u00dfen Informationsportale w\u00e4chst beinahe t\u00e4glich. F\u00fcr alle Teilnehmer ergeben sich durch die schnellen mobilen Seiten Vorteile, wie etwa eine bessere Positionierung im Nachrichten\u00fcberblick, ein besseres Ranking der Website und geringere Absprungraten der User.<\/p>\n<h5>Ein Blick in die Zukunft der AMP<\/h5>\n<p>Selbst in der erst kurzen Zeitspanne von der Einf\u00fchrung bis heute zeichnet sich sehr deutlich ab, dass der Einsatz von Accelerated Mobile Pages f\u00fcr ernsthafte Blogbetreiber und Medienh\u00e4user unverzichtbar sein wird beziehungsweise schon ist, wenn sie gegen\u00fcber ihren Konkurrenten nicht das Nachsehen haben wollen. Websites auf der Basis des Frameworks haben die zufriedeneren User und erzielen durchweg eine h\u00f6here Platzierung in den organischen Suchergebnissen von Google. Mit an Sicherheit grenzender Wahrscheinlichkeit kann man davon ausgehen, das AMP eine Grundvoraussetzung sein wird, wenn die eigene mobile Website bei Google gefunden werden soll. Dies insbesondere vor dem Hintergrund, dass Google bereits 2010 den <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\" target=\"_blank\" rel=\"noopener noreferrer\">Page Speed<\/a> zu einem seiner Rankingfaktoren gemacht hat. Die rasante Geschwindigkeit der AMP wird in Zukunft sicher auch ein interessantes Thema f\u00fcr moderne E-Commerce Anwendungen sein. Auf die weitere Entwicklung und Verbreitung der Accelerated Mobile Pages kann man also gespannt sein.<\/p>\n<h5>AMP und Wordpress<\/h5>\n<p>F\u00fcr Wordpress stehen Plugins zur Verf\u00fcgung, die eine einfache Integration ins Content Management System erm\u00f6glichen sollen. Da AMP jedoch eine noch relativ junge Technologie ist, k\u00f6nnen Inkompatibilit\u00e4ten mit dem Wordpress Theme oder anderen Plugins auftreten. Oft findet man das passende Plugin erst nach ein wenig herumexperimentieren.<\/p>\n<p><strong>AMP Plugins f\u00fcr Wordpress<\/strong><\/p>\n<ul class=\"square\">\n<li><a href=\"https:\/\/de.wordpress.org\/plugins\/accelerated-mobile-pages\/\" target=\"_blank\" rel=\"noopener noreferrer\">AMP for WP &#8211; Accelerated Mobile Pages<\/a><\/li>\n<li><a href=\"https:\/\/de.wordpress.org\/plugins\/amp-supremacy\/\" target=\"_blank\" rel=\"noopener noreferrer\">AMP Supremacy<\/a><\/li>\n<li><a href=\"https:\/\/de.wordpress.org\/plugins\/amp\/\" target=\"_blank\" rel=\"noopener noreferrer\">AMP<\/a><\/li>\n<li><a href=\"https:\/\/codecanyon.net\/item\/wp-amp-ninja-accelerated-mobile-pages-for-wordpress\/17626811?s_rank=2\" target=\"_blank\" rel=\"noopener noreferrer\">WP AMP Ninja<\/a><\/li>\n<li><a href=\"https:\/\/codecanyon.net\/item\/wp-amp-accelerated-mobile-pages-for-wordpress-and-woocommerce\/16278608?s_rank=3\" target=\"_blank\" rel=\"noopener noreferrer\">WP AMP \u2014 Accelerated Mobile Pages for WordPress and WooCommerce<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Eine kure Ladezeit ist heute ein entscheidender Faktor f\u00fcr den Erfolg oder Misserfolg vor allem bei mobil genutzten Internetseiten. Ein wachsender Anteil der Internetnutzer verwendet mobile Endger\u00e4te f\u00fcr den Einkauf<\/p>\n","protected":false},"author":6,"featured_media":205,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","rank_math_title":"Was sind Accelerated Mobile Pages (AMP)?","rank_math_description":"AMP, Accelerated Mobile Pages soll Surfern auf mobilen Endger\u00e4ten durch verk\u00fcrzte Ladezeiten eine verbesserte Nutzererfahrung bringen.","rank_math_focus_keyword":"amp"},"categories":[10],"tags":[56],"class_list":["post-206","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-design","tag-performance"],"_links":{"self":[{"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/posts\/206","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/comments?post=206"}],"version-history":[{"count":0,"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/posts\/206\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/media\/205"}],"wp:attachment":[{"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/media?parent=206"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/categories?post=206"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/quantenfrosch.at\/blog\/wp-json\/wp\/v2\/tags?post=206"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}