1. Faster Load Time

Accelerated mobile pages are all about speed. The entire project was founded on the idea that mobile users expect results quicker, so pages adjusted for smartphone use should load at optimal speeds. Naturally, this means that some of the more complex pieces of back-end programming had to be pragmatically reduced in order to favor efficiency.

So, how do AMPs make pages load faster?

For one thing, content rendering never stops. See, normal pages obey a loading order specified by the underlying code which the browser follows to the letter, rendering each part by turn. This means that, until certain loading criteria isn’t met, the next piece of content on the page won’t load. A third-party script (such as an ad) could, for example, take longer to load, stalling the entire rendering process. As you can guess, this makes things slower.

The AMP framework resolves this issue by making all its own components load simultaneously, while at the same time not allowing any sort of script that can impede that one golden rule of parallel rendering. Essentially, all the interactive features in the page will be handled by custom AMP elements designed to never interfere with performance.

This doesn’t mean your pages can’t enjoy some Javascript, of course. There are ways to create dynamic and interactive content within the AMP framework, as long as it is handled with caution.

Asset-independent layout. Usually, browsers need every single asset on the page loaded before they actually know what the page will look like. This is because the layout includes various images, media elements and scripts that need to load before their size and even their effect on the page can be known. In AMP, all of this is handled through the HTML, so even before any of these elements load, the browser knows what the layout will be because size has already been established and predetermined in the underlying code. This is called “static layouting”, and it allows pages to load at once without waiting for other resources.

Inline, size-bound CSS.  AMPs only allow a single stylesheet. By limiting the number of CSS, they reduce the HTTP requests to just a single one. Not only that, but the CSS size is restricted to 50 kilobytes, which is ample enough for some nice degree of design while still forcing the developer to use clean and efficient coding.

Font optimization. Normal websites wait until everything else is loaded before downloading the rather large fonts often used on pages. Because AMPs limit the CSS and use of external scripts, the system requires no HTTP requests until the font has been downloaded.

Minimal style and layout recalculations. This is again related to the fact that dynamic scripts on normal websites can have an impact on the page layout, changing it based on interactions by the user, which in turn forces the browser to recalculate how the content will look. The limits put in place by the AMP framework reduces the need for these sort of calculations.

CPU vs. GPU image acceleration. When a CPU renders a page, it uses layers for the images, then sends the media to the GPU (graphics card) for further actions. AMP only allows images to be handled directly by the GPU, which makes load times significantly shorter.

Prioritizing resource loading. The AMP framework prioritizes resources that are likely to be seen by the user. This means everything above the fold, but also resources that are predicted as important, which can be pre-fetched prior to loading precisely because of the static layouting. Basically, the information is there and ready to use but only renders when a user actually needs to see it.

As mentioned, AMPs are about speed. This means other aspects of the page come second to performance. Your ideal web design may need to be altered, with some details sacrificed in order to fully embrace the speed enhancements granted by AMPs. If you are unwilling to change that design, then weigh your options carefully and decide whether your mobile visitors would rather have a page with all the bells and whistles you envisioned, or one that loads almost instantaneously. Just remember that, in this mobile-friendly era, faster gratification might be a more valued asset in terms of user experience.

Want to learn more?

2. Lower Bounce Rate

Recent research by Google found that, not only do mobile users expect fast loading times, but their expectations play a vital role on their decision to stay.

Their study found that load times of up to three seconds have a bounce rate of over 30%. Up to five seconds, that bounce raise increases to a whopping 90%. At the six second mark, the rate surpasses 100%.

What this means for mobile pages is that optimization is crucial in order to survive and stay ahead of the competition. By this logic, and given the mobile browsing market share, having mobile-friendly websites will make or break businesses. By making load times almost immediate, accelerated mobile pages can be the one factor that sets your company apart.

3. Higher Performance And Flexibility

AMPs are not the only framework out there designed to improve mobile website performance. It is, however, the most flexible one in terms of granting access to a streamlined stylesheet, and the one with the best speed results precisely because it is built around the idea that mobile users want their content immediately.

While this in no way means other alternatives – such as Responsive Web Design or Progressive Web Apps – should be dismissed, it is worth asserting the importance of giving this very viable option proper consideration.

Mobile Search Engine Optimization (AMP SEO)

Performance and speed are very important factors in terms of retaining and converting visitors, no doubt, but in order to drive traffic to the website you need to rank in search engines.

As we mentioned, the AMP Project is backed by Google based on the increased mobile browsing trends, which means they vest this particular subject with a lot of importance. In fact, in 2018 the search engine giant rolled out mobile-first indexing, which assigns ranks based on just how friendly pages are for mobile navigation.

This means the usual best practices necessary for efficient SEO as part of your digital marketing strategy are no longer enough. Making your website mobile-friendly, and, in fact, optimizing it with the use of the very framework backed by Google, means your company has a better chance of ranking higher in results pages.

AMP pages with structured data can appear in the Top stories carousel, host carousel of rich results, Visual stories, and rich results in mobile Search results. These results can include images, page logos, and other interesting search result features.

Here's an example of JSON-LD code on an AMP page with Article structured data:

            <html amp>
    <title>Article headline</title>
    <script type="application/ld+json">
      "@context": "https://schema.org",
      "@type": "NewsArticle",
      "mainEntityOfPage": {
        "@type": "WebPage",
        "@id": "https://google.com/article"
      "headline": "Article headline",
      "image": [
      "datePublished": "2015-02-05T08:00:00+08:00",
      "dateModified": "2015-02-05T09:20:00+08:00",
      "author": {
        "@type": "Person",
        "name": "John Doe"
       "publisher": {
        "@type": "Organization",
        "name": "Google",
        "logo": {
          "@type": "ImageObject",
          "url": "https://google.com/logo.jpg"

Find out more info on structured data for AMP here.

Need help implementing mobile compatibility on your website?

AMP: Yes or No

AMPs are not without some setbacks, of course. As mentioned, you likely will not be able to fully replicate your normal web design if it’s too complex and charged with dynamic elements. This can be sidestepped with some clever programming, but it will require creativity and patience.

Also, the framework does not naturally allow for Google Analytics tracking because of its heavy reliance on cached information, but this too can be fixed with rather simple solutions readily available.

While these can be points of contention against the use of AMPs, the simple truth is that users are now more inclined to favor speed above all else, so in the act of balancing things out, your company may very well choose pragmatism over aesthetics.

Implementing mobile compatibility on your website is a vital part of your web design. Using the accelerated mobile pages (AMP) framework will not only help your business stay on top of trends, but boost your website traffic and stay ahead of the competition.



O8 is a web and digital marketing consultancy based in Minneapolis, MN offering expert-level UX Design, CRO, and strategic consulting, as well as highly-technical capabilities in Drupal, WordPress, and HubSpot

We work differently from traditional agencies in that we extend your team with ours.