{"id":3835,"date":"2016-10-12T07:51:55","date_gmt":"2016-10-12T07:51:55","guid":{"rendered":"http:\/\/blog.whoopapp.com\/?p=3835"},"modified":"2018-09-13T13:10:01","modified_gmt":"2018-09-13T13:10:01","slug":"amp-ecommerce-guide","status":"publish","type":"post","link":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/","title":{"rendered":"Accelerated Mobile Pages For Ecommerce"},"content":{"rendered":"<p>On September 20, 2016, Google made a major step towards improving the user experience of searchers: search results on mobile got AMP&#8217;ed. AMP is the abbreviation for Accelerated Mobile Pages and promises to speed up mobile websites 7x to 30x faster than normal times faster than normal. In this post, you&#8217;ll get a deep dive into AMP and if AMP is important for retailers and their E-Commerce business.<\/p>\n<p>&nbsp;<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\"><p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<\/div><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#1-what-is-amp\" >1. What is AMP?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#2-why-an-accelerated-web-is-needed\" >2. Why an accelerated web is needed<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#3-amp-%e2%80%93-a-brief-definition\" >3. AMP &#8211; \u00a0A brief definition<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#4-how-does-it-work\" >4. How does it work<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#5-does-google-reward-amp-with-a-better-ranking\" >5. Does Google reward AMP with a better ranking?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#6-how-to-use-tracking-with-amp\" >6. How to use tracking with AMP<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#7-how-you-can-profit-from-amp\" >7. How you can profit from AMP<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#8-amp-and-shopping-cart-systems\" >8. AMP and shopping cart systems<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#9-amp-decision-guide\" >9. AMP Decision Guide<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#10-what-about-google-shopping\" >10. What about Google Shopping?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#11-amp-conclusion\" >11. AMP: Conclusion<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#12-resources\" >12. Resources<\/a><\/li><\/ul><\/nav><\/div>\n<h2 id=\"1\"><span class=\"ez-toc-section\" id=\"1-what-is-amp\"><\/span>1. What is AMP?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-3851 size-medium alignleft\" src=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-news-example-175x300.png\" alt=\"example screenshot of amp news\" width=\"175\" height=\"300\" srcset=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-news-example-175x300.png 175w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-news-example-768x1317.png 768w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-news-example-597x1024.png 597w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-news-example.png 1240w\" sizes=\"auto, (max-width: 175px) 100vw, 175px\" \/><\/p>\n<p>AMP is an approach to <strong>make mobile websites faster<\/strong> and reduce unnecessary elements which increase the loading time of websites. If you search on Google, all AMP powered sites are highlighted by a small lightning symbol and the AMP stroke.<\/p>\n<p>&nbsp;<\/p>\n<p>Google is testing AMP with some publishers since Oktober 2015. <strong>Now AMP is available also for non-publisher sites and many big players are already using it<\/strong>. <a href=\"https:\/\/www.ampproject.org\/learn\/who\/\">A complete list can be found on the AMP website.<\/a>\u00a0Google also integrated AMP into search since October 2016.<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"2\"><span class=\"ez-toc-section\" id=\"2-why-an-accelerated-web-is-needed\"><\/span>2. Why an accelerated web is needed<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>Akamai, one of the biggest content delivery network providers, <a href=\"https:\/\/www.akamai.com\/us\/en\/multimedia\/documents\/content\/akamai-performance-matters-key-consumer-insights-ebook.pdf?mkt_tok=eyJpIjoiTm1VeVpqRmhaR1l5TUdFNSIsInQiOiJsNnVUYkVaSVBhY2JPckRiSDlPOXZcL0dSUGJSbjJJWkx2d2l1bStJQTJ2TjhJQTZVNkd2VFdjSTFqMWdJaVRkeUc5cG5yM1czdURHVkk3SmxqbFVHR1JETVptSE52WWJQTnpOcERVb2Z4V0U9In0%3D\">published a study in 2015 where they declared that the average loading time of web pages\u00a0is 23 seconds<\/a>. <strong>The goal of every developer should be a website with almost no loading time<\/strong>. Usability and User Experience guru <a href=\"https:\/\/www.nngroup.com\/articles\/response-times-3-important-limits\/\">Jakob Nielsen<\/a> made three simple rules regarding the response time of websites:<\/p>\n<p>&nbsp;<\/p>\n<ul>\n<li>0.1 second is about the limit for having the user feel that the system is reacting instantaneously, meaning that no special feedback is necessary except to display the result.<\/li>\n<\/ul>\n<ul>\n<li>1.0 second is about the limit for the user&#8217;s flow of thought to stay uninterrupted, even though the user will notice the delay. Normally, no special feedback is necessary during delays of more than 0.1 but less than 1.0 second, but the user does lose the feeling of operating directly on the data.<\/li>\n<\/ul>\n<ul>\n<li>10 seconds is about the limit for keeping the user&#8217;s attention focused on the dialogue. For longer delays, users will want to perform other tasks while waiting for the computer to finish, so they should be given feedback indicating when the computer expects to be done. Feedback during the delay is especially important if the response time is likely to be highly variable, since users will then not know what to expect.<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p>Note: <strong>Even one second is enough to distract users.<\/strong> There is also a proven correlation between a long loading time and bounce rate of users: the longer it takes, the more users leave your page. It is also proven that the <a href=\"https:\/\/blog.kissmetrics.com\/loading-time\/?wide=1\">performance of websites affects the shopping behavior of users<\/a>: 40% abandon a website that takes more than 3 seconds to load.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/blog3.gif\" data-rel=\"lightbox-image-0\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-3915 size-medium alignleft\" src=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/blog3-300x268.gif\" alt=\"amp loading time\" width=\"300\" height=\"268\" \/><\/a><\/p>\n<p>Based on the Akamai report, KISSmetrics.com says that an E-Commerce website which makes $100,000 per day, \u00a0could potentially <strong>lose $2.5 million in sales every year if a page has a delay of just 1 second!\u00a0<\/strong>Again: Bad and slow\u00a0landing pages or shops <strong>will definitely have impact on your conversion rate!<\/strong><\/p>\n<p>There are several reasons why the response and loading time of today&#8217;s websites\u00a0is significantly higher than a few years ago:<\/p>\n<p>&nbsp;<\/p>\n<ol>\n<li>Modern web frameworks let developers use more and more effects and animations. And many developers making use of that. Often this effects are just eye-candy and do not support the user experience. Your web shop\u00a0<a href=\"https:\/\/startupsventurecapital.com\/your-ui-isn-t-a-disney-movie-703f7fbd24d2#.fiismm8ir\">is not a Disney movie<\/a>!<\/li>\n<li>Images and videos got more and more important. One example: there are many web shops\u00a0which encourage their\u00a0customers to post video reviews or upload their own images. Customers are not only consumers anymore, there are now prosumers (= a person who consumes AND produces media\/content). Maybe you already have seen such videos and images on amazon.com:<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amazon-prosumer.png\" data-rel=\"lightbox-image-1\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-3839\" src=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amazon-prosumer-1024x714.png\" alt=\"example of a prosumer on amazon\" width=\"650\" height=\"453\" srcset=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amazon-prosumer-1024x714.png 1024w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amazon-prosumer-300x209.png 300w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amazon-prosumer-768x535.png 768w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amazon-prosumer.png 1748w\" sizes=\"auto, (max-width: 650px) 100vw, 650px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>3. There are much more possibilities of interactions. Color selectors or 3D product previews are just a few examples.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Offering more features, effects and interactions will always cause a higher page load and might increase your bounce rate. AMP-based pages are one method to avoid long and annoying loading times.<\/strong><\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"3\"><span class=\"ez-toc-section\" id=\"3-amp-%e2%80%93-a-brief-definition\"><\/span>3. AMP &#8211; \u00a0A brief definition<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>AMP\u00a0turns back the hands of time: reduced effects and more focus on content. AMP reduces external JavaScript or Ads to boost the page performance. AMP is an open-source project supported by Google and was founded on the initiative of many publishers and technology companies. The goal: <strong>improve the mobile experience.<\/strong><\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"4\"><span class=\"ez-toc-section\" id=\"4-how-does-it-work\"><\/span>4. How does it work<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>The magic behind AMP is simple: Instead of one HTML document, you have two documents on your server. <strong>One &#8220;regular&#8221; HTML file, and a second one which contains the AMP tags.<\/strong> Don&#8217;t worry, the AMP file looks almost the same. Inside the AMP HMTL file, is a canonical link pointing to the regular HTML file. The following graphic is a simplified explanation of how the process looks like:<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-overview.png\" data-rel=\"lightbox-image-2\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-3919 size-medium alignleft\" src=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-overview-300x233.png\" alt=\"amp-overview\" width=\"300\" height=\"233\" srcset=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-overview-300x233.png 300w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-overview-768x597.png 768w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-overview-1024x796.png 1024w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>AMP offers similar web components which are used on a regular HTML site but with a limited set of allowed technical functionality. Also, <strong>no third party scripts<\/strong> are allowed. Instead of using two, three or even more additional frameworks to\u00a0optimize the mobile experience, the AMP team offers AMP JS. This is just a single JavaScript framework which manages resource handling and asynchronous loading.<\/p>\n<p>&nbsp;<\/p>\n<p>Another performance hack is the use of an optional Content Delivery Network (CDN). The CDN will take your AMP pages and cache them automatically to improve performance. Caching is a quite common solution\u00a0and you are not forced to use the Google CDN. Other vendors can also offer AMP caching.<\/p>\n<p>But now let&#8217;s have a look at how an AMP file is structured. For all who know how to read HTML, here is a quick and easy to read example how the markup looks like:<\/p>\n<pre><span style=\"color: #3366ff;\">&lt;!doctype html&gt;<\/span>\r\n<span style=\"color: #3366ff;\">&lt;html \u26a1&gt;<\/span>\r\n<span style=\"color: #3366ff;\"> &lt;head&gt;<\/span>\r\n<span style=\"color: #3366ff;\">  &lt;meta <\/span><span style=\"color: #339966;\">charset=\"utf-8\"<\/span><span style=\"color: #3366ff;\">&gt;<\/span>\r\n<span style=\"color: #3366ff;\">   &lt;link <\/span><span style=\"color: #339966;\">rel=\"canonical\" href=\"index.html\"<\/span><span style=\"color: #3366ff;\">&gt;<\/span>\r\n<span style=\"color: #3366ff;\">  &lt;meta <\/span><span style=\"color: #339966;\">name=\"viewport\" content=\"width=device-width,minimum-scale=1,initial-scale=1\"<\/span><span style=\"color: #3366ff;\">&gt;<\/span>\r\n \r\n<span style=\"color: #3366ff;\"> &lt;style&gt;<\/span><span style=\"color: #339966;\">body {opacity: 0}<\/span><span style=\"color: #3366ff;\">&lt;\/style&gt;<\/span>\r\n<span style=\"color: #3366ff;\"> \r\n&lt;noscript&gt;<\/span>\r\n<span style=\"color: #3366ff;\"> &lt;style&gt;<\/span><span style=\"color: #339966;\">body {opacity: 1}<\/span><span style=\"color: #3366ff;\">&lt;\/style&gt;<\/span>\r\n<span style=\"color: #3366ff;\">&lt;\/noscript&gt;<\/span>\r\n<span style=\"color: #3366ff;\"> &lt;style <span style=\"color: #ff0000;\">amp-custom<\/span>&gt;<\/span>\r\n HER COMES YOUR CUSTOM CSS CODE\r\n<span style=\"color: #3366ff;\"> &lt;\/style&gt;<\/span>\r\n<span style=\"color: #3366ff;\"> \r\n&lt;script async <\/span><span style=\"color: #339966;\">src=\"https:\/\/cdn.ampproject.org\/v0.js\"<\/span><span style=\"color: #3366ff;\">&gt;&lt;\/script&gt;<\/span>\r\n<span style=\"color: #3366ff;\"> &lt;\/head&gt;<\/span> \r\n<span style=\"color: #3366ff;\">\r\n&lt;body&gt;<\/span>Hello World!<span style=\"color: #3366ff;\">&lt;\/body&gt;<\/span> \r\n<span style=\"color: #3366ff;\">\r\n&lt;\/html&gt;<\/span><\/pre>\n<p>&nbsp;<\/p>\n<p>An experienced developer sees it at the first sight: <strong>there is not that much difference to a regular HTML5 structure<\/strong>.<\/p>\n<p>In a nutshell, these are the optimizations supported by AMP HTML:<\/p>\n<ul>\n<li>Replace image references with images sized to the viewer\u2019s viewport<\/li>\n<li>Inline images that are visible above the fold<\/li>\n<li>Inline CSS variables<\/li>\n<li>Preload extended components<\/li>\n<li>Minify HTML and CSS<\/li>\n<\/ul>\n<p>All these optimizations result in higher page speed and (hopefully) to a reduced bounce rate.<\/p>\n<p>AMP pages are not just text. Here are some supported components:<\/p>\n<ul>\n<li>Carrousel<\/li>\n<li>Lightbox<\/li>\n<li>Images<\/li>\n<li>Audio<\/li>\n<li>Videos<\/li>\n<li>Accordion<\/li>\n<li>Social Share<\/li>\n<li>Sidebar<\/li>\n<\/ul>\n<p>A full list of all components can be found <a href=\"https:\/\/www.ampproject.org\/docs\/reference\/components\">here.<\/a><\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"5\"><span class=\"ez-toc-section\" id=\"5-does-google-reward-amp-with-a-better-ranking\"><\/span>5. Does Google reward AMP with a better ranking?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>At the moment, there is no indicator that your site will rank better if you integrate AMP.\u00a0Gary Illyes, Webmaster Trends Analyst at Google said earlier this year:\u00a0&#8220;Currently, AMP is not a mobile ranking factor.\u201d\u00a0Also, John Mueller, Google Webmaster Trends Analysts said:\u00a0\u201cIs AMP a ranking signal? At the moment, it is not a ranking signal.\u201d\u00a0<strong>But be careful<\/strong>! A good mobile performance (regardless if you&#8217;re using AMP or not) is always rewarded with a better user experience, hence better rankings. And AMP is just one part of the game to optimize mobile page speed.<\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"6\"><span class=\"ez-toc-section\" id=\"6-how-to-use-tracking-with-amp\"><\/span>6. How to use tracking with AMP<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>Tracking traffic and conversions is essential. <strong>Not using external scripts does not mean you can&#8217;t track your AMP sites<\/strong>. Here is a quick example of how you enable tracking if you are using Google Analytics: There are two steps to enable the regular Google Analytics tracking.<\/p>\n<p><strong>Step 1:<\/strong> Insert the AMP analytics script to the head (before you insert AMP JS library) of your page:<\/p>\n<pre class=\"prettyprint notranslate\"><code><span class=\"tag\" style=\"color: #3366ff;\">&lt;script<\/span> <span style=\"color: #993366;\"><span class=\"atn\">async<\/span> <span class=\"atn\">custom-element<\/span><\/span><span class=\"pun\">=<\/span><span class=\"atv\" style=\"color: #339966;\">\"amp-analytics\"<\/span><span class=\"pln\">\r\n\u00a0 \u00a0 <\/span><span class=\"atn\" style=\"color: #993366;\">src<\/span><span class=\"pun\">=<\/span><span class=\"atv\" style=\"color: #339966;\">\"https:\/\/cdn.ampproject.org\/v0\/amp-analytics-0.1.js\"<\/span><span class=\"tag\"><span style=\"color: #3366ff;\">&gt;&lt;\/script&gt;<\/span><\/span><\/code><\/pre>\n<p>&nbsp;<\/p>\n<p><strong>Step 2:<\/strong> Now you need to insert another short snippet into the body of your page. For detailed information, you should check out the <a href=\"https:\/\/developers.google.com\/analytics\/devguides\/collection\/amp-analytics\/\">Google Analytics<\/a> and <a href=\"https:\/\/www.ampproject.org\/docs\/guides\/analytics\/analytics_basics.html\">AMP documentation<\/a>. But here&#8217;s an example how this code snippet could look like:<\/p>\n<pre id=\"crayon-57fb8b63ce60d147881958-1\" class=\"crayon-line\"><span style=\"color: #3366ff;\"><span class=\"crayon-o\">&lt;<\/span><span class=\"crayon-v\">amp<\/span><span class=\"crayon-o\">-<\/span><span class=\"crayon-e\">analytics <\/span><\/span><span class=\"crayon-v\" style=\"color: #993366;\">type<\/span><span class=\"crayon-o\">=<\/span><span style=\"color: #339966;\">\u201c<span class=\"crayon-e\">googleanalytics<\/span>\u201d<\/span><span class=\"crayon-o\" style=\"color: #3366ff;\">&gt;<\/span>\r\n<span style=\"color: #3366ff;\"><span class=\"crayon-ta\">&lt;script <\/span><span class=\"crayon-e \">type<\/span><span class=\"crayon-o\">=<\/span><span class=\"crayon-s\">\"application\/json\"<\/span><span class=\"crayon-o\">&gt;<\/span><\/span>\r\n<span class=\"crayon-sy\">{<\/span>\r\n<span class=\"crayon-h\">\u00a0<span style=\"color: #339966;\">\u00a0<\/span><\/span><span class=\"crayon-s\" style=\"color: #339966;\">\"vars\"<\/span><span class=\"crayon-o\">:<\/span> <span class=\"crayon-sy\">{<\/span>\r\n<span class=\"crayon-h\">\u00a0\u00a0\u00a0\u00a0<\/span><span class=\"crayon-s\" style=\"color: #339966;\">\"account\"<\/span><span style=\"color: #339966;\"><span class=\"crayon-o\">:<\/span> <span class=\"crayon-s\">\"UA-XXXXX-Y\"<\/span><\/span>\r\n<span class=\"crayon-h\">\u00a0\u00a0<\/span><span class=\"crayon-sy\">}<\/span><span class=\"crayon-sy\">,<\/span>\r\n<span class=\"crayon-h\">\u00a0<span style=\"color: #339966;\">\u00a0<\/span><\/span><span style=\"color: #339966;\"><span class=\"crayon-s\">\"triggers\"<\/span><span class=\"crayon-o\">:<\/span><\/span> <span class=\"crayon-sy\">{<\/span>\r\n<span class=\"crayon-h\">\u00a0\u00a0\u00a0\u00a0<\/span><span style=\"color: #339966;\"><span class=\"crayon-s\">\"trackPageview\"<\/span><span class=\"crayon-o\">:<\/span> <\/span><span class=\"crayon-sy\">{<\/span>\r\n<span class=\"crayon-h\">\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><span style=\"color: #339966;\"><span class=\"crayon-s\">\"on\"<\/span><span class=\"crayon-o\">:<\/span> <span class=\"crayon-s\">\"visible\"<\/span><span class=\"crayon-sy\">,<\/span><\/span>\r\n<span style=\"color: #339966;\"><span class=\"crayon-h\">\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><span class=\"crayon-s\">\"request\"<\/span><span class=\"crayon-o\">:<\/span> <span class=\"crayon-s\">\"pageview\"<\/span><\/span>\r\n<span class=\"crayon-h\">\u00a0\u00a0\u00a0\u00a0<\/span><span class=\"crayon-sy\">}<\/span>\r\n<span class=\"crayon-h\">\u00a0\u00a0<\/span><span class=\"crayon-sy\">}<\/span>\r\n<span class=\"crayon-sy\">}<\/span>\r\n<span class=\"crayon-ta\" style=\"color: #3366ff;\">&lt;\/script&gt;<\/span>\r\n<span style=\"color: #3366ff;\"><span class=\"crayon-o\">&lt;<\/span><span class=\"crayon-o\">\/<\/span><span class=\"crayon-v\">amp<\/span><span class=\"crayon-o\">-<\/span><span class=\"crayon-v\">analytics<\/span><span class=\"crayon-o\">&gt;<\/span><\/span><\/pre>\n<div class=\"crayon-line\"><\/div>\n<div class=\"crayon-line\"><\/div>\n<p><a href=\"https:\/\/support.google.com\/analytics\/answer\/6343176?hl=en\">Google recommends<\/a> that you should use a separate Google Analytics property for the measurement of AMP sites. T<strong>his might be important if you want to see if want to the success of your AMP efforts, but this is not mandatory.<\/strong><\/p>\n<p>If you&#8217;re not using Google Analytics, there are also other official partners who support AMP:<\/p>\n<ul class=\"items\">\n<li class=\"item\">Adobe Analytics<\/li>\n<li class=\"item\">AT Internet<\/li>\n<li class=\"item\">Chartbeat<\/li>\n<li class=\"item\">comScore<\/li>\n<li class=\"item\">Google Analytics<\/li>\n<li class=\"item\">LiveInternet<\/li>\n<li class=\"item\">MOAT<\/li>\n<li class=\"item\">Parse.ly<\/li>\n<li class=\"item\">Quantcast<\/li>\n<li class=\"item\">SimpleReach<\/li>\n<li class=\"item\">TNS<\/li>\n<li class=\"item\">Webtrekk GmbH<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h2 id=\"7\"><span class=\"ez-toc-section\" id=\"7-how-you-can-profit-from-amp\"><\/span>7. How you can profit from AMP<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>Google\u2019s VP of Engineering David Besbris said in an interview, that their number crunching proves the success of AMP sites:<\/p>\n<ul>\n<li>AMP pages are 4x faster, use 10x fewer data compared to non-AMP pages<\/li>\n<li>On average AMP pages load in less than one second<\/li>\n<li>90 percent of AMP publishers experience higher CTRs<\/li>\n<li>80 percent of AMP publishers experience higher ad viewability rates<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignleft wp-image-3879 size-large\" src=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-single-product-example-255x1024.png\" alt=\"amp-single-product-example\" width=\"255\" height=\"1024\" srcset=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-single-product-example-255x1024.png 255w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-single-product-example-75x300.png 75w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp-single-product-example.png 750w\" sizes=\"auto, (max-width: 255px) 100vw, 255px\" \/><\/p>\n<p>Initially, the AMP project was started by 160 international publishers. But also a few big E-Commerce players already joined the project at an early stage. eBay, for example, rolled out all sites in an AMP version already. In addition, the AMP team provides a nice example of how you can use the existing AMP components for a webshop:<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>In this example for a single product page, you can spot almost all elements a product landing page should have:<\/p>\n<ul>\n<li>Title<\/li>\n<li>Buy Button<\/li>\n<li>Description<\/li>\n<li>Carousel for images<\/li>\n<li>Link to a video<\/li>\n<li>Social Buttons<\/li>\n<li>Accordions for Meta Descriptions<\/li>\n<li>Related Products including ratings<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p>You can check out this example on your own, it&#8217;s a demo site <a href=\"https:\/\/ampbyexample.com\/samples_templates\/product_listing\/\">provided by the AMP project team<\/a>. This structure is almost similar to all modern shopping cart systems. The last element shows what is also possible: Personalization and recommendations. This work with the component called<strong> amp-access<\/strong>. It allows you to add paywall and subscriptions, which means that you can show specific content for a certain user.\u00a0<strong>But there&#8217;s just one snag<\/strong>: Because of the approach that you can&#8217;t use external scripts, modern shopping cart systems also do not work. <strong>You need to redirect any request caused by a click on the buy button to a regular mobile page<\/strong>. As you can see at the roadmap of the AMP project, a better focus on E-Commerce related functionality is planned.<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>These improvements are planned for Q4 2016\/Q1 2017:<\/p>\n<ul>\n<li>Enable better mobile payments with AMP<\/li>\n<li>Enable A4A creative demand across the buyer and publisher ecosystem<\/li>\n<li>Enable deeper integration of ads with AMP-format landing pages across buyside and sellside systems<\/li>\n<\/ul>\n<p>The full roadmap can be found <a href=\"https:\/\/www.ampproject.org\/roadmap\/\">here.<\/a><\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"8\"><span class=\"ez-toc-section\" id=\"8-amp-and-shopping-cart-systems\"><\/span>8. AMP and shopping cart systems<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<h3>WooCommerce<\/h3>\n<p>There are two methods for WooCommerce (which is the leading E-Commerce platform for WordPress) to benefit from AMP: Using a <a href=\"https:\/\/codecanyon.net\/item\/wp-amp-accelerated-mobile-pages-for-wordpress-and-woocommerce\/16278608\"><strong>dedicated plugin like WP AMP<\/strong><\/a>, or <strong><a href=\"https:\/\/wordpress.org\/plugins\/amp\/\">the official WordPress AMP plugin<\/a><\/strong>. The advantage of WP AMP is, that it&#8217;s already prepared for WooCommerce. The normal WordPress AMP plugin needs some adjustments to work with WooCommerce. Depending on your technical skills you can do it on your own. There&#8217;s quite a good documentation for<a href=\"https:\/\/github.com\/Automattic\/amp-wp\">\u00a0the plugin on GitHub<\/a>.<\/p>\n<p>&nbsp;<\/p>\n<h3>Magento<\/h3>\n<p>Currently, there are not many out of the box solutions aka extensions for Magento. If you&#8217;re using Magento 1, you may try this extension:<\/p>\n<p><a href=\"https:\/\/www.magentocommerce.com\/magento-connect\/accelerated-mobile-pages-amp.html\">Accelerated Mobile Pages (AMP) extension by Plumrocket<\/a><\/p>\n<p>&nbsp;<\/p>\n<h3>Shopify<\/h3>\n<p>Shopify is known as an easy-to-use shopping cart system and they currently working on an official AMP support. Expect the support <a href=\"https:\/\/engineering.shopify.com\/225104708-shopify-merchants-will-soon-get-ampd\">for Shopify coming in Q4 2016!<\/a><\/p>\n<p>For more updates, check the Shopify\u00a0<a href=\"https:\/\/engineering.shopify.com\/\">engineering blog from time to time<\/a>.<\/p>\n<p>&nbsp;<\/p>\n<h3>PrestaShop<\/h3>\n<p>At the moment, PrestaShop does not offer any possibility to integrate AMP.<\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"9\"><span class=\"ez-toc-section\" id=\"9-amp-decision-guide\"><\/span>9. AMP Decision Guide<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>Maybe you already read it between the lines:<strong> There are not only advantages<\/strong> in using AMP and retailers should consider following pros and cons before they scare up their web developers.<\/p>\n<h3>Advantages<\/h3>\n<ul>\n<li>AMP is free to use<\/li>\n<li>more Site Traffic because of a better ranking (not because you&#8217;re using AMP, but because of a better page speed)<\/li>\n<li>faster loading on mobile can reduce the bounce rate<\/li>\n<li>more conversions (if there are no other barriers)<\/li>\n<li>Google caches your AMP sites for free<\/li>\n<li>fire and forget: once you build an AMP site, you won&#8217;t need to think of mobile performance anymore<\/li>\n<\/ul>\n<h3>Disadvantages<\/h3>\n<ul>\n<li>Twice the work: every regular HMTL page needs an equal AMP page which causes a lot more effort.<\/li>\n<li>You can only use the components which are offered by the AMP project.<\/li>\n<li>Using external scripts for more detailed analytics or functionality can be tricky.<\/li>\n<li>You still need a regular mobile site for the checkout.<\/li>\n<li>Because of the strict standards, AMP sites may look all the same (similar to the Bootstrap framework, <a href=\"https:\/\/medium.com\/swlh\/designers-will-design-developers-will-develop-and-why-you-must-stop-them-399255275593#.rvv8u5wvp\">read more about it here<\/a>\u00a0or check out <a href=\"http:\/\/adventurega.me\/bootstrap\/#\">this example page here<\/a>).<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h2 id=\"10\"><span class=\"ez-toc-section\" id=\"10-what-about-google-shopping\"><\/span>10. What about Google Shopping?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>There is no direct influence on Google Shopping. But keep in mind: If a user clicked on your Shopping Ad, <strong>a well-optimized landing page helps to raise conversions and lowers bounce rate<\/strong>. AMP sites are part of the funnel and will support you to reach your goals. The simplified flow is: search query -&gt; Shopping Ad -&gt; Landing Page -&gt; shopping cart -&gt; conversion<\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"11\"><span class=\"ez-toc-section\" id=\"11-amp-conclusion\"><\/span>11. AMP: Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<p>Free to use, faster loading time, better page speed, more traffic: AMP sounds like a must-have. In a mobile-first \u00a0E-Commerce market, this can be crucial for your success. All studies of conversion specialists show that the <strong>loading time and the page speed have a\u00a0significant impact on your overall\u00a0sales performance<\/strong>. Why are still reading when you could start immediately?<\/p>\n<p>Well, there are drawbacks. And these are as important as the advantages. <strong>Using AMP means twice the effort of time and resources.<\/strong> Maybe you can automate the process in a certain way, but you need time and knowledge. AMP does not solve all your problems. It can also cause new ones. You already spent hours and hours into a unique and good shopping experience? Too bad, because AMP only allows certain components. Another huge disadvantage is that you are not allowed to use custom JavaScript by default. Say bye to advanced tracking features or smart buy buttons. But switching to AMP could make sense if you haven&#8217;t put much effort in your mobile site yet, or if you start from scratch.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/no-amp.png\" data-rel=\"lightbox-image-3\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-3887 size-medium\" src=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/no-amp-300x179.png\" alt=\"amp meme\" width=\"300\" height=\"179\" srcset=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/no-amp-300x180.png 300w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/no-amp-768x458.png 768w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/no-amp-1024x610.png 1024w, https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/no-amp.png 2000w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>At the moment, <strong>I can&#8217;t recommend AMP because there are too many disadvantages for retailers.<\/strong> But don&#8217;t misunderstand me: the project and the overall approach is great! All stakeholders, users and retailers, will profit from a faster web. But be patient and don&#8217;t try to become an early adopter. Huge key players like eBay have the power to make this switch really fast, but many retailers just don&#8217;t have a huge developer army. <strong>Again, be patient, keep following the AMP project and maybe think about it in early 2017!<\/strong><\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"12\"><span class=\"ez-toc-section\" id=\"12-resources\"><\/span>12. Resources<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&nbsp;<\/p>\n<ul>\n<li>The AMP project &#8211; official site: <a href=\"https:\/\/www.ampproject.org\/\">ampproject.org<\/a><\/li>\n<li>Official AMP blog: <a href=\"https:\/\/amphtml.wordpress.com\/\">amphtml.wordpress.com<\/a><\/li>\n<li>AMP Tutorials: <a href=\"https:\/\/www.ampproject.org\/docs\/get_started\/create\">ampproject.org\/docs\/get_started\/create<\/a><\/li>\n<li>AMP Examples: <a href=\"https:\/\/ampbyexample.com\/\">ampbyexample.com<\/a><\/li>\n<li>The AMP Project on GitHub: <a href=\"https:\/\/github.com\/ampproject\">github.com\/ampproject<\/a><\/li>\n<li>Google Analytics AMP documentation: <a href=\"https:\/\/developers.google.com\/analytics\/devguides\/collection\/amp-analytics\/\">developers.google.com\/analytics\/amp-analytics<\/a><\/li>\n<li>Google PageSpeed Tools: <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/\">developers.google.com\/speed\/pagespeed\/<\/a><\/li>\n<li>Google Webmaster Blog: <a href=\"https:\/\/webmasters.googleblog.com\">webmasters.googleblog.com<\/a><\/li>\n<li>Google AMP demo tool for search results (mobile only):\u00a0<a href=\"https:\/\/g.co\/AMPdemo\">g.co\/AMPdemo<\/a><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>On September 20, 2016, Google made a major step towards improving the user experience of searchers: search results on mobile got AMP&#8217;ed. AMP is the abbreviation for Accelerated Mobile Pages and promises to speed up mobile websites 7x to 30x faster than normal times faster than normal. In this post, &#8230;<\/p>\n","protected":false},"author":2,"featured_media":3901,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,7],"tags":[19,101,186,271],"class_list":["post-3835","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ecommerce","category-google-shopping","tag-amp","tag-e-commerce","tag-landing-page","tag-retail"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.7 (Yoast SEO v27.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>AMP (Accelerated Mobile Pages) For E-Commerce - A Complete Guide<\/title>\n<meta name=\"description\" content=\"With AMP you can accelerate mobile websites. But is it really useful for your ecommerce businesses? Read the whole guide!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Accelerated Mobile Pages For Ecommerce\" \/>\n<meta property=\"og:description\" content=\"With AMP you can accelerate mobile websites. But is it really useful for your ecommerce businesses? Read the whole guide!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/\" \/>\n<meta property=\"og:site_name\" content=\"smec Blog | Follow current Ecommerce News, Trends &amp; Insights\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/SmarterEcommerce\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/SmarterEcommerce\" \/>\n<meta property=\"article:published_time\" content=\"2016-10-12T07:51:55+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-09-13T13:10:01+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Viljem Pitako\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@smec\" \/>\n<meta name=\"twitter:site\" content=\"@smec\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Viljem Pitako\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"13 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/\"},\"author\":{\"name\":\"Viljem Pitako\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#\\\/schema\\\/person\\\/c6200eef79ddd0b39b891e6b4c9d4a5f\"},\"headline\":\"Accelerated Mobile Pages For Ecommerce\",\"datePublished\":\"2016-10-12T07:51:55+00:00\",\"dateModified\":\"2018-09-13T13:10:01+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/\"},\"wordCount\":2491,\"publisher\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/wp-content\\\/uploads\\\/2016\\\/10\\\/amp.png\",\"keywords\":[\"AMP\",\"E-commerce\",\"Landing Page\",\"retail\"],\"articleSection\":[\"Ecommerce\",\"Google Shopping\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/\",\"url\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/\",\"name\":\"AMP (Accelerated Mobile Pages) For E-Commerce - A Complete Guide\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/wp-content\\\/uploads\\\/2016\\\/10\\\/amp.png\",\"datePublished\":\"2016-10-12T07:51:55+00:00\",\"dateModified\":\"2018-09-13T13:10:01+00:00\",\"description\":\"With AMP you can accelerate mobile websites. But is it really useful for your ecommerce businesses? Read the whole guide!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#primaryimage\",\"url\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/wp-content\\\/uploads\\\/2016\\\/10\\\/amp.png\",\"contentUrl\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/wp-content\\\/uploads\\\/2016\\\/10\\\/amp.png\",\"width\":1920,\"height\":1080,\"caption\":\"amp ecommerce guide\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/ecommerce\\\/amp-ecommerce-guide\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Accelerated Mobile Pages For Ecommerce\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#website\",\"url\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/\",\"name\":\"smec Blog | Follow current Ecommerce News, Trends &amp; Insights\",\"description\":\"smec - Smarter Ecommerce\",\"publisher\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#organization\",\"name\":\"smec - Smarter Ecommerce\",\"url\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/wp-content\\\/uploads\\\/2022\\\/04\\\/smec-company-logo.png\",\"contentUrl\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/wp-content\\\/uploads\\\/2022\\\/04\\\/smec-company-logo.png\",\"width\":500,\"height\":389,\"caption\":\"smec - Smarter Ecommerce\"},\"image\":{\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/SmarterEcommerce\",\"https:\\\/\\\/x.com\\\/smec\",\"https:\\\/\\\/www.instagram.com\\\/smarterecommerce\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/smarter-ecommerce-gmbh\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UCgEKAonH-2IoV2fIDyCJFMA\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/#\\\/schema\\\/person\\\/c6200eef79ddd0b39b891e6b4c9d4a5f\",\"name\":\"Viljem Pitako\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9ba2db500e949e76555855a477c9f99f860d3fdc8740b84c47da3756e7abcd46?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9ba2db500e949e76555855a477c9f99f860d3fdc8740b84c47da3756e7abcd46?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9ba2db500e949e76555855a477c9f99f860d3fdc8740b84c47da3756e7abcd46?s=96&d=mm&r=g\",\"caption\":\"Viljem Pitako\"},\"description\":\"Viljem is a true web enthusiast. He has a real interdisciplinary view on technical and economical problems.\",\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/SmarterEcommerce\",\"https:\\\/\\\/at.linkedin.com\\\/pub\\\/viljem-pitako\\\/38\\\/a9\\\/66a\",\"https:\\\/\\\/x.com\\\/smec\"],\"url\":\"https:\\\/\\\/smarter-ecommerce.com\\\/blog\\\/en\\\/author\\\/pitako\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"AMP (Accelerated Mobile Pages) For E-Commerce - A Complete Guide","description":"With AMP you can accelerate mobile websites. But is it really useful for your ecommerce businesses? Read the whole guide!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/","og_locale":"en_US","og_type":"article","og_title":"Accelerated Mobile Pages For Ecommerce","og_description":"With AMP you can accelerate mobile websites. But is it really useful for your ecommerce businesses? Read the whole guide!","og_url":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/","og_site_name":"smec Blog | Follow current Ecommerce News, Trends &amp; Insights","article_publisher":"https:\/\/www.facebook.com\/SmarterEcommerce","article_author":"https:\/\/www.facebook.com\/SmarterEcommerce","article_published_time":"2016-10-12T07:51:55+00:00","article_modified_time":"2018-09-13T13:10:01+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp.png","type":"image\/png"}],"author":"Viljem Pitako","twitter_card":"summary_large_image","twitter_creator":"@smec","twitter_site":"@smec","twitter_misc":{"Written by":"Viljem Pitako","Est. reading time":"13 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#article","isPartOf":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/"},"author":{"name":"Viljem Pitako","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#\/schema\/person\/c6200eef79ddd0b39b891e6b4c9d4a5f"},"headline":"Accelerated Mobile Pages For Ecommerce","datePublished":"2016-10-12T07:51:55+00:00","dateModified":"2018-09-13T13:10:01+00:00","mainEntityOfPage":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/"},"wordCount":2491,"publisher":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#organization"},"image":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp.png","keywords":["AMP","E-commerce","Landing Page","retail"],"articleSection":["Ecommerce","Google Shopping"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/","url":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/","name":"AMP (Accelerated Mobile Pages) For E-Commerce - A Complete Guide","isPartOf":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#primaryimage"},"image":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp.png","datePublished":"2016-10-12T07:51:55+00:00","dateModified":"2018-09-13T13:10:01+00:00","description":"With AMP you can accelerate mobile websites. But is it really useful for your ecommerce businesses? Read the whole guide!","breadcrumb":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#primaryimage","url":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp.png","contentUrl":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2016\/10\/amp.png","width":1920,"height":1080,"caption":"amp ecommerce guide"},{"@type":"BreadcrumbList","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/ecommerce\/amp-ecommerce-guide\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/smarter-ecommerce.com\/blog\/en\/"},{"@type":"ListItem","position":2,"name":"Accelerated Mobile Pages For Ecommerce"}]},{"@type":"WebSite","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#website","url":"https:\/\/smarter-ecommerce.com\/blog\/en\/","name":"smec Blog | Follow current Ecommerce News, Trends &amp; Insights","description":"smec - Smarter Ecommerce","publisher":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/smarter-ecommerce.com\/blog\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#organization","name":"smec - Smarter Ecommerce","url":"https:\/\/smarter-ecommerce.com\/blog\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#\/schema\/logo\/image\/","url":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2022\/04\/smec-company-logo.png","contentUrl":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-content\/uploads\/2022\/04\/smec-company-logo.png","width":500,"height":389,"caption":"smec - Smarter Ecommerce"},"image":{"@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/SmarterEcommerce","https:\/\/x.com\/smec","https:\/\/www.instagram.com\/smarterecommerce\/","https:\/\/www.linkedin.com\/company\/smarter-ecommerce-gmbh","https:\/\/www.youtube.com\/channel\/UCgEKAonH-2IoV2fIDyCJFMA"]},{"@type":"Person","@id":"https:\/\/smarter-ecommerce.com\/blog\/en\/#\/schema\/person\/c6200eef79ddd0b39b891e6b4c9d4a5f","name":"Viljem Pitako","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/9ba2db500e949e76555855a477c9f99f860d3fdc8740b84c47da3756e7abcd46?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/9ba2db500e949e76555855a477c9f99f860d3fdc8740b84c47da3756e7abcd46?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9ba2db500e949e76555855a477c9f99f860d3fdc8740b84c47da3756e7abcd46?s=96&d=mm&r=g","caption":"Viljem Pitako"},"description":"Viljem is a true web enthusiast. He has a real interdisciplinary view on technical and economical problems.","sameAs":["https:\/\/www.facebook.com\/SmarterEcommerce","https:\/\/at.linkedin.com\/pub\/viljem-pitako\/38\/a9\/66a","https:\/\/x.com\/smec"],"url":"https:\/\/smarter-ecommerce.com\/blog\/en\/author\/pitako\/"}]}},"_links":{"self":[{"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/posts\/3835","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/comments?post=3835"}],"version-history":[{"count":7,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/posts\/3835\/revisions"}],"predecessor-version":[{"id":5701,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/posts\/3835\/revisions\/5701"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/media\/3901"}],"wp:attachment":[{"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/media?parent=3835"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/categories?post=3835"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/smarter-ecommerce.com\/blog\/en\/wp-json\/wp\/v2\/tags?post=3835"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}