Raxix Technologies Blog

Get the latest technological updates about website design & development, Search Engine and Mobile Application Market etc.

What is Google AMP project and how to create AMP pages on website?

Accelerated Mobile Pages was first come out in October 2015. AMP is a project started by Google along with some other companies like Twitter. Their main aim is to improve the performance of the web pages on mobile devices.

The main focus of this project is to provide the web pages that load and execute fast in portable devices like mobiles, tablets, phablets etc and are easy to read and navigate.

Google take one step further to increase the experience of mobile users by providing them featured loaded page (contents, images, videos,) which loads instantaneously.

These days mobile phones and tablets have changed the way we access information from the web. A normal people spend most of their time on using portable devices rather than PC. Mobile users take the advantages of AMP, it helps to reach thousands of readers around the web.

 

accelerated mobile pages

 

Web Developers have done a huge workout in creating mobile friendly responsive websites and implementing guidelines of Google’s “mobile-friendly” algorithm to get better result in search results.

Logically, the industry is now focusing on improving speed, particularly with the sharp rise in mobile device usage.

AMP mainly consist of 3 elements:-

AMP HTML – AMP normally contain an HTML 5 doctype, so it is not much different from normal HTML.

AMP JS – Used to load Java script library.

Google AMP Cache – Google will cache a copy of your AMP webpage for you on its servers and send its copy of your page to your user  

How to add AMP pages on the website?

Structure of AMP HTML document:-

 

create amp pages

 

1. AMP pages must start with the <!doctype html> and contain <html amp> tag.

2 It may also contain <HEAD> and <BODY> tags.

3. Use <link rel=”canonical” href=”$SOME_URL” /> tag inside the head.

4 Write <meta charset=”utf-8″> tag as the first child of their head tag.

5 Write <meta name=”viewport” content=”width=device-width,minimum-scale=1″> tag inside their head tag. It’s also recommended to include initial-scale=1.

6 Write <script async src=”https://cdn.ampproject.org/v0.js”></script> tag in the end of head to load AMP JS library.

If you run a blog or a news website then make sure your site supports (AMP) Accelerates Mobile Pages.

 

Top 3 WordPress Plugins for AMP

If you are using WordPress CMS then you can use the following plugins.

AMP Plugin

Glue for Yoast SEO & AMP

Facebook Instant Articles & Google AMP Pages by PageFrog

These AMP plugins provide additional advantages when it comes to page performance on small screen devices.

Hope, above post will help you to create AMP pages for your website. If you still face any problem you can contact us for the solution.


Leave a Reply

Your email address will not be published. Required fields are marked *

Categories

Recent Posts