Increasing speeds on mobile

To meet users' growing expectations of faster mobile experiences - and to boost search engine rankings - there's an increased push to optimise the load time of web pages on mobile.

The Accelerated Mobile Pages (AMP) project by Google is one approach designed to achieve this.

Mobile speed matters

As users, we've developed high expectations when it comes to mobile experiences. We expect things to be fast and seamless. In reality, many mobile web pages are falling short.

Recent research suggests that 53% of site visits are abandoned if a mobile page takes longer than 3 seconds to load.

In contrast, the same study suggests faster mobile pages have higher ad viewability rates, longer average session durations and increased conversion rates.

As well as the benefits to user experience and goal conversion, Google now considers site speed as a ranking factor within its search algorithm. As it shifts towards a mobile-led approach to indexing web pages, optimising mobile page speed has become increasingly important.

What is AMP?

AMP is an open source initiative designed to help site owners create web pages that render more quickly on mobile.

AMP pages are static HTML equivalents of content-rich pages (e.g. blog article pages), which sit alongside your normal website.

They're content focused, so are often stripped back versions of a web page that pull out the core page content into an AMP template.

Google then prioritises this 'AMP-lified' version of a page (over its non-AMP equivalent) in its mobile search results, to help deliver the content as quickly and as seamlessly as possible on mobile.

How do I create an AMP template?

AMP templates use a special subset of HTML and CSS to optimise page load times. Most standard HTML tags and CSS selectors can be used unchanged in AMP templates. However, certain tags have AMP-equivalents and there are particular restrictions on how and what page styles can be loaded in.

In terms of page functionality, AMP doesn't support any custom, author-written JavaScript or JavaScript plugins. The AMP library does however come with built-in 'components' (e.g. sidebar menus, carousels, videos) as well as third-party integrations (e.g. Google Analytics, Doubleclick, Instagram, Twitter) which can be used to make pages more dynamic and interactive.

A key thing to remember is that these pages are intended to be focused on the content, so the simpler the template the better.

Does AMP work?

Research suggests that AMP has been successful for optimising mobile pages in the following areas:
• Increase in page impressions
• Increase in click-through rate (CTR) from search results pages and CTR on ads on AMP pages
• Increase in number of unique visitors
• Increase in conversion rates

Should I use AMP?

The principles behind the AMP project are a positive step for the web - focusing on delivering lightening fast content to users on mobile.
Whether or not the concept of creating separate versions of web pages is the best way to achieve that is debatable. One line of argument is that this notion is reminiscent of creating separate mobile-only sites, something we've attempted to move away from in the progression of responsive design.

What is clear though, is that a vast majority of mobile web pages are not currently meeting user expectations. AMP is one approach for addressing that challenge, and has delivered significant improvements in user engagement and conversion for brands such as Washington Post, Wired and Gizmodo. It's also currently being used by other large scale publishing websites, including the BBC, Guardian and Telegraph.

By considering AMP as an accompaniment to, rather than replacement for, responsive websites it has demonstrated it can be an effective method of accelerating the delivery of content-rich pages on mobile.