Forget AMP. Make fast sites! With Jon Henshaw (TECHIE)

[00:03:00]

So, when I saw the title of John Henshaw’s presentation, the recent BrightonSEO event, which was forget AMP, Make Fast Sites, I thought my prayers had been answered. No need for AMP? Hooray! That’s why today, I have John on the show. To give us the lowdown on AMP, and speeding up websites.

MUSIC

[00:04:30]

Jon Henshaw:

No, I mean, that sounds pretty good to me. That seems like a lot.

[00:05:30]

Kate Toon:

Very weird that I’ve kept that for all this time. You should worry. I’ve also got a picture of John on a pillow as well.

[00:06:30]

[00:07:00]

[00:07:30]

And if that … you’re listening, you’re wondering what is he talking about? That is a piece of structured data that google likes to read on sites, and they do something with it in the search results. The reason why the news article on this is important is because, there’s been a lot of stuff around fake news. News that is not reliable, and, or hasn’t been fact checked, and a lot of technology companies, including Google are getting a lot of heat of it.

[00:08:00]

Kate Toon:

Yeah. That’s a very good definition. That’s great. That’s interesting. Another note that you made, I mean, by the time this show goes out, this might be slightly old news, but Google has released an updated SEO style to go out, which, I read yesterday, and it’s actually very well written. Which is, surprising for Google, like it’s, understandable, so, it’s pretty good.

[00:09:00]

That’s, you know, it’s from Google, and they actually acknowledge SEO and it has some interesting things in there. So definitely, everybody who’s listening should check it out, because, it will give you some pretty good insight into what google is thinking, what they think is important, SEO certainly goes well beyond their starter guide, as far as things that you need to know and what you need to do, but, it’s interesting to have their take on it.

[00:09:30]

[00:10:00]

[00:10:30]

[00:11:00]

[00:12:00]

[00:13:00]

[00:14:00]

[00:14:30]

The reason for that is because, it’s very, very, Google-centric in that, as I said earlier, it’s hosted on Google, it’s not on your site. That’s a little disconcerting. Especially the way search results have been kind of functioning lately on mobile, which is, more often than not when you do searches on Google, they kind of keep you on Google.

[00:15:00]

[00:16:00]

The reason why is because, this only solves the problem if somebody is on a mobile device and searching Google. It doesn’t solve the problem of somebody getting to your site in a different way. It doesn’t solve it if they see your URL on some printed material. It doesn’t solve it if they are reading an article and they click on a link that goes to your site. It doesn’t solve it from referral traffic. It doesn’t solve it from just plain old direct traffic, which is, same example, like if from seeing something printed.

[00:16:30]

[00:17:00]

[00:17:30]

[00:18:00]

That is, your site needs to be quick. The person needs it to have a good user experience when they go to your site as opposed to having it load for many, many seconds. The reason for that is because the slower a site is the more likely that visitor is going to bounce. They’re in other words, they’re going to go back and look for a different site because yours isn’t loading, or it’s taking too long, or there’s too much stuff going on.

[00:18:30]

[00:19:00]

[00:19:30]

[00:20:00]

[00:20:30]

[00:21:00]

They’re actually calling data from other places. We also talked about content delivery networks, we talked about eliminating big fat sliders with huge images on your home page, which totally is that above the fold thing. A lot of the sites I look at, they got a giant slider above the fold. It takes about 15 seconds to upload and by that time, you’ve gone. We’re not gonna go through some of those more basic speed up tips today. Instead we’re gonna for a few more advanced tips.

[00:21:30]

With WordPress, the typical set up with it is, you go out and try to find a theme that says it’s SEO friendly, you eventually pick one, then you add that. With that theme, there are plug-ins that it recommends so it can do all the really cool stuff that you saw when you first picked it. When you’re pretty much done setting everything up, you may not realise it, but you, in most cases you will have a bloated site.

[00:22:30]

Different versions of Jquery, which is a very typical library. You will have different uses of web fonts, which can really increase in size quickly. I’m talking like megabytes. Where the person that visits your site for the first time would have, just to download the fonts themselves, would take a megabyte or more, let alone everything else on your site.

[00:23:00]

[00:23:30]

Then on top of that, it ends up that the only reason why you even have some of this code on there is for this one little feature. It’s for this one slide effect, or something cool with the theme, which is the reason why you picked it, but that ends up only representing about 10% or less of what the actual library does. You’re making people download all this code and many times, multiple versions of the library just to use a very small part of it. You could potentially be adding many, many, many seconds to your site for it to even load and render and look correctly for visitors. You could actually shave off many seconds if you just use the code that you actually needed.

