How to use AMP.
What they are, how to create and customize them.
The Accelerated Mobile Pages Project (AMP) is an open-source initiative to improve the performance of web contents and ads through a publishing technology known as AMP.
It is a project launched by Google, specifically targeted at news sites and blogs to facilitate the loading speed of mobile pages.
An AMP version page is a HTML, CSS and Javascript-based page(like the others), but it has restrictions based on rules and specific tags that, by eliminating many elements that "slow down" the site, allows a marked reduction of page weight and loading time.
Why use AMP?
In addition to the explicit advantages in terms of speed of loading, which also correspond to a better ranking in terms of research, it seems that Google has an extra eye on this type of pages by giving them more weight and better SEO ranking.
Learn more here
1. AMP layout
Each platform has a default AMP layout that includes the widgets needed to compose it.
The layout is called AMP Default and is located in Layout Editor > Layout > Type: Article - Mode: Mobile.
Since Google is very demanding and having many restrictions, many custom widgets (which you will see within the layout) have been created to meet its requests. They can be customized only in style and in a few parameters (the editable parameters are present in the widget description).
N.B. Therefore, the classic widgets that are used in the mobile article can't be used.
The default layout is neutral: neutral colors (white / black / gray scale) have been used so that you can customize it with the customer's colors or requests. The same for the font: a sans serif one was used that can be replaced with that of customer site.
You can see the amp article default preview here
(Look at it by inspecting item and simulate mobile)
25/10/2017
10/08/2018