So, the much anticipated news is out. Finally, Google has launched Accelerated Mobile Pages aka AMP. It’s been nearly three weeks since the launch and many publishing sites have already adopted AMPs and reaping the benefits.
By now the term AMP must sound very familiar to many of you. Don’t worry if you haven’t heard yet. When speed is the bare minimum to survive in this fast-paced world, the websites that we access day in and day out must also be pepped up.That too with the mighty boom in mobile technology, your mobile sites ought to load in a jiffy. Else, all your visitors will walk away costing you a fortune.
Google’s answer to these glitches is the amazing AMP Project. It is an open source initiative to help create mobile optimized content on pages that load swiftly, providing a better mobile web experience. Now that the AMPs are up and running, let’s dig in more about them:
What AMP Does?
If your business is to publish articles and news online, then AMP will be your savior. Many of us might frown to read on the mobile web because of the slow and slaggy experience. The same happens with a visitor when they want to find something through your site and if it’s taking ages to load. But AMPs just take that worry load off your shoulders. An accelerated mobile page at its core is an HTML page that has been designed for super-fast loading. Certain components of HTML and CSS are not used, since the platform is completely designed for enhanced readability and speed.
It comes with a set of rules for publishers and advertisers that stops the usage of heavy graphics, interactive features and ads in their articles. Google also stores different versions of the pages on its servers around the world and populates AMP articles at the top of search engine results page (SERP).
How Can You AMP Your Site?
The fundamental components of an AMP are similar to any web page but with differences here and there:
- AMP HTML: A subset of HTML with some custom tags and properties.
- AMP CDN: An optional Content Delivery Network to optimize your pages.
That being said, let’s get started.
- To begin with, you will have to maintain minimum two versions of your pages: original version and the AMP version.
- Next, rewriting your CSS to accommodate those limitations might be required. Also, a special amp-font extension for intensive custom fonts may be needed in order to load them without trouble.
- Multimedia components like images must add the custom amp-img element with defined width and height. The same applies for videos – a custom tag amp-video for locally hosted videos. For YouTube video, it is amp-youtube.
- Here comes the major part. For Google to detect the AMP version of your page, you need to include the below tag (by law!) in the original version of your page:
<link rel=”amphtml” href=”http://www.example.com/blog-post/amp/”>
- Also there’s something called Schema.org metadata. It helps specify the type of content your page hosts and makes your content eligible to appear in Google Search.
And, that much is for you. If you are a publisher or any business that loves to woo your visitors with lightning speed you ought to accelerate your thought to go AMP now.
What do you think? Will this technology suit everyone alike? Share your thoughts below.