Ac­cel­er­ated Mobile Pages (AMP) take mobile internet surfing to the next level. At least that is the idea behind Google’s recently published tech­no­logy. This open source project is hosted on the platform GitHub (and will continue to be) and was created to rival similar services offered by the com­pet­i­tion, such as Apple News (Apple) and Instant Articles (Facebook). In addition, the projects play a crucial role within the Digital News Ini­ti­at­ive (DNI) by promoting digital journ­al­ism. How do these new mobile sites work? And who can use them?

What’s behind AMP?

One of the most important char­ac­ter­ist­ics of modern web de­vel­op­ment is short loading times. Since a large portion of internet traffic now takes place on mobile devices and over a mobile data con­nec­tion, web de­velopers are con­stantly on the lookout for ways to optimise mobile display. Ac­cel­er­ated Mobile Pages offer static web content an al­tern­at­ive. These pages are char­ac­ter­ised by a special HTML code, which Google refers to as AMP HTML. Articles pro­grammed with this code are loaded in two steps:

  • The ele­ment­ary units of the page (the specified layout) begin to load directly after the user clicks
  • Ad­di­tion­al content such as text, images, and external resources start to load in the back­ground, depending on the priority. This allows users to scroll through the text before the cover image has even loaded, for example

As well as the AMP HTML code, the project's JavaS­cript library (AMP JS library), Google AMP Cache, and a sleek CSS (less than 50 KB) are re­spons­ible for technical im­ple­ment­a­tion. We explain the special features of the in­di­vidu­al com­pon­ents below:

AMP HTML

The HTML code of Ac­cel­er­ated Mobile Pages differs from that of regular HTML pages in that some default tags are replaced with AMP tags. This par­tic­u­larly applies to the labelling of mul­ti­me­dia content that only loads when the user requires it. In the AMP HTML code, for example, the tag <amp-img> appears in place of <img> for image in­teg­ra­tion. You can find a complete overview of the mobile Google page tags in the AMP project section on GitHub.

AMP JS library

The project’s own JavaS­cript library is in charge of loading all website elements. All external resources are handled asyn­chron­ously, meaning that the rendering process can take place without being disturbed by external in­flu­ences. The execution of IFrame elements in Sandbox mode is supported, re­strict­ing the rights of external operators. Ad­di­tion­al per­form­ance tech­niques include pre-cal­cu­la­tion of the layout and blocking of slower CSS selectors.

Google AMP Cache

Another option that Google offers is an onsite proxy-based CDN (Content Delivery Network) that delivers Ac­cel­er­ated Mobile Pages. For this purpose, all relevant AMP HTML pages are cached and optimised auto­mat­ic­ally. All relevant data (such as JavaS­cript files and images) can be found at a central location through CDN services. The cache ad­di­tion­ally uses HTTP/2 and checks mobile site func­tion­al­ity.

What does the use of ac­cel­er­ated mobile pages mean?

To date, Google has aimed its new weapon ex­clus­ively at newspaper pub­lish­ers and blog platforms like WordPress or other operators. Websites using AMP include people.com, eonline.com, and cbsnews.com. Par­ti­cipants who are also listed in the Google Newsfeed have the following ad­vant­ages through their mobile sites and through a Google search that’s cus­tom­ised to the AMP project:

  • Better position in the news overview, since AMP articles are high­lighted as ’top stories’
  • Decreased bounce rate among mobile users due to quick loading of optimised news
  • Better ranking for the website due to excellent mobile op­tim­isa­tion, even if the use of Ac­cel­er­ated Mobile Pages isn’t a direct ranking factor according to Google

Who is AMP suitable for?

Modern mobile sites play a crucial role in Google News, meaning all ambitious newspaper pub­lish­ers and blog operators should see them as a necessary re­quire­ment. They benefit from more satisfied readers, a wider reach, and better Google reviews compared to those that don’t optimise their web presence. The workload involved is re­l­at­ively low: WordPress offers bloggers the option to auto­mat­ic­ally switch to the AMP version of their website if their blogs are hosted by the WordPress company, Auto­mat­tic. Switching is a piece of cake for self-hosted blogs with the help of the WordPress AMP plugin. In contrast to most Google services, Ac­cel­er­ated Mobile Pages doesn’t take control of user data, either. Only the cached version (in Google AMP Cache) is out­sourced to the company’s server. It is likely that Google will continue to support Ac­cel­er­ated Mobile Pages in the future, which means that this tech­no­logy is necessary for everyone in the long run if they want to be found on Google. In com­bin­a­tion with the excellent speed op­tim­isa­tion, mobile websites can be a very worth­while option, es­pe­cially when it comes to e-commerce: user ex­per­i­ence when digital shopping on mobile devices is sure to become more advanced through the AMP technique.

Go to Main Menu