Would you like to learn how you can have a faster website on mobile devices with AMP on WordPress because this will help you get ranked higher and bring more visitors to your website?
Get a Faster Website with AMP -- Review of How Pages Look Different with AMP in Astra on WordPress
If you will enjoy reading and contributing to the discussion for this post, will you please join us on the YouTube video above and leave a comment there because I read and respond to most comments on YouTube?
If you find anything helpful in this video or funny, will you please leave a like because you will feel great helping other people find it?
You can take the full course named “My WordPress Course for a Fast Ecommerce Website with Kinsta, Astra, WooCommerce, and LearnDash” at https://jerrybanfield.com/courses/wordpress/
Let’s do a quick comparison of what a page looks like with AMP and without AMP.
This is my website on the image above, the homepage without AMP, the default homepage with the Astra WordPress theme.
If I type jerrybanfield.com/amp, it will now load the AMP version of the page.
This is what my website looks like with AMP on it. You’ll notice that the format for the homepage is different, and when we go into the menu up top, it is different.
You’ll notice the logo is smaller, there’s just one call to action button, instead of all the different ones.
If I click on “Shop” on AMP, you’ll notice this if the URL up top does not have /amp on the shop, thus not every page on my website has AMP on it.
However, the majority of the pages on my website are blog posts, and that’s why it’s really important to have AMP because those also bring in the majority of my traffic.
If you go to jerrybanfield.com/amp you’ll see how fast that loads, then I’ll click on this post. This is a post in the AMP format.
What I love is all these social sharing buttons appear right on the bottom of the page making it super easy to share.
The video I’ve got on the top of the page is also embedded with YouTube, which I love that it’s got the YouTube embed right there because this helps me get viewers from my website over to YouTube, which Google owns YouTube, and therefore Google wants people who are searching on Google to also go over to YouTube.
That also helps people stay on the page longer when they find a post on my website, and then end up watching a video that will often keep someone on a page much longer than just reading a blog post. Being that video is such an engaging format you can see why having video is much better for me as a content creator to get someone involved.
I really want you watching videos I make because videos help promote trust, videos help me build relationships. Videos are much more powerful than reading a blog post because it feels much more person to person, instead of just reading something. That to me is a very important feature on AMP that it will be able to embed YouTube videos quickly.
You’ll notice some significant differences in how the content is displayed, some things I still need to customize.
Then, you’ve got category pages in AMP that also load where I can see all the different posts.
You’ll notice when I scroll down quickly, the images take a minute to load because that’s lazy loading. They’re actually loading the pages when I go to see them.
This way, the initial page itself displays quickly. However, when the page, when you need to load additional data, it doesn’t load it until you actually need to load it. This interface is super fast. You can see just clicking around it brings up whatever I’m doing super fast in here.
You’ll notice I don’t have anything fancy. There are no fancy pop-ups or chat icons. I don’t have any of that advanced stuff. This is just a basic look at a blog post. I do have “sharing” down here, a call-to-action on top and embedded YouTube videos.
Therefore AMP websites are much simpler. If you depend on a whole bunch of widgets, things like chat pop-ups et cetera on your website, you’ll find that those don’t work on AMP.
If you use a theme like the one I was using before, AMP messes up a bunch of things. It can mess it up, therefore you want an AMP-ready theme.
You can see how fast this go.
Then, when a user clicks over to a page that doesn’t have AMP, it will automatically load your main website.
The idea being if someone’s already got onto your website, the hardest part is getting someone to your website in the first place. A fast page load time helps you get someone there and keep them there. Once you’re on my website, then you’re probably more willing to tolerate if let’s say you decide you really want to look at my TikTok course, for example.
You’re probably more willing to tolerate the course taking a while to load on my website after you’ve already initially read an article, versus if you just are finding my website, and it takes a little longer to load, you’re probably willing to be less tolerant for it.
Therefore, you can see the big difference, especially on desktop, there’s a big difference on how the AMP version looks.
On desktop, I’ve got these sidebars.
However, the website on Google will not load the AMP version on desktop.
Generally, AMP will only load if it’s on a mobile device.
That’s what’s cool about AMP because it just makes jerrybanfield.com/amp, and Google only uses the /amp if someone is on a mobile search or you can set it so if someone is on Facebook and they click on a link, it will go to the AMP version as well.
That means that when someone is searching on a desktop and they’re more likely to have a fast computer, then I don’t need to bother with the AMP version with them. The page load time, while it needs to be good is not as much of an issue.
I tried an AMP takeover on my entire website and I found that was extremely limiting because of things like not being able to put a sidebar on my website to things like not being able to have the menu load correctly.
You don’t want to do the AMP takeover either.
The AMP takeover will put your website into AMP on both desktop and mobile.
That can be helpful if your website is so slow on desktop that it will hardly load. However, a much better option is to simply get a theme that loads faster on desktop, for example, the Astra theme that I’m using loads super fast on desktop.
As you can see, it just rips through loading each of these posts.
I’ve got a store, it rips through loading all my products on here. It’s super fast and yet, it has the key functionality that you need if you are having a desktop user.
Therefore, mobile versions will load a /amp page.
This can be tablets also as well.
Desktop versions will not load the /amp page and it will load like that.
That’s an overview of the difference between what your website looks like with AMP and without AMP.
Note, if you are on your mobile device and you go directly to jerrybanfield.com in your browser, it will load the mobile version of my website without AMP, and this took me a minute to figure out.
This means when you go into Google, let’s say you go to Google and google Jerry Banfield on your mobile device, there’ll be a little lightning icon next to it, and that will indicate that it is, in fact, an AMP article.
We’ll take a look at some results with that difference in another blog post.
You can continue learning with us in the full class today “My WordPress Course for a Fast Ecommerce Website with Kinsta, Astra, WooCommerce, and LearnDash” at https://jerrybanfield.com/courses/wordpress/
I love you.
I appreciate the chance to serve you today and I will see you again soon.
Edits from video transcript by Michel Gerard at www.michelgerardonline.com.