How-To: Instapage | Accelerated Mobile Pages (AMP)

Owned by
Megan Bostwick
Last updated: Mar 19, 2024 by
Savannah Wrenn
2 min read

Google has a Mobile First Index

  • The mobile first index takes precedence over Google’s traditional desktop index and will serve the most appropriate results based on the device being searched on.

  • This further incentivizes the need for webmasters to implement a fully responsive design that is personalized for users on any device.

  • Google has attempted to make this transition easier for webmasters by creating its open source initiative that leverages stripped down HTML files to create fast and mobile-friendly copies of webpages. These are referred to as Accelerated Mobile Pages (AMP), which are distinguished by a lightning bolt symbol in mobile search results.

  • The choice to adopt AMP for your website should seem obvious when considering these factors:

    • Webpage speed is a ranking factor of Google’s mobile and desktop indexes

    • A 1-second delay in web page speed can decrease conversions by as much as 7 percent (Kissmetrics)

    • AMP is rumored to be a ranking factor in their mobile first index (AMP was created by Google)

  • AMP Pages are no longer limited to news carousel results.

  • The Official WordPress Plugin is released

  • Accelerated mobile pages (AMP) are essentially stripped down HTML copies of existing webpage content that offer faster load times than standard HTML5 documents. Websites can serve AMP pages by implementing the rel=amphtml tag into their HTML. Pages with AMP code contain a three-step AMP configuration.

    • HTML: A stripped down and unique markup of traditional HTML code with unique tags.

    • JS: Used to fetch resources and stripped down to eliminate unnecessary rendering.

    • CDN: An optimized network designed to cache pages and adapt them to AMP code immediately.

  • AMP also reduces the need for additional CSS requests and eliminates certain onpage eliminates, including bulky pictures, CTAs in many cases, and much more backend code. This has the effect of increasing speed greatly.

  • While AMP caching does offer improved speeds and is probably favored by Google search results, adopting AMP for your website does come with a few caveats.

    • For starters, AMP only works if users click on the AMP version of a webpage, (shows a lightning bolt) as opposed to the canonical version. Studies have shown that the AMP library can reduce the number of server requests to fetch a document by as much as 77 percent, but the AMP version is not always served if it’s not implemented correctly.

    • Tracking data from AMP pages over Analytics, Ads or even DoubleClick is still fairly limited, although analytics for this is growing.

    • Most of all, implementing AMP means sacrificing a lot of UX elements of your webpage. AMP HTML prioritizes efficiency over say, creativity. But more tangibly, not only are you missing out on rendering some images on your site, AMP pages only allow one advertisement tag per page. Also, implementing this code was incredibly difficult before the WordPress plugin.