Mobile devices have become so popular that they changed the way of presenting the information. This made web developers and publishers search for technology that would help them properly optimize their content for mobile users. This is where AMP comes into play: a new way of optimization for mobile webpages.
What is AMP and what do we know about it?
AMP – which stands for accelerated mobile pages – is a new way of making it easy for web users to see their favorite content on the go. Basically, as its name suggests, AMP makes pages load much quicker, making it almost instantaneous. It is an open-source initiative that was the result of many discussions between mobile page publishers, users and developers.
Accelerated Mobile Pages consists of three parts, which are:
- AMP HTML
- AMP JS
- Google AMP Cache
AMP HTML is basically normal HTML that is extended with custom AMP properties such as AMP-specific tags, e.g.amp-img tag, which provides srcset support even in browsers that do not support it yet. Of course, most of the code is just regular HTML, so it is quite easy for a developer to implement changes making a webpage AMP-ready.
AMP JS is the library of performance, as one could say. It manages resource loading and ensures a fast rendering of a webpage. Thanks to this, all the external resources that come in are made asynchronous, so nothing gets blocked from rendering. Besides, the AMP JS library includes such performance techniques as the sandboxing of all iframes or the pre-calculation of the layout of every element on page, so everything is being optimized timewise.
Google AMP Cache is a system based on a proxy that is responsible for delivering all of the verified AMP documents. Thanks to AMP’s magic, web pages that use this technology can be stored in the cloud or cache belonging to a third-party company or first-party one, such as Google, and thus be available for a user instantaneously.
One of the main goals for AMP technology is to lower the bounce rate that is usually caused by long loading times of web pages. Although it is more limited than regular HTML (in terms of presenting content), it also makes it so much faster. How much faster? The average time for humans to blink takes around 0.3 seconds. The median load time for an AMP page takes 0.7 seconds, which is barely over two blinks of an eye. WOW. According to that, AMP will load your website in a flash giving users one more reason to stay on the site!
Hello World – the AMP’s skeleton-code
As mentioned above, AMP HTML is based on existing web technologies with the difference that it restricts them quite a bit. This sample code shows what’s necessary for an AMP webpage to be valid:
As you can see, there are various differences in comparison to regular HTML code, such as the bolt “⚡” sign in tag, which stands for “AMP,” or embedded AMP boilerplate, which is an integral part of the AMP code. There are many other amp- components, just to name a few:
- amp-ad – which tells how to display Ads in your AMP HTML files
- amp-anim – which allows you to embed animations into your AMP HTML files
- amp-analytics – used to measure activity on an AMP webpage
- amp-audio – which replaces the HTML5 audio tag
- and many more…
More information, such as source codes or instructions, can be found on GitHub. If you have a website based on WordPress, you can simplify AMP implementation by using a proper plugin. All you have to do is as follows:
- Download the proper plugin from GitHub and install it automatically, which shouldn’t take more than 5 minutes.
- Activate the plugin – amp will be added to all your pages.
- Edit the .htaccess file using an FTP tool (e.g., Filezilla) to ensure that everything is working across the board. Just copy and paste the following code sample:
Of course, instead of https://example.com, we used our domain address.
- Edit your CSS with the FTP tool (wp-content -> plugins -> amp -> template.php).
Are you properly “AMPed”?
Remember that proper canonical linkage is vital for your webpage, especially when you publish content for desktop and mobile users. Without it, your AMP content might not be discovered by a search engine! If it has both the AMP and normal versions, then the normal one should have the following code embedded:
while your AMP page should link to the canonical version of the page other than the AMP one:
The stand-alone AMP pages should show up in the canonical linkage:
Also, if you are wondering whether your web page is AMP valid, you can always try to validate it with an AMP validator. There are plenty of validators online, and they can be easily found on Google. Of course, you can always use the official one that is available on the AMP project site.
Another useful feature is a report recently added to Google Search Console under the Search Appearance tab for AMP errors.
Google said that the
AMP error report gives an overview of the overall situation on your site, and then lets you drill down to specific error types and URLs. This process helps you quickly find the most common issues so that you can systematically address them in your site’s AMP implementation (potentially just requiring tweaks in the templates or plugin used for these pages).
Ads on AMP
One might ask, “What about the advertisement?” and the answer is that more than 70 advertising technology providers have joined the fray to ensure that the proper technology is implemented and publishers can advertise properly without lowering the UX. Of course, there is still a question about traffic statistics. It is known that comScore, Adobe Analytics, parse.ly, CartBeat, Nielsen, ClickTale, and Google Analytics have started to work on the matter so AMP pages can have full access to properly evaluated traffic statistics in real-time. AMP lets you monetize AMP pages just like regular HTML pages, so you can keep most of your earned revenue. Sadly, since publishers can’t implement all of their standard ads on AMP pages (e.g., custom pop-up ads), a lot of them experienced drops in revenue from monetization to some extent. Basically, AMP is being met with mixed feelings from publishers in this aspect, so the right thing to do right now might be just to wait a bit and see how the situation develops in the near future.
Also, it is worth mentioning that early studies have shown that ads on AMP are more viewable, and users seem to get engaged and more responsive to them than to ads on normal pages (https://image.slidesharecdn.com/ampaboveandbeyondadamgreenberg-160920160309/95/amp-above-beyond-by-adam-greenberg-24-1024.jpg?cb=1474987500).
SEO benefits
Even though Google denies that having an AMP webpage gives preferential search results, it does say that faster loading times will affect the ranking. Besides that, the Google News carousel is given priority above all of the standard results. It is featured at the top of mobile search pages, so your page might get to the top really fast since AMP is just being developed.
The more visible the content is, the higher the chances are that users will remember your web page and brand. Thanks to that, there is a higher chance that they might visit your standard desktop webpage version, which may also affect your traffic statistics. There is also that aspect of quick loading time which is a big factor in SERP ranking and which may possibly reduce bounce rate. Over time users could associate AMP webpages with a better experience and favor them over normal sites which could affect search preferences in general. All in all, looking at the current trend, it might be viable to invest in AMP technology.
All that glitters is not gold
The AMP project appears to be pure gold as it boosts your pages’ loading time and visibility. But is it actually perfect? Since AMP is all about speed, it forces publishers to trade away control and features. Also, it is just another version of your webpage, so basically, that means that some extra work needs to be done. Oh, and it forces you to use full HTTPS.
Another issue is the fragmentation of the internet because of multiple webpage standards. Google promotes its AMP, Facebook – Instant Articles, who knows what else will come in the near future. The very purpose of the internet was to have one website available to all kinds of devices and viewable by anyone. Now publishers need to implement various versions of their websites so they can be accessed through, e.g., Facebook Instant Articles or Google’s AMP carousel. Besides, Google plans to expand the delivery of AMP links beyond its carousel to all mobile search results. That basically means non-AMP websites will get pushed back to the internet void.
Worth mentioning is that although AMP is constantly getting updated to support more and more extensions, it is still very limited. For example, AMP technology is not suitable for eCommerce since it doesn’t support forms.
