AMP: a mobile-first development method to boost your SEO – Part 1
Data Architecture 16 November 2018How do you react when a web page on your mobile phone takes more than 5 seconds to open? Time seems to last forever in these all too frequent situations, and chances are you will go to another site, much to the dismay of content publishers. Avoiding this type of disappointment is the whole point of AMP pages!
So how do these mobile web pages work? What are some of their assets and drawbacks, especially when it comes down to data collection?
View mobile pages faster with AMP technology
Accelerated Mobile Pages (AMP) is an open source mobile web technology launched by Google in 2015 with several partners. The purpose of AMP pages is to significantly reduce their loading time compared to traditional web pages, thus improving user experience. Publishers who wish to use this technology must therefore have 2 versions of their website: AMP (mobile) and desktop.
Pages will only be displayed in AMP format if they scrupulously comply with the rules of syntax and usage. To validate their code, developers can submit it to the AMP validator.
In order to display the content faster, the contributors of the AMP project have optimized:
– The structure of the page, by creating specific AMP-HTML tags. They use HTML W3C components, but with some restrictions and extensions.
– The design of the page, by allowing only online style sheets, limited to 50 KB, which do not cause additional HTTP requests slowing down the page display.
– The choice of JavaScript loading mode: AMP pages include only asynchronous JavaScript, i. e. several JavaScript files load simultaneously, as opposed to synchronous JavaScript where the files load one after the other. An asynchronous JavaScript file can therefore considerably reduce the display time of the first elements of a web page (images, HTML structure etc.).
– The use of JavaScript: on AMP pages, JavaScript is encoded within custom AMP-HTML elements (AMP JS library). This JavaScript is optimized but standardized. Developers do not have the ability to integrate their own scripts into the main process (but it can be integrated into an amp-iframe tag that does not slow down the page display).
– Cache memory: To reduce loading times, AMP pages are cached, or stored by Google or Cloudflare platforms and then returned to users more quickly.
Publishers’ growing interest for AMP technology
There are now 25 million domains using this format, mainly press sites for which the technology was originally intended (CNBC, The Washington Post, The Guardian, Spiegel Daily, etc.). But there is now a strong interest from e-commerce sites to integrate this technology into their environment (AliExpress, eBay).
The benefits are indeed multiple. First, it provides a better user experience with pages that are displayed almost instantly. Brands better engage with their customers and prospects on their sites, all to the benefit of conversion rates.
The second interest of migrating to AMP pages is the potential impact on the natural referencing of your site ( SEO). Indeed, the loading time of a page is a parameter taken into account by Google for its mobile search results.
Finally, the visibility of articles or products during a search on Google is greatly enhanced. AMP items are marked with a symbol that takes the form of a small flash, as shown below. They can also appear in a carousel “host” or a “top-stories” carousel inspired by Snapchat stories.
But limitations on the use of JavaScript impose new constraints on web analytics solutions
Among all the technical constraints imposed by the AMP technology, the limitation of the use of JavaScript is the most problematic since it will have a considerable impact on the way data is collected on these specific web pages.
On a traditional website, web analytics tools provide a script to integrate on each page of the site. This script loads a JavaScript library and developers call native functions of this library in their code to send data to the tool servers. The use of JavaScript is therefore almost essential in the standard use of web analytics solutions.
However, AMP pages restrict the use of JavaScript within the AMP JS library. Web analytics solutions such as Google Analytics have therefore deployed their own specific tag. However, technical constraints for users of these solutions are emerging, modifying the use of tools such as Google Tag Manager for the web.
For website publishers to massively migrate part of their infrastructure to AMP pages, there must still be continuity in data collection! And this is all the more the case for e-commerce sites, many of which use advanced tracking of e-commerce data, or “Enhanced Ecommerce”, a feature that Google Analytics offers to enrich the tracking on e-commerce sites. However, at the time of writing, the Google documentation does not explain how to proceed…
At fifty-five, we studied the integration of Google Analytics on AMP pages and tested the different possibilities for collecting advanced e-commerce data. Far from being complex, the collection of advanced e-commerce data from AMP pages can be done in many ways… So how should you proceed to transmit Enhanced Ecommerce data to Google Analytics from AMP pages? And is it possible to collect advanced ecommerce data on AMP pages with other analytics solutions (Adobe Analytics, Facebook Analytics…)?
If you want to know more, discover the rest of this article here!
