Sunday, January 22, 2017

How to Get Your Site Featured on Single Source AMP Carousels

Search trends are changing and Google is preferring content that loads faster like the AMP powered web pages. You can see a collection of AMP pages collectively called the AMP Carousels. These pages load faster and optimize the search experience of the mobile user. Here is what an AMP page looks like in the Google search results: 




Nowadays, a new type of AMP Carousel called the "Single Source AMP Carousel" is being seen in the search results. Single source means that all the results are from the single site. The below image displays carousels from a single source like Fox Sports and Kansas City Star. 

(Image credit: Search Engine Land)

This is great news for the webmaster because getting your site on AMP Carousel and that too for more than one slides can increase your chances of diverting extra traffic to your site. Let us know understand, how you can exploit this opportunity as a search engine optimizer. 

Step 1: Create an AMP HTML Page

Create AMP specific pages for each of the pages on your site in order to allow Google to index and rank them as per the relevancy of the search query. Here is a sample code for creating your first AMP page:

<!doctype html>
<html amp lang="en">
  <head>
    <meta charset="utf-8">
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <title>Hello, AMPs</title>
    <link rel="canonical" href="http://example.ampproject.org/article-metadata.html" />
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <script type="application/ld+json">
      {
        "@context": "http://schema.org",
        "@type": "NewsArticle",
        "headline": "Open-source framework for publishing content",
        "datePublished": "2015-10-07T12:02:41Z",
        "image": [
          "logo.jpg"
        ]
      }
    </script>
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
  </head>
  <body>
    <h1>Welcome to the mobile web</h1>
  </body>
</html>

Step 2: Include an image to be displayed in the AMP Carousel. A sample code is provided below:

<amp-img src="welcome.jpg" alt="Welcome" height="400" width="800"></amp-img>

Step 3: Add Some Codes

Add the following to the non-AMP page:

<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">
And this to the AMP page:

<link rel="canonical" href="https://www.example.com/url/to/full/document.html">

Step 4: Prepare a List of Search Queries

Once you have created separate AMP versions of all your normal webpages, the next thing is to prepare a list of search queries that displays AMP Carousels where you wish to rank.

Step 5: Test Your AMP Page and Make It Even More Faster

Test your AMP page and make it as fast as possible. For example, you can get rid of all fancy images and styles. 

Step 6: Add Relevant Content

The Google AMP algorithm is still a mystery. When and how Google calculates relevancy score for displaying the AMP pages remains undisclosed. However, here are some guidelines that can help:

Step 7: Keep the Content Fresh 

Freshness is one of the biggest factors how Google ranks AMP pages. If your content is fresh, it has the highest chances of ranking higher in the carousel provided all the other factors is in your favor.

Know any other factor that works well? Please share in the comments below. 



Also See:

Importance of Backlinks in Seo
Site Wide Links
Are You Making Your Website Vulnerable to Future Google Updates?
Seo Checklist
Types of Graphs Google Uses to Rank Webpages
Universal Analytics
How to Rank in Google
Post a Comment