We already took a look at the essential features and principles of the AMP pages, but how this actually will help us getting our pages more easily to get discovered by the potential viewers and eventually – clients. How this whole thing and the efforts we'll put in providing AMP alternatives to our pages will affect the actual traffic being led to our pages?
First of all, since AMP is a Google backed up project, the pages containing AMP mirrors (or being initially created only as AMP) are most probably will get cached on the most popular search engine's servers – like Google itself, Pinterest, Twitter and so on – probably in time more will be added to this list. So, when a user clicks on the result pointing to your AMP pages, it's very probably the content being displayed on user's device to come not from your server but from the search engine's cache itself, which in turn will automatically mean the content will probably load much faster and without adding a bandwidth weight to your own server. From user's point of view, this should mean almost instant response as a very first impression from your page which might eventually raise the amount of returning visitors depending of course on the quality of the content you showcase as well. This is for the starters.
Additionally standing behind the AMP project Google more or less sends the internet a message – these pages are fast. In this line of thoughts, the history with the mobile ready pages is more or less about to get repeated. As the responsive web pages in the near past (or the ones passing Google's mobile friendly test) were rated higher and displayed up in the list while the searching has been done from a mobile device – so should and will the AMP get pushed above in the list which should drastically improve the hits on them from searches, especially when AMP is more or less new as a standard. And as we all well know – the usage of mobile devices vs desktops and laptops for accessing the net rises up each year.In this line of thoughts, it's logical to conclude that the sooner you spare some time and efforts creating AMP versions of your precious content out in the web – the better for making it easily discoverable and eventually – raise a number of visitors you'll get.
How to make AMP pages discoverable by the crawlers, especially in case we still want to keep our regular web pages? Accelerated Mobile Pages is a great speed improvement, but still – as the name states - it's more or less oriented to the mobile devices. This is done by adding an additional tag in your regular pages like
<link rel="amphtml" href=" ~ your AMP page address here ~ "> And as stated in the HTML overview – adding the corresponding tag in the AMP page itself:
<link rel="canonical" href="https://www.example.com/url/to/full/document.html">
Additionally, it is a good idea hosting your AMP pages on an URL related to your main site – like https:\\my.main.site\amp\ and use structured data tags to better describe your content and therefore – make it easier for the crawlers to get what's going on. In return, the search engine will place your results closer to the top. That's why script tags like <script type="application/ld+json"> are allowed in AMP .
And since this is more or less quite a vast area to cover, here is a brief reference you could take a look at in case this got you interested. Personally, we think it's worth since this is more or less like adding the Open Graph meta tags – no one requires them but it sure is a pleasure seeing your pages shared exactly the way you were imagining them all around.
In a number of scenarios, you might wish to have both equally a non-AMP and an AMP version of the very same page with an AMP Header, as an example, an informational article. Think about this: In case Google Search spots the non-AMP version of that web page, precisely how does it know there is undoubtedly an AMP variation of it?
Just to fix this kind of problem, we add in relevant information around the AMP Layout Template webpage to the non-AMP webpage and the opposite way, in the form of <link> tags in the <head>.
Add in the following to the non-AMP page:
<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">And this specific to the AMP page:
<link rel="canonical" href="https://www.example.com/url/to/full/document.html">In case you only have one web page, and this certain web page is really an AMP web page, you need to still incorporate the canonical URL to it, which will then just simply lead to itself:
<link rel="canonical" href="https://www.example.com/url/to/amp/document.html">Sometimes a third-party website (that sets your AMP web page or provides web links to it) requires to know more concerning your page in addition to the information that it is definitely an AMP web page. The questions a platform might probably question pertaining to your webpage are things like "Are you an informational article?", " Or even a video clip?", or else "Do you have a screenshot and short description?".
This really isn't just specific for AMP web pages but for all pages. For some platforms, this metadata is additional, for various others, it is a condition, showing they will not show hyperlinks to your web content assuming that you didn't incorporate the appropriate metadata. Make sure you include the appropriate metadata for the platforms you need your web content to appear on.
Schema.org supplies accessible vocabs to include meta data to every type of things. When it comes to AMP webpage builder, the properties that make sense in context utilize the specific type of web content ( such as ' information article'), the headline, the published date, and related preview images.
Some example:
<script type="application/ld+json">
"@context": "http://schema.org",
"@type": "NewsArticle",
"mainEntityOfPage": "http://cdn.ampproject.org/article-metadata.html",
"headline": "Lorem Ipsum",
"datePublished": "1907-05-05T12:02:41Z",
"dateModified": "1907-05-05T12:02:41Z",
"description": "The Catiline Orations continue to beguile engineers and designers alike -- but can it stand the test of time?",
"author":
"@type": "Person",
"name": "Jordan M Adler"
,
"publisher":
"@type": "Organization",
"name": "Google",
"logo":
"@type": "ImageObject",
"url": "http://cdn.ampproject.org/logo.jpg",
"width": 600,
"height": 60
,
"image":
"@type": "ImageObject",
"url": "http://cdn.ampproject.org/leader.jpg",
"height": 2000,
"width": 800
</script>These are pretty much the ways AMP can aid you achieving higher places in the search engine's results. It pretty much all narrows down to three things – use valid AMP (which means no validation errors in the debugger), host them properly and don't forget to add some appropriate structured data description tags – as easy as that!