What is Accelerated Mobile Pages ( AMP )?

Posted on October 14th, 2016

Accelerated Mobile Pages(AMP) are used to build web pages for static content that render fast. It improves the performance of mobile pages. With AMP, users can see webpages with video, animations, and graphics that would load instantaneously. No matter whether you are using a smartphone, a tablet, or any mobile device, the content will load in an instant. Smartphones have now become very popular and mobile web changed the way the phones have been used. Many publishers are now using mobile web to reach their customers, but if it takes too long to load a page, then it would affect both the customer and revenue that would have generated through ads and subscriptions so the best option is AMP. Accelerated mobile pages are used to create lightweight web pages.

 

Parts of AMP

1) AMP HTML: It is a subset of HTML or an extended HTML with custom AMP properties. This language has some custom tags and properties and many restrictions. But if you are familiar with regular HTML, it is easy to adapt existing pages to AMP HTML. Most of the tags in an AMP HTML page are regular HTML tags and some HTML tags are replaced with AMP specific tags.

2) AMP JS: It is a JavaScript framework for mobile pages and it manages resource handling and asynchronous loading. It should be noted that third-party JavaScript is not permitted with AMP. It implements all of AMP’s best performance practices and manages resource loading.

3) Google AMP Cache: It is a proxy-based content delivery network for delivering all valid AMP documents. It caches and fetches the AMP HTML pages and improves page performance automatically. It consists of a built-in validation system which confirms that the page is guaranteed to work, and that it doesn’t depend on external resources.

 

Components of AMP

AMP Components are defined by the AMP runtime and they are the aforementioned AMP-specific HTML tags you need to use instead of their regular counterpart, such as <amp-img> instead of the <img> tag.

1) Built-In Components: They’re always available in every AMP document and are built right in to the AMP runtime. There are five built-in components available they are <amp-ad> (for showing ads), <amp-img> (for images), <amp-pixel> (for tracking pixels), <amp-video> (for direct HTML5 video file embeds) and <amp-embed> (for embedded element).

2) Extended Components: These are additional components. We must explicitly include them into your AMP document. Many of them can be used to embed content from third party services.

 

Working

Accelerated Mobile Pages are like regular HTML page, but with a limited set of allowed technical functionality that is defined and controlled by the open source AMP spec. Just like all web pages, Accelerated Mobile Pages can be load in any modern browser or app web view.

AMP files provide various technical and architectural approaches that prioritize speed to provide a faster experience for users. AMP developers can use a rich and growing library of web components that provide the ability to embed rich media objects like video and social posts, display advertising, or collect analytics. The goal is not to make similar content, but instead to build a more common technical core between pages that speeds up load times. AMP files can be cached in the cloud in order to reduce the time content takes to get to a user’s mobile device. By using the AMP format, content producers are making the content in AMP files available to be cached by third parties. In this type of framework, publishers continue to control their content, but platforms can easily cache or mirror the content for optimal delivery speed to users. Google has provided a cache that can be used by anyone without cost, and all AMPs will be cached by the Google AMP Cache. Other companies may build their own AMP cache as well. The combination of limited technical functionality with a distribution system built around caching will lead to better performing pages, and increased audience development for publishers.

 

Benefits

1) Faster loading page for mobile users

2)  Improved search engine ranking

3) Increased visibility for Publishers

4) Support for Ads

5) AMP Visitor Analytics

6) AMP is open source.

 

Disadvantages

1) Limited support to for ad networks.

2) Supports only limited instruction set.

3) AMP can be difficult to implement if you’re not a developer.

4) Supports only AMP JS functions which means your own third-party JS might not be supported.

 

Difference Between AMP and Non-AMP Mobile Browsing

1) AMP pages does not have a lot of stuff for a more complex user experience.

2) AMP forces you to use a streamlined version of CSS.

3) JavaScript is not allowed at all

4) You are forced to use an off-the-shelf JavaScript library that AMP provides you with – which forces your images to load’ slowly.

 

If you need any further assistance please contact our support department.