How Accelerated Mobile Pages (AMP) Affects SEO – Why it’s Important and How to Implement it
Accelerated Mobile Pages (AMP) has been out for a few years now and it has become an integral part of SEO. When AMP was first launched back in 2015, there were speculations that it has two benefits for SEO. One is it will have a “Fast” label designation on search engine results pages, and the other is that it will be a ranking factor. AMP was huge for SEOs back then however, its impact to SEO was yet to be seen.
Five years later since it was released, AMP is arguably more important than ever.
It is now a known fact that AMP is not a direct ranking factor in itself and having AMP pages on your website won’t necessarily increase it’s rankings immediately. But, Google now gives higher importance on website speed and mobile-friendliness with their switch to mobile-first indexing and the introduction of Core Web Vitals which makes AMP an indirect ranking factor.
I’ll take you through what AMP is and how you can use it to benefit your site’s mobile visitors.
What is AMP?
Accelerated Mobile Pages is an open-source coding standard for publishers. The aim for AMP is for publishers to be able to load their sites quickly on mobile since mobile responsive could be clunky and slow because desktop resources are heavy and plenty. If we’re going to be honest with ourselves, most of the elements of a desktop website are unnecessary for a mobile site. AMP greatly reduces the elements of a webpage and serves users a stripped version of a webpage.
Until recently, AMP was just for User Experience. Now, Google has backed it up – and is encouraging websites to follow suit. Much like how they heralded Schema.org and laid-low Dublin Core for Metadata.
Why is AMP Important?
Although desktop is still the leading source for Google’s traffic, mobile traffic is quickly gaining ground and it is expected to be Google’s number one source of traffic in the next years to come. AMP makes websites load extremely fast, if not in an instant, on mobile. This gives users the best experience on mobile.
Ever tried to load your site on mobile? Are you happy with the load speed? I know I’m not. Heck loading my site in desktop is taking long and I have a respectable amount of speed for my internet connection – but mobile? All I have is usually a clunky data plan with the mobile providers here in the Philippines.
Simply put, browsing on mobile while you’re on-the-go will mean that your internet speed is not always fast. So it’s best to optimize the experience of mobile browsing for all users (at least that’s what Google wants to happen) by standardizing a mobile version of your site with AMP. I’ll show you how to do it below.
Who will Benefit the Most from AMP?
I don’t believe that you’ll want to make your services or product landing pages into AMP. It would be stripped down of its first-impressions. That would defeat the purpose of your original design. So I don’t believe that everyone will be adopting AMP.
Thinking about our SEO Services site and how it would look like with AMP is just unimaginable. I think I’ll leave it as it is, thank you.
The sites that will benefit the most from AMP are publishing sites. Sites that produce content. So how you’ll apply this to your client is not by making their entire site into AMP. That might affect conversions negatively. Rather, you can transition your client’s blog section or news and updates section into AMP.
What’s the Difference Between AMP and Non-AMP Mobile Browsing?
One of the starkest differences is that AMP pages does not have a lot of stuff for a more complex user experience. Everything is stripped-down.
- AMP forces you to use a streamlined version of CSS.
- Javascript is not allowed at all – in fact, I’m still trying to figure out how to make share buttons appear on my AMP pages.
- You are forced to use an off-the-shelf Javascript library that AMP provides you with – which forces your images to lazy load.
That’s it. Basically when you integrate AMP to standardize your mobile responsive pages, you are putting speed and readability as top priority over anything else – even over shareablility.
How can I Make AMP Work for my WordPress Site?
Here’s where things get interesting because you can actually integrate AMP in about 5 minutes for your WordPress site. Simply follow these steps:
- Install the AMP WordPress plugin by Automattic
- Activate the plugin – what it will do is append /amp on all your pages but what it won’t do is redirect mobile visitors to your /amp pages
- So the next step is to edit your .htaccess file – you could use an FTP program to do this. I personally use Filezilla.
- (Optional) Just in case you want to check if your AMP pages are working across the board: In your .htaccess file, paste this code:
RewriteEngine On
RewriteCond %{REQUEST_URI} !/amp$ [NC]
RewriteCond %{HTTP_USER_AGENT} (android|blackberry|googlebot\-mobile|iemobile|iphone|ipod|\#opera\ mobile|palmos|webos) [NC]
RewriteRule ^([a-zA-Z0-9-]+)([\/]*)$ https://example.com/$1/amp [L,R=302]Note that you have to change example.com to your site’s domain name. I explicitly made the redirect into a 302 because we don’t want all the to link equity to be passed on to your /amp pages since it’s merely an accelerated mobile page version.
- Lastly, you will want to edit the CSS to make your Accelerated Mobile Pages look and feel more like your site. You can edit the CSS using FTP by going to your wp-content -> plugins -> amp -> template.php
You could see that SEO Hacker’s Accelerated Mobile Pages still look and feel like our desktop page design – without all the fluff.
That’s it! You should be rocking AMP in no time.
Oh and before anything else, make sure you’re using rel=”canonical” tags to your original pages. Just to be sure to keep anything Panda related off your back.
How can I Make AMP Work for my Site if it’s not WordPress?
It’s not as easy as installing a plugin but it’s definitely more rewarding. You will have to go to the AMP Project’s site and learn how to integrate it via hard-code, hands-on.
If you want to know more about AMP, Moz’ recent Whiteboard Friday does a swell job on explaining it further:
That’s all for now. If I find out how to finally add some scripts for sharing in AMP, I’ll definitely update this post and let you know.
Verifying your AMP pages on Google Search Console
Once you’ve set up AMP on your website, Google will start crawling and indexing them. In a few days, you should now see that there is an AMP section under Enhancements in your Google Search Console account.
Google Search Console will notify you if there are any errors in your AMP pages. Just like any other coverage errors, it is divided into 3; Errors, Valid with Warnings, and Valid. When you first apply AMP on your website, there is a high chance that most of your pages will fall under Valid with Warnings.
Don’t worry, your AMP pages will still be available to users. It’s just that there are missing data that could further enhance your AMP pages such as structured data or image sizes.
Structured Data on AMP pages
Aside from loading speeds and user experience on mobile, adding structured data on your AMP pages also makes them eligible for Rich Results.
If you’re using WordPress, there are plugins that enable structured data on AMP pages. Google highly recommends having structured data on both the original page and the AMP version.
