Your users are frustrated. Their mobile internet connections are unreliable at best, unusable at worst. They can never be sure of public Wi-Fi availability. And if that wasn’t bad enough, resource hungry apps keep bogging down their smartphones.
The last they need is a slow mobile website that takes forever to load.
To tackle this problem, Google recently launched the ‘Accelerated Mobile Pages’ (AMP) project. This project gives publishers a framework for creating faster loading web pages on mobile. By using Google AMP, you can improve your page load times and create better experiences for your mobile users.
The question now is: how does Google AMP actually work? And more importantly, how will it affect your website?
I’ll give you a brief overview of Google AMP in this post. Then I’ll help you understand how this framework will transform your website and your business.
What is Google AMP?
The AMP in Google AMP stands for ‘Accelerated Mobile Pages’. This is an open-source framework that gives publishers and developers instant access to a number of performance optimizations for mobile users. Instead of manually coding these optimizations into your website, you can plug-in Google AMP and see an immediate boost in site performance.
The best way to understand it is to think of it as a CSS framework like Bootstrap. While you can manually create all the CSS code required to create grids, fancy buttons and drop-down menus, it’s just faster to use Bootstrap’s existing code.
Broadly, Google AMP has three components:
- AMP HTML: This is a subset of regular HTML with a bunch of custom properties to help you use the AMP framework. Think of this as “diet HTML”. It removes a number of tags in order to focus on performance improvements. You can see an example of a boilerplate AMP HTML page here.
- AMP CSS: Just like AMP HTML, AMP CSS also removes several CSS properties to focus on site speed. If you’re using AMP CSS, you won’t be able to create animations and complicated transition effects.
- AMP JS: This is the Javascript framework that handles all resources and asynchronous loading. Plug a link to the JS file into your site’s header and you’re good to go. Keep in mind that you can’t use any third-party JS frameworks (such as Ember.js or Backbone.js) with AMP JS.
- AMP Cache (optional): This is a CDN that will take care of caching and delivering static resources on AMP enabled mobile pages. You don’t have to use it, but if you do, you’ll take advantage of Google’s massive network to create faster mobile experiences.
To use Google AMP, grab all the files from GitHub then follow the instructions here.
Why do you need Google AMP?
The obvious question now is: why do you even need Google AMP? Isn’t HTML 5 and (soon) HTML 6 enough for most sites?
The answer lies in three stats:
- There are nearly 2 billion smartphone users globally. Together, they consume more media on mobile devices than all desktops combined.
- Nearly 75% of mobile users feel that mobile sites load more slowly than desktop sites. 46% of mobile users will also not come back to a site with poor performance.
- A 1 second improvement in site performance leads to a 27% bump in conversion rates.
There’s another reason to use Google AMP: Facebook “Instant Articles”. This is a similar project to Google AMP, except it is closed source and only works on content shared on Facebook.
If you want your articles to load quickly on platforms other than Facebook, or if you’re an open-source champion, you need an alternative like Google AMP.
So much for the theory. What really matters now is how Google AMP will change your website and the mobile landscape.
6 Ways Google AMP Will Change Your Mobile Site
If you’re a publisher, blogger or startup, Google AMP has the potential to transform the way mobile users interact with your website. With its emphasis on speed and prioritization of “AMP”ed sites in search results, there is a good chance faster websites will win in mobile SERPs. It also points towards the future of mobile usage and how publishers should design their websites.
While this is only speculation at the moment, most signs indicate that Google AMP will change your website in the following 6 ways:
1. Mobile site performance will be a priority
Google has never been shy about its love for fast sites. It has officially counted site speed as a ranking factor since 2010. With over 50% of Google’s searches coming from mobile devices, faster websites get a ranking boost in SERPs.
Google AMP is relatively easy to implement, thanks to support from CMSes like WordPress. Your competitors will get a leg up in SERPs and in terms of user-experience by jumping on the AMP bandwagon. If you want to stay competitive, now is a good time to take a close look at your mobile site and iron out any performance kinks.
Takeaway: Mobile site performance is the new SEO. Make it a top priority if you want to stay competitive.
2. Visitors from supported platforms will have higher engagement
As of now, Google AMP is supported by several of the world’s biggest publishing and sharing platforms, including Twitter, LinkedIn, Pinterest and WordPress (full list here).
This means that AMPed sites will load faster on these platforms. A user who clicks a link to your site on Twitter, thus, will be able to access content almost instantly. This should translate into more engaged users from supported apps and platforms.
This should affect your marketing mix. If you get 10% of your traffic from a supported platform (like Twitter), and 15% from a non-supported platform (such as referral traffic), now is a good time to shift your focus to supported platforms to get more engaged users.
Takeaway: Focus your marketing efforts on supported social media sites to capture highly engaged users.
3. Expect a rankings boost for “AMPed” sites in mobile searches
Right now, sites that use AMP show up in a carousel on top of the page when you do search on your mobile device for certain keywords.
If you can deliver a stellar experience to users with minimal load times, your rankings may jump up in mobile results.
Takeaway: Implementing AMP on your site could give you a big ranking boost for most SERPs.
4. Mobile web will go “back to basics”
Google AMP places a lot of restrictions on what HTML tags, CSS properties and JavaScript frameworks you can use.
For example, the following HTML tags are permanently prohibited in AMP HTML:
- <iframe>
- <embed>
- <form>
- <input>
- <param>
- <frameset>
AMP HTML also doesn’t allow you to use any third party JS frameworks. You’re limited to the features included in AMP JS. Your CSS options are also somewhat limited. For example, you can’t use the “behavior” property, and the “transform” and “opacity” properties are only allowed with several restrictions.
All these limitations are effectively going to force publishers to go “back to basics”. All the CSS animations and JS parallax effects you see on modern websites will eventually go the way of the Dodo – at least for mobile users.
This should result in a simpler, faster mobile web. We should see a shift towards usability and speed over visual effects.
Takeaway: A simple but highly usable mobile experience is better than a visually rich but heavy mobile site.
5. JavaScript use will drop on mobile sites
In case you haven’t noticed, there is a massive spurt in the growth of JavaScript over the last few years. Thanks to frameworks like Node.js, JavaScript can now be seen handling the front and the backend of websites.
The TIOBE index even crowned JavaScript the “language of the year” in 2014. It has consistently ranked among the top 10 in-demand languages for years.
The number of JavaScript jobs has skyrocketed as well during this period. The Indeed.com job trend for three popular frameworks in different languages – Node.js (JavaScript), Ruby on Rails (Ruby), and Django (Python) – is particularly illustrative.
This is about to change, especially for mobile websites. Google AMP prohibits all third party JavaScript. You get AMP JS which takes care of all resources and gives you access to several jQuery features (such as lazy load). For anything else, you’ll either have to find complex workarounds.
This will result in a gradual decline in JS usage, at least on mobile devices.
Takewaway: JavaScript on mobile devices will see a sharp decline in demand in the next couple of years as businesses optimize for speed.
6. Ad revenues will increase
For users, there are few things more painful than mobile ads. You’ve probably seen this yourself: ads don’t scale right on mobile screens, and if they do, the experience is too slow to be even remotely useful, let alone enjoyable.
This isn’t just hyperbole; ad visibility is a major issue for most advertisers. According to one study by AdWeek, just 44% of mobile ads were viewable to users, compared with 52% for desktops.
Another NYTimes study found that mobile ads take significantly longer to load than editorial content. A mobile ad on ChicagoTribune.com, for example, took 9.5s to load vs. 3.4s for editorial content.
Google AMP should change this as well. By leveraging the AMP framework to create ads, advertisers can show you ads as fast as editorial content.
In fact, Google already has 20 ad-tech companies working on ads for AMP enabled websites. This should eventually translate into faster, more visible ads for publishers. Don’t be surprised if Google AdSense starts AMP optimized ads soon too.
In other words, your ad visibility is going to increase and your users are going to be happier.
Takeaway: Better ad visibility equals more advertising dollars. Faster ads equals a better experience for your users. A win-win for everyone.
Over to You
Google AMP has just started – the framework was launched less than 6 months ago. While we don’t have exact data on how it will change the way startups create and market their websites, we can say that it will transform the mobile user-experience.
AMP is also a sign of things to come. Google has doubled down on mobile websites, which shows that this is where the audience battles will be fought for the second half of this decade.
If you haven’t done so already, now is the right time to optimize your mobile user-experience if you want to stay competitive.
