By Gregory Gragg, CEO, Gragg Advertising, Lever1 and IntegriShield
The birth of AMP
In 2015, Google announced the open-source Accelerated Mobile Pages (AMP) project to speed up the mobile web. Initially, AMP was aimed at improving performance of the mobile web in terms of how mobile web pages were rendered on mobile devices and how fast mobile content was delivered across various devices.
Google officially integrated AMP listings into its mobile search results in Feb. 24, 2016. Pages making use of AMP coding appeared within special places in the search results and/or with a special “AMP” designation.
By boosting page speed and streamlining ads (no interstitials ads or pop up ads were allowed on AMP), the aim was to improve user experience across mobile devices by eliminating the confusion and combustion on smaller screens.
In other words, AMP was bare-bones in terms of being able to provide little functionality with AMP.
However, in mid-2016 AMP for ads (and landing pages) was introduced. Since then, AMP has been greatly expanded to not only include ads, but also analytics.
AMP-enabled content pages moved out of the “top stories” section where news results are typically displayed and into main search results in August 2016.
In mid-to-late 2017, Google announced further AMP technical updates, which included:
- Scrolling animations: “parallax effects, image zooms/fade-ins, and starting or stopping animations.”
- Responsive sidebar: “improvements to amp-sidebar enable changing display format based on the width of the viewport.”
- Native video analytics support in AMP.
- Improved client ID information to enable consistent ID recognition as users migrate between AMP and non-AMP pages.
- Fluid-ad support and other features to improve ad targeting for publishers and enables publishers to request ads where the ad size is unknown.
AMP continues to be a work in progress as Google routinely updates AMP algorithms. In February 2018, Google stated that AMP and canonical pages – or pages that you want visitors to see – must match or have very “close parity.” AMP pages that do not match the content of canonical pages “will not be considered for search features that require AMP, such as the top stories carousel with AMP.”1
In other words, sites may run AMP pages but not include the complete content from the original source. This requires users to make two clicks to access the entire content as shown on the original source. Although this helps the site or company to deploy AMP coding quickly, Google sees this as a bad user experience.
For all non-compliant AMP pages, Google further states that users will be sent to the “non-AMP equivalent.” Google will notify the webmaster via search console as a manual action message for AMP errors and warnings to give the webmaster the opportunity to fix the issue before its AMP page can be served again.
Google’s algorithm already requires parity among pages, but they reinforce the consistency of AMP pages with the canonical pages and how well they match, which affects the search results.
These actions continue to reveal the direction of the requirements Google would like to see with AMP and website compliance.
Today and tomorrow prove that mobile-first remains a top priority for Google and sends a message to webmasters to get on board with optimizing their sites for AMP if they have not already. This is important to not only remain competitive in your online marketplace but also retaining parity among your AMP and canonical pages is another AMP optimization to make sure are fine tuned.
Time to get your website and landing pages “AMP’d” up
According to Google, AMP pages load four times faster and use one-tenth the data, or 10 times less data, than non-AMP pages. It is also noted that AMP-powered mobile display ads load up to five seconds faster than traditional display ads. To any business, load speed is an incredibly important factor with respect to conversions. Consistent data suggests that 40 percent of consumers will abandon a website that takes more than three seconds to load.2 In 2010, page speed was also uncovered as one of Google’s ranking factors, showing it had an impact on search engine optimization (SEO).3 Not “AMPing” your webpage hurts your bottom line.
AMP’d pages are basically stripped-down HTML pages with some AMP-specific markup coding. Google pre-renders some of these pages.
Because the clutter on a mobile webpage has been removed and the mobile browser only loads content important to the user, AMP coding improves mobile load speed to such a degree that the pages appear to load almost instantly. With AMP, the site is expected to load within two seconds or less. Well within the timeframe consumers expect.
AMP enables this rapid loading in two ways. First, it requires web developers to use an open source and an existing set of web technologies to create pages. Second, it serves pages from the Google search servers, when you visit an AMP page via a Google search.
As Google’s algorithms now include AMP criteria and continues to expand, to remain relevant, and competitive in your online market, it is more important than ever to comply with these continuing and ever evolving AMP algorithm updates.
When it comes to implementing AMP coding to meet these demands, the good news is that AMP is open source and relies on existing web technologies built in collaboration with many different partners. This makes the build of mobile pages simple by using basic HTML coding, so there is not a lot of extra work required.
When programming AMPs properly, every AMP must use the AMP JavaScript (JS) library to deliver optimum performance by adding and validating a few important rules in the site’s markup.
The most noted difference between the AMP JS and standard JS is that some elements are replaced with custom elements to ensure that the site maintains a fast loading speed in two critical situations:
- AMP JS controls the entire load chain and prioritizes certain elements over others, so that third-party elements and anything “below the fold,” are loaded only after the primary content at the top of the page.
- AMP’s custom properties require that aspect defining ratios, such as width or height are set explicitly. This allows AMP JS to know the layout of a page before any of the assets are loaded, and the page can be laid out in advance. Additional layout calculations are then eliminated preventing a half-loaded page and screen jumping as other elements continue to load.
If a site template restricts an AMP layout, the site template might have to be rewritten to accommodate the restrictions. There is a significant reduction in Cascading Style Sheets (CSS), as it needs to be inline and less than 50KB. Custom fonts must be loaded using a special AMP-font extension to allow for controlled loading.
For multimedia images, you’ll need to utilize the custom AMP-img element and must include an explicit width and height. Additionally, if your images are animated GIFs, you need to use the separate AMP-anim extended component.
To find further information on AMP technical coding requirements, the AMP Project has an official site4 and official tutorial5 on the basics of AMP and using advanced AMP features.
AMP is not going away
Not only does Google continue to work with ad networks and analytics firms to improve how they handle AMP pages, Google is also expected to have further AMP updates in the upcoming months.
As you can see, AMP is not a preference, but a requirement for any business’ site regardless of type or platform for the site to remain competitive in the future.
Sites that do not use proper AMP coding can have a negative impact on both mobile and desktop search results thus impacting UX and conversions.
Pages that utilize AMP experience 90 percent higher click-thru rates than ones that do not. Looking into the future, it is anticipated that AMP pages will be the only pages available on mobile organic search since Google is driving AMP.
The fact is in order to remain competitive in the marketplace; AMP is a must for any business. The statistics don’t lie, and consumers simply don’t have the time to wait for anything less.
Resources
- https://searchengineland.com/google-will-require-amp-canonical-pages-match-february-1-2018-286921/amp
- https://blog.kissmetrics.com/loading-time/
- https://searchengineland.com/google-speed-update-page-speed-will-become-ranking-factor-mobile-search-289904
- https://www.ampproject.org
- https://www.ampproject.org/docs/getting_started/create
GREGORY GRAGG, as CEO of Blue Chair, LLC., has more than 30 years of entrepreneurial experience in startups, acquisitions, business development, and take overs. Starting with Gragg Advertising in 1992, Greg has started four additional technology companies, purchased one and helped developed over 20 products focused on “good practices” in lead generation. He continues to be involved with day to day operations of these companies, acquisitions, and trending research in direct marketing.
Contact Information: Gregory Gragg // CEO // Gragg Advertising, Lever1, and IntegriShield // ggragg@graggadv.com // https://graggadv.com/, http://www.lever1.com/, https://integrishield.com/ // https://twitter.com/greggragg