Google AMP vs Facebook Instant Articles
Google AMP (Accelerated Mobile Pages) and Facebook Instant Articles is a technology that stores a page of the website then optimize it for mobile users.
As a mobile user, load a page from the website is a disaster. Even if the site has a responsive feature, most of them still bring some seconds to the user, some of them bring some minutes, because of the failures and imperfect of the responsive features. That's why these technologies exist.
Have you ever seen thunder marks in Google search results, Facebook News Feed, and LinkedIn home? You can only see them on your mobile devices.
LinkedIn Articles
If you found it on LinkedIn home, that is LinkedIn Article. LinkedIn Article is different from Google AMP and Facebook Instant Articles.
- LinkedIn Article is not attached to the page of your website.
- You can only make it on LinkedIn.
- You are limited to the WYSIWYG (What You See is What You Get) editor. You are not allowed to put ads, not even customize how it should look.
Facebook Instant Articles
Facebook Instant Articles is quite similar to Google AMP. Of course, it only works on Facebook. Here are what you need to make it:
- An existing Facebook page. Sure, having a website is not enough.
- An existing Facebook app ID. It is for Instant Articles API.
Here are the orders to make it:
- Register your Facebook page to use Instant Articles. There will be Instant Articles on the side menu of Publishing Tools after that.
- Create a style. The most important is putting your logo. Go to Configuration in Publishing Tools and scroll down to Styles.
- Import your articles using Instant Articles API. You can download Facebook Pages Manager on your iOS or Android devices to preview. You can use Instant Article Editor to review and correct any error or warning. Here are code samples and format references, https://developers.facebook.com/docs/instant-articles/guides/format-overview.
- Let Facebook connect to your site by putting FB Page ID on the meta tag inside the head tag. Eg:
<meta property="fb:pages" content="XXX"> - Because you are new, you need to submit your articles at least 10. Learn more at https://web.facebook.com/help/publisher/797818910402864. After getting reviewed, feel free to publish them.
Google AMP
Pages that are optimized for Google AMP take priority over Google search results of mobile. That is the benefit.
Twitter also supports Google AMP. Users will go to the AMP version of the page that shared on Twitter mobile if the page has an AMP version. Learn more at https://developer.twitter.com/en/docs/publisher-tools/amp/overview.
You need two versions of the page. Original and AMP. The original version is for the desktop. The AMP is for the mobile. Now, let's make the AMP version from the original one. Here is the instruction, https://amp.dev/documentation/guides-and-tutorials/start/converting/?format=websites. Here is AMP Boilerplate Generator that could help, https://amp.dev/boilerplate/.
Here are the points of Google AMP development:
- You could put the AMP version of your pages on a subdomain such as amp.example.com. You also could put it on example.com/amp/article or example.com/article.amp.html as an example.
- You need to include the AMP library to the bottom of the head tag,
<script async src="https://cdn.ampproject.org/v0.js"><script>. - I suggest the AMP Validator of Chrome extension for development. Or, you could put #development=1 to the URL then check the results on Chrome Developer Console.
- Provide information about your page, https://amp.dev/documentation/guides-and-tutorials/start/converting/discoverable/?format=websites.
- The most important is the tags. AMP is very sensitive. Even one error could make the page is not valid for AMP. There are special tags to add Google Analytics, Google Fonts, Carousel, Menu, etc. You can check Components and Examples.
- Create a sitemap with the AMP version of each page then submit it. Learn more at https://developers.google.com/search/docs/guides/create-URLs
- You can test the AMP page at AMP Test. It also updates the AMP Cache.
Conclusion
Having these technologies are optional exactly. It is perfect if you can have it, especially Google AMP. The most important that the website is fast both on desktop and mobile. You can check on Google PageSpeed Insights. Make sure that they have green colors. Refer to my article, PageSpeed.