Accelerated Mobile Pages (AMP) – even faster mobile websites

Accelerated Mobile Pages (AMP) – even faster mobile websites

Nowadays, speed is a decisive factor for Internet users. The amount of time that a page takes to load determines whether visitors stay on a website or not. In particular, the increasing use of mobile Internet calls for fast mobile websites.

A newly developed framework is now aimed at providing the required speed. The open source Accelerated Mobile Pages project ensures that mobile web pages load faster through the rendering of static HTML content. Google plans to integrate AMP websites in its search results starting February 2016.

This article shows what the Accelerated Mobile Pages project is about and outlines the possible effects that the framework could have on the search.

Goal and functioning principle of AMP

The basic objective of AMP is to reduce the page loading times in order to make sure that mobile Internet users are contented. It has long been clear that action is needed in this area. According to Google, about two-fifths of the users usually leave a website if it takes longer than 3 seconds to load. With AMP, web content should now be availed within milliseconds. Even the more complex content, e.g. videos or high-resolution images, should now load faster.

The functioning principle of AMP is relatively easy to explain. The source code of website’s content has been reduced to a minimum are temporarily stored on a proxy server in a content delivery network. They can then be loaded quickly from there when the corresponding document is called on the Internet. Here, it should not matter what device (smartphone or tablet) is used.

The AMP framework is based on three components:

  1. AMP HTML: This is a modified form of HTML that can be interpreted by all servers. Only one http request is sent per page download.

  2. AMP JavaScript: AMP only allows asynchronous JavaScript. This guarantees fast rendering of the website since no external resources can be blocked. Third-party JavaScript can only be loaded through iframes, which also have no influence on the rendering of the main content.

  3. AMP Content Delivery Network: AMP documents are compiled and saved temporarily on different proxy servers. Loading the documents through the content delivery network takes place via http 2.0. This also checks if the AMP page is functional.

Furthermore, additional tuning allows for higher loading speeds. Here, the file size of external data sources should be specified in the HTML document e.g., for images, advertisements, or iframes. AMP uses these data to determine the position and size of the corresponding element before it is downloaded. AMP also prioritizes the download files. In addition, only inline styles that have a maximum of 50 kilobytes are allowed for CSS.

Special features for the implementation

The HTML code of AMP websites should ideally be adapted in some sections e.g., when embedding images, videos, or iframes. All tags are given the prefix “amp”.

Example of an added image file:

Note: Some tags, such as “embed”, are not allowed in AMP pages. A preliminary list of the required tags can be found on GitHub.

The following tags are required for an AMP document:

Type of document:

Top-Level-Tag tag ( also works)

and Tags

Canonical Link in the section:

Coding in the section:

Viewport in the section:

Reference to AMP-CDN in the section:

Specification of the opacity:

Tip: Publishers can also optimize their AMP pages in terms of color (background color, text color). This can be done using