Accelerated Mobile Pages – AMP

[et_pb_section admin_label=”section” transparent_background=”off” allow_player_pause=”off” inner_shadow=”off” parallax=”off” parallax_method=”on” padding_mobile=”off” make_fullwidth=”off” use_custom_width=”off” width_unit=”off” custom_width_px=”1080px” custom_width_percent=”80%” make_equal=”off” use_custom_gutter=”off” fullwidth=”off” specialty=”off” disabled=”off”][et_pb_row admin_label=”Row”][et_pb_column type=”4_4″][et_pb_image admin_label=”Image” src=”https://www.blueskydigitalstrategy.com/wp-content/uploads/2016/11/Elements-AMP.jpg” alt=”Google’s Accelerated Mobile Pages” title_text=”Google’s Accelerated Mobile Pages” show_in_lightbox=”off” url_new_window=”off” use_overlay=”off” animation=”off” sticky=”off” align=”center” force_fullwidth=”off” always_center_on_mobile=”on” use_border_color=”off” border_color=”#ffffff” border_style=”solid” /][/et_pb_column][/et_pb_row][et_pb_row admin_label=”Row” make_fullwidth=”off” use_custom_width=”off” width_unit=”off” custom_width_px=”1080px” custom_width_percent=”80%” use_custom_gutter=”off” gutter_width=”3″ custom_padding=”0px|0px|27px|0px” padding_mobile=”off” allow_player_pause=”off” parallax=”off” parallax_method=”on” make_equal=”off” column_padding_mobile=”on” parallax_1=”off” parallax_method_1=”on” parallax_2=”off” parallax_method_2=”on” parallax_3=”off” parallax_method_3=”on” parallax_4=”off” parallax_method_4=”on” disabled=”off”][et_pb_column type=”4_4″][et_pb_text admin_label=”Text” background_layout=”light” text_orientation=”left” use_border_color=”off” border_style=”solid” disabled=”off” border_color=”#ffffff”]

Here at Blue Sky Digital Strategy, we are fanatical about website and server performance.  We employ a variety of tools to eek out as much speed as we can from our servers and site configurations.  Google is all about the user experience (UX), and PageSpeed is a factor in ranking.  Ever notice just how bare-bones http://www.google.com is?  It is the essence of simplicity because Google wants it to be the fastest loading page out there.

Open Source Accelerated Mobile Pages

Google, Twitter and WordPress have led the way in speeding up websites for mobile users whose speed and bandwidth have lagged behind traditional Wi-Fi.  It used to be that we built specialized mobile websites on separate domains for slow-loading mobile devices.  Then came mobile responsiveness.  Now, welcome the AMP Project — short for Accelerated Mobile Pages — a Google/Twitter/WordPress-supported open source project that allows any publisher to load pages at lightning speed on mobile devices.  Touting the tagline, “Instant Everywhere,” you may have seen a tiny AMP showing up next to some results in Google searches on your mobile device.  Click on one of them, and you’ll find it loads blazingly fast without any need to pinch or expand the window to read the text.  Welcome to the benefits of AMP.

There are a few competing standards for simplified websites to load better and faster on mobile. Facebook has their own Instant Pages specification, which was recently released as a WordPress plugin earlier this year.  We’ll get into that in a future post as there is a little more set up involved.

What is AMP?

Accelerated Mobile Pages is a standard made up of three parts.  AMP HTML is a new flavor of HTML with some significant restrictions. The result is reliable performance. There are also some extensions for building rich content beyond basic HTML.  The AMP Javascript (AMP JS) library implements quick rendering of AMP HTML pages through best performance practices.  AMP JS manages resource loading and makes everything coming from external resources load asynchronously.  Basically, there’s nothing left that can block rendering of content.  Finally, the Google AMP Cache can be used to serve cached AMP HTML pages.  This cache is essentially a free Content Delivery Network (CDN) that caches AMP pages.

For more details on the AMP Project, have a look at the Project’s pages on the subject.

What do I Need to Implement AMP?

Glad you asked ;).  If you’re running WordPress, it’s really quite easy.  The collaboration between Google and Automattic has given us the WordPress AMP plugin that takes care of most of the heavy lifting.  If you’re also running the Yoast SEO plugin, they have released the Glue for Yoast SEO & AMP plugin that takes care of the rest.  The Glue for Yoast SEO & AMP plugin allows you to choose a different logo for AMP pages if you like as well as set the styling of content and link.  It also adds an extra “sanitizer” class beyond those in the WordPress AMP plugin to remove additional invalid attributes.  Furthermore, if you’re also running MonsterInsights, your AMP pages will be tracked automatically.

Once you’ve installed and configured these two plugins, you should be good to go.  Just add /amp to the end of any of your posts (pages are not currently supported, but on their way), and your AMP page will be served up.  These pages will be added to Google and the AMP Cache over time and should give you a bump in your organic page rankings.

Tip:  Don’t set a Featured Image for your posts.  If you do, they’ll be displayed twice in AMP and Facebook Instant Pages.  While not a horrible problem for AMP, FBIP will not allow your page to be published with two “similar” images.

Update 2/11/17:

One problem with Accelerated Mobile Pages has been the inability to share the original, non-AMP, source URL.  Last week Google rolled out a fix for this.  Now when you hit the “share” button, you will be sharing the original source URL.  No more cutting and pasting from the URL bar and removing the “/amp.”  Facebook Instant Articles (FBIA) had this feature all along.

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Scroll to Top
Call now!