Why AMP Pages Might Be A Bad Idea For Your Site

We all have experience with AMP pages, whether you realize it or not. Google is trying to make the web a more uniform experience, where the only distinction between website is the content – not the speed, or ads, or any of the other quirks that normally hinder the experience of a website. As a result, you often see the little “lightning icon” in the search results as shown here:

This means that the page to which you’re about to click through is an “AMP” page. These have the following characteristics:

1. Served from Google Cache

Unlike normal web pages which come from your origin server or (in special cases) your CDN, AMP pages are served directly from Google – arguably the biggest CDN network in the world! So you’re guaranteed to have blazing fast load times if the user sees an AMP page instead of the regular one on your site.

2. No 3rd Party Javascript

This is arguably the biggest difference between AMP and normal pages. AMP articles have no 3rd party Javascript in them. If it’s necessary, you can encode it in special iFrames with a sandbox. This speeds up loading, and doesn’t block the page from rendering.

3. All CSS is Inline

No more external stylesheets. In-line CSS with a limit of 50KB is all you can have. Since content is blocked while the browser downloads CSS via an extra HTTPS request, this sees a significant improvement in speed.

So AMP is Great Right?

Not exactly. It might seem that AMP is the ultimate solution to page speed issues – why wouldn’t you want your pages to load fast, and be preferred by Google.

The reason is that AMP can sometimes completely destroy the intended user experience for your site. Here are my top 3 reasons for avoiding AMP on certain pages:

1. Tables are Not Responsive

Lots of pages use tables to display structured data. Particularly since Google itself is partial to tabular information and often uses it in featured snippets. The problem comes when you try and display a table on a mobile page. There are all sorts of tricks we can use to shrink our table for small screens – like making them scrollable, or collapsing the columns into rows, and many other innovative solutions.

Unfortunately, none of these are AMP compatible. The AMP standard doesn’t allow the “overflow:auto” CSS rule, and so tables are cut off on the right-hand side. This makes AMP pages useless for displaying any table with more than say 3 short columns.

For me personally, this is a deal breaker because I love to display tables in my posts.

2. Unintended Javascript Reliance

Most people don’t realize the amount of Javascript they have on their page. It might seem like just a regular page with HTML and images. But in reality, there’s a lot going on behind the scenes. Just as an example, one of my most valuable plugins is a Table of Contents or “TOC” shortcode which uses Javascript to generate a Table of Contents based on my headings.

This plugin works by scanning the page after it’s rendered and adding the ToC afterward. If I display the page via AMP, it’ll all vanish! AMP has a very strict set of allowed Javascript in special circumstances, and this renders most implementations useless.

Do you display code on your site that a user can click on to copy? Forget about using it with AMP!

3. Often No Comment Sections

This one particularly bugs me because I love to read comments from users on articles. And a lot of big websites either have their own custom build comments that include Javascript or load it via a third-party service like Disqus.

In both scenarios, AMP pages completely hide all comments. This means that when I see an article I like, I have to manually search for the non-AMP version to read the comments. Especially on apps like Google News which doesn’t give you the option to switch to the original page in the top bar.

For these reasons, AMP is a double-edged sword. I only use it on pages where I’m sure I won’t have any additional elements that are integral to the user experience. I suggest you make the same determination on a case-by-case basis as well.