[00:24:00]

A classic one that always tell people to eliminate are these testimonial, rotating testimonials. People think that they look great, but, A, people aren’t gonna read them, and B, it’s annoying ’cause they’re moving to fast, so just code the testimonials onto the page. You don’t need everything to be moving. There’s this obsession that everything needs to slide in and animate up. Just code them on the page.

Kate Toon:

You can eliminate the plug ins, but how would one go about looking at your WordPress CSS files and just making them into one CSS file, or replacing these sexy fonts with your system fonts, how would you do that?

[00:25:30]

[00:26:00]

If you can just take a look and go, you know what, I really don’t need that, I don’t need this other one, all of these things are just kind of superficial things that I thought looked really cool, but aren’t necessary for me to communicate what I need to communicate with the site, and the site would still look good without all these whiz bang type of features. That’s the first thing I would recommend.

[00:26:30]

[00:27:00]

I know that’s kind of scary and it sounds expensive, maybe to a lot of people out there who are running the WordPress sites for their business. Really what I’m talking about is, it’s actually either you can go the route of truly making a custom theme or you can commit to taking a theme and having this developer kind of break it down, and tweak and optimise for you.

[00:27:30]

[00:28:30]

[00:29:00]

[00:29:30]

Look for the leanest plug-ins or if possible do it with hand coding, don’t necessarily get a plug-in. Plug-ins are not the solution for everything. I think when you first get WordPress, you get a bit overexcited. It’s like Christmas and you’re like Wow! I can get this and this!

Jon Henshaw:

I think that’s great advice and I also think that’s a brilliant suggestion too, as far a picking a good theme that supports child themes. That’s a great way to go because, the point of getting a particular framework is that you can take advantage of customizations. Then of course with a child theme, it means that you can do whatever you want and that won’t be overwritten, and only the most important stuff will, that’s part of the main framework. I think that’s brilliant advice.

Kate Toon:

Thank you. Anybody listening, little sales thing here, if you’re about to set up a WordPress site, we do have a WordPress SEO site that teaches you all how to do this. How to set up a child theme, which plug-ins are fast and fat. Which ones are chubby and that you shouldn’t use.

[00:31:00]

No uploading 2,000 pixel by 2,000 pixel image and rendering it as a thumbnail, and also that they should be smushed, you try and reduced them to the smallest cache size possible, before you upload them, and of course you can use plug-ins like WP smush to further smush them when they’re on your site. You had an even better suggestion, which was that you should actually serve different image sizes for different devices. Can you explain what by that?

Jon Henshaw:

[00:32:00]

Yeah absolutely. Before I get that, just because, I’m such a stickler on this stuff, as far as image types go, even before you even smush it, a lot of people don’t always pick even the right image format. I generally recommend in this order, you either, you first try to do an SVG image, and the reason why is because, those scale and look perfectly no matter what the resolution is on a person’s screen or device.

[00:32:30]

[00:33:00]

[00:33:30]

[00:34:30]

[00:35:00]

[00:35:30]

[00:36:00]

Kate Toon:

[00:37:00]

Yeah. That’s an amazing tip.

Another little tip that I’d add here, which is, along the lines of keep it simple stupid, is have a look at your site on a mobile device and if the images really don’t make sense, on a mobile, you can turn them off. There is an option in most themes to say display this image on a phone. Do not display this on a tablet. I know that’s definitely something you can do with Divi.

A great example here is someone who had a map of an area on their homepage with all of those little pin points all over it. When it rendered on a mobile, it just looked like a blob. Just maybe turn that image off. Also ensure that with your content, you don’t rely on the images to do all the work. Whatever is in the im … overlaying text on images is not a great idea. If you’re gonna do that, make sure that the text is also in the page as well, so if the image is removed, the page still makes sense. That’s a basic tip, but that’s something that I recommend.

Jon Henshaw:

[00:38:00]

[00:38:30]

It’s something that a lot of times gets ignored, but it’s actually a pretty good thing to have. Especially if you have pages that have a lot of content on them. Basically Gzip is a way to compress the text on your page. That includes not just a copy that you read, but all of the HTML that make up that page. If in your HTML you’ve just got all your Java script and your CSS, and all this stuff, it can really add up quickly and be slow to transmit. What’s amazing about text and compression is text can be compressed big time. I mean just kind of, it can go, it can be compressed like 80% of it’s size and Gzip is something that’s supported by all major browsers and for the most part, supported by all major web servers. If you can enable Gzip all it really means is you can deliver, basically you can compress it on the server and send it to the browser, and the browser can un-compress it. It just makes sending your webpages a lot faster. If I had a megabyte, I could conceivably make it just 200 kilobytes instead. I can make it a fifth of the size. That obviously is way faster.

Kate Toon:

Super. Again, I’m gonna ask the question again, if I’m an average WordPress person, are there any particular plug-ins that do this or is this a hand coding thing.

[00:39:30]

[00:40:00]

Jon Henshaw:

[00:41:00]

User experience, a lot of what AMP tried to do was based off of improving the user experience. Nobody likes to go to a slow site. Nobody likes to go to a site that has way too much going on. Nobody likes to go to a site that has ads everywhere. All those things are related to user experience. Sometimes they affect speed, and sometimes they just affect whether you can even use the site. Of course there are plenty of sites that don’t even care if you can use it, they just want the page views.

[00:41:30]

[00:42:00]

Kate Toon:

[00:43:00]

Yeah. I think there’s a few things I’d like to touch on there. I think the whole notion of dwell time and how long people spend on your site before they bounce back to the results. I do think that’s a big indicator to Google on whether your site is a good result for that search term. You gotta have a sticky home page that sucks people, and obviously, that loads quickly, but also that’s engaging straight away and very clearly explains what you do, who you do it for and why you do it, better than anybody else. That’s so important, getting that unique selling position that you USP on your home page so that people go yeah, this is the right result and hey, these guys are great. I think a lot of sites fail at that.

[00:43:30]

I think that’s ’cause of the content. If your content is good, people might be willing to wait a little bit longer. I think although we have down an AMP a little bit, I think that one thing that AMP did teach me when I was trying to implement it was that, what is really necessary? Because with AMP you strip down your page, then you can go back and add a few things, like you can change colours and add your logo back in. It really forces you into the discipline of going, what do I need on this page, to make this page work? Do I really need that wiggly thing, that pop up that comes up, that animated doodad, that whatever? Do I really need it? It forces you to be a bit strict with yourself. Don’t you find it?

Jon Henshaw:

[00:44:30]

I do. And as much as, as much grief I’ve given AMP, it’s mainly just been more out of principle. It’s been out of my idea of what I think the open web should be, and the fact that they’re basically taking something that already exist, HTML, and creating their own thing called AMP HTML. It’s the same thing, it’s just a derivative and it’s just very heavy handed the way that you have to use it. The grief I give it comes more from I don’t think it’s the panacea. At the same time, I give them a huge amount of credit for why I think it originally was created. It originally was created because of very bad behaviour of everybody else. That’s why it exists and we can learn from it.

[00:46:00]

[00:46:30]

[00:47:00]

[00:48:00]

[00:48:30]

[00:49:00]

[00:49:30]

[00:50:00]

Kate Toon:

Yeah. I mean, that’s the price you pay. You don’t have to worry about security, and hosting and all that other stuff, but you do, are slightly limited in the manipulations you can make yourself. If you haven’t listened yet to the episode where we compare Wix with WordPress, have a listen to that because we do go through what you can and can’t do on each of those platforms.

Jon Henshaw:

[00:51:30]

Yeah. I’m a big fan of those two, those also, but one of the things that I really I like, is just good old fashioned Chrome. The Chrome browser has developer tools that will mimic different devices and will allow you to throttle the bandwidth. You can actually specify how fast or in this case how slow a connection is, and it will do it virtually and show you how long it takes for that to load when you’re not on a super fast broadband connection. That’s probably one of my favourite tools. Then of course it’ll show you just how long it takes to load. It’ll show you the waterfall, of all the different assets, all the things that has to download that you have on your page and give you a lot of insight into things that you can optimise. But yeah, GT Metrics is really good. Always the Google’s own page speed testing tool, those are excellent.

Kate Toon:

I’ll include links to all of those as well as those Chrome tool bars, and some amazing Chrome tool bars. I’m gonna have to do an episode just about Chrome …

Kate Toon:

Fantastic. I’ll check that out. John thank you so much for coming on the show. Some really amazing stuff there. I think we ex … you explained it in a way that wasn’t overly technical so I think our listeners will super appreciate that.

[00:53:00]

This weeks review comes from Compelling Copy, and they say “I love this podcast as it gives me the latest tips I can use to help my clients with their SEO strategies. Kate’s interviewing style is friendly and accessible. Normally when people talk about SEO, my eyes glaze over, I just don’t get it. This podcast breaks it down and gives me real usable info from some of the worlds leading SEO gurus. Thanks Kate, looking forward to the next episode”.

[00:53:30]