Website SPEED!… and Why it Matters | Into the VOiD Podcast (Episode 2)

Neil: Hello and welcome to episode two of Into the VOiD, a friendly guide to Digital Marketing. I’m your host, Neil Cooper, director here at VOiD Applications, and with me is the MD of the same business and co-host of the pod, Chris Carter, how are you doing?

Chris: I’m good. Thanks. Yeah.

Neil: Good. It’s been a while since we did the first one because, you know, busy, busy, busy. So we’ve got a lot of stuff to talk about before we get into the good stuff as well, I suppose. The first episode –

Chris: Was a while back. But with the magic of the internet, nobody will know.

Neil: Yeah, Exactly [ERM]… and that’s something I’m going to talk about now. I kept saying, erm, there was a lot of cuts, and I was going to do that editing so we can get to the gusto faster. I was going to do that editing so we can get to the gusto faster, anyway. So I’m trying to be mindful of it, which is adding more pressure there.

So the jump cut editing is something that I wanted to stick to just so we could get to information quicker for everybody. It’s great for the audio listeners, and that’s what we’re going to try and experiment with going forward. But yeah, from what you can remember of the first episode and how it went, I know you haven’t watched it yet either, because obviously I haven’t put it out.

So how did you think that went?

Chris: I thought it was good. A good guide to why you need a user-friendly website. And it kind of brings us into the next, couple of podcasts where we’re going to be talking about Speed and SEO and different things about why you need, what you need for – what you need in a website for it to be successful, really.

Neil: Yeah, I’m looking forward to it building on top of it and adding to it, just the inclusion of different tech going forward, and then obviously guests, we’ve started the conversation with people to bring them on just to bring on different viewpoints and different skill sets, which is great. Something else I wanted to bring up before we get into the episode, like what we’ve done this year.

When we recorded that podcast, initially, we was in the process of trying to get our stories heard. And… I did it then. And – one of the places was the Express & Star.

We actually have the paper here. [ERM] Yeah, there I did again. I’m going to stop that now. So this was for the work with –

Chris: Tarian.

Neil: And that was documented on the website as well. We’ve ended up in the Express & Star maybe twice and then picked up by another one or two news outlets since then.

Chris: Two times, one through, the mobile app development we did for Tarian Group. So that was a mobile app that we developed for, a group of GP’s in Wales who were trying to break into the health market. Look it up, it’s a really good project and hopefully it can gain some legs and more importantly, help the people of Wales, really, get their prescriptions on a digital platform. Because, see here in England we can already do that, but unfortunately, the guys in in Wales they can’t.

Then the second one was the PreApp Development for the web application we made for Next Phase, which are planning permission company. So yeah, if you need to understand more about your planning permission going forward use PreApp.

Neil: So another thing that happened as well for us, in the first podcast, it was mentioned that we was in the process of updating the look of our site and that actually launched.

The only thing is, we didn’t officially launch it because we had some growing pains and we’re coming out of that phase. So we haven’t bluntly told people like, “look at us, we’ve done a new overhaul on the site”. However, the feedback that we’ve got from that so far has been fantastic. It looks great ~

Chris: And we’ve fixed some of the problems that we’ll probably be talking about in the podcasts throughout the next couple of months.

Neil: So if you haven’t been on the website recently and you’ve been there before, voidapplications.co.uk, please take a look. The content has changed up and we’ve got our faces on there more, especially with the recent news. If you look at the news posts, we’re featured on there for ourselves with the case studies, and the promo that we’re putting out and then also like just the about page and updating that.

So, we’ve got ourselves on there. We’ve got actual team member profiles and stuff like that. So you can get to know us a bit more, and then obviously when these are up, these podcasts will be on there as well. So yeah –

Chris: It’s been you can also see which content each member of the team is talking about from their specialty and stuff, so yeah it’s good.

Neil: We’re putting into action basically what we’ve been trying to tell you guys to do, and so I think that’s a good segue now onto the main topic. Today we’re going to talk about speed because in the first episode we covered – like the design essentials for a website. So with regards to website speed, we want to talk about why it matters and how to improve it.

So like last time, the first question, the big one – why does website speed matter?

Chris: Yeah, big whole question right there. Open ended, but really why just speed matter. Everybody knows you don’t want to go on a website that‘s slow. You’ll just technically, as it’s called, ‘bounce’. You’ll just move on to something else. You’ll find a competitor, you’ll look at somebody else.

But, it really is twofold. If your website’s slow, your SEO will suffer. And if your websites slow, your conversions will suffer because people just won’t spend any time on your website. They will look for alternative ways of finding the information that they need. I think a good way of understanding if your website is slow, is just by going on it yourself.

On different, devices, desktop, laptops, mobiles, using 4G, 5G, different things like that, and just having a real world understanding. We will go through some more technical tools that’ll tell you exactly what’s wrong with it and different things you need to look at.

If you do have Google Analytics bounce rates are a good indicator. They’re not the be all and end all. So if you have a landing page that does everything ~ so we’ve got a web audit page, we run ads to that web audit page, we don’t particularly want people to have gone anywhere else. So the bounce rate on that page will be high. But if you’ve got news pages or services pages and you know you’re not getting conversions through them, but the bounce rates high, you should be looking at your content, you should be looking at your speed. Different things like that.

Neil: So overall, base level answer to why it’s important, the longer people are made to wait, the more likely that they’re going to leave. So going back to our site, that was something that we’ve had to work the design around as well. Just general things – that help that we’ll go over but yeah, we had to evaluate what we wanted the ~ our potential clients and prospects to see first and that altered the content, which can alter your web design, which is why we’re talking about this after the initial – the first podcast, right

Chris: Yeah that would go into your user journey, which we’ll probably touch upon, but speed will affect your conversion rate, it will affect your ability to rank as well.

Neil: Generally to measure these things, I mean, you can look at your own site and then you can load up maybe some of your competitors or some of your favourite sites, and then just count in your head how long it takes. And depending on whether you like the site or not, sometimes people will forgive response times.

If you’re making regular, constructive use of a website, you may not notice, ‘actually, this site takes a long time to load‘ or vice versa and stuff. But then there might be a website that you dislike the look of, doesn’t work well, but the rapid loading times and stuff ~ but just very general. If you want to try it out.

Chris: I would say if you are used to that website and you trust that website, you’ve probably got more patience in it being slow. If you’re looking to gain customers through your website and they don’t know who you are, you’re going to have a problem there. I think we’re going to go over a few technical things in how to work out what way to gain increases in speed and find out really what the problems are.

Neil: So yeah, now we’ve identified why speed matters. We want to look at the core factors, as you were saying, that can affect website speed that we can identify. So for note, at any one time there could be multiple issues. But as focal points we’d like to discuss the technical aspects as well as the common culprits that you can go back and attempt to identify yourselves or even use as a starting point to go back and look if it applies to your website.

So first, the technical aspects, which are the more boring but definitely fundamental parts. You’ve the know-how, can you talk us through some of the elements that influence speed on a website when it comes to technical specifications?

Chris: So I would say 90% of the issues with speed is the technical boring part,s unfortunately and  it’s just the way that websites are built.

So host is number one. So, many different hosts out there. You can go from having your website running on AWS and having it, expandable So the more traffic you get, the bigger the service gets and that will pretty much help you all of the time. Or you can go to the couple of pound of a month – 5 pound a month – shared hosting isn’t going to do the job for most people. But that’s where you see most businesses running their websites on. You need something in between. So there are really good hosts out there. Usually we’ll get them through your web developer and for us here we offer shared hosting, which is better than that 5 pound a month stuff.

It’s shared hosting but it is robust. It’s been tested. It’s good enough for a standard signposting website (so business website). Then you move on to VPS which is a bigger service. It’s got more resources that when you’ve got more traffic or a bigger website or e-commerce, that’s your starting point. Then you can go to dedicated, So that’s when you’ve got a lot of traffic, a lot of pages, a lot of resources needed. So yeah, look at your host, one way to find out if your host is any good really, is to look at your, time for first byte (TTFB). So if you use a tool called ‘GTmetrix’, you can put in your URL.

Ideally sign up for ‘GTmetrix’, because then you can change your location and you can change your connection type. By default I think it goes to Canada. Obviously, if you’re in the UK, you want it to be looking at London, and look for your time for first byte. You should be looking at something below 100 milliseconds. That’s the sign of a decent host. That’s your starting point.

Neil: That’s one of the things that dictated our website philosophy going forward. Especially with like the new stuff. We tried it with the old website and it did work, but then the time for the first byte, as well as what the client or what your user sees first… That adds to whether or not they’re going to stay on the page to right.

So the time for the first byte, I mean you can have ~ there are certain aspects to this, like with regards to lazy loading and stuff where things can load in later. That doesn’t affect what they see right away, but the time for first byte and the content that is delivered to the user straight away is the is the key factor in keeping them on the site, right?

Chris: Yeah, so time for first byte, if you combine that with the three core web vitals, metrics – are realistically telling you if your site’s quick or not. So time for first byte is literally the time it takes for your server to respond to the request. So if it’s 62 milliseconds, that’s fast in anybody’s eyes. If it’s six seconds, your site is not going to even start to load until after six seconds because the server hasn’t responded.

So that is the key foundational piece of information you need. That’ll show you whether or not your hosting has the right resources.

Touching on, core web vitals. There’s three core web vital metrics that Google really look at now, you can see your core web vitals metrics in your feed scores. If you have enough traffic, Google will give you them, but if you don’t have enough traffic, you can use GTmetrix again. So the first one is ‘Largest Contentful Paint’. So that needs to be below one second. That is how long does the largest piece of content on your website above the fold take to load… and that’s probably the easiest one to fix because you can put a CDN in, you can deliver ~ CDNs will deliver the content faster. It’s usually images and things like that.

You can convert your images from JPEGs and PNG to WebP without losing the quality. You can put caching on, basically.

The second one is your blocking time. This one’s a little bit more difficult to fix if you have a problem with it, because blocking time comes from third party services that you’re using. Nine times out of ten, you’ll be using Google services like tag manager, analytics, Facebook Pixel, things like that.

Neil: The things that you actually need on there that track that can add to loading times, but in that case they’re a necessary evil.

Chris continues: Yeah, Microsoft Clarity. But you can fix them by forcing them to load in the footer so that your page loads quicker and then it just loads it afterwards. So that’s a good trick as well.

And then the third one is your cumulative layout shift. So I’ll say that again. I’m old enough to remember that when I said that I completely cumulative layout shift one more time. No, I don’t know nuts. It comes of layout shift. So I’m old enough to remember when websites would just pop in because of different adverts all around the shop.

Yeah, it was really annoying. And you’d be reading something and then it’s gone and you don’t know where you’ve gone. So that’s Google’s answer to stop that happening. Modern websites don’t really have a problem with this. You might have a problem with this if you have a big cookies banner that pops up slightly after the page loads. That can be considered bad for cumulative layout shift (that’s the fourth time). Or if you have sliding automatic animations or sliders in you in your heroes, that can be an issue. Yeah. So just just be aware of that. When you are designing.

Neil: I was going to say, one of the things that I really disliked at the time, but it had to happen, was – I like most people, I enjoy a big hero slider with like 2 to 3 slides, you know what I mean? But that actually in most cases destroys speed because of what it’s got to load, the assets, it’s got to load – and then in order for it to look crisp as well, you have to take into account resolution. So from mobile up to your whatever inch screens are on the ~ what’s the panels called the – the curved monitors that are like yee big 60inch ~

Chris: Yeah. And if you’re using that to view websites then fair play ~

Neil: You have to take those things into account with regards to what’s loaded, and so like we moved away from that, which is why when you look on our site now we’ve moved to like a type layout, and I don’t think clients or prospects will – like designers as a whole, they appreciate how much of an ease that brings to a website and the loading times.

Chris: Yeah, because you’d add like 3 or 4 different sliders, and by the time you got to the third or fourth the user would scroll away anyway and they weren’t reading the information so there’s no point in using it really and it was just detrimental, especially if you used a bad slider plugin and WordPress. Awful.

Neil: Yeah. WordPress, any of the CMS sites or if you’re trying to like hard code something, if you’re working from scratch. So yeah, this is more or less like what I’m trying to do is warn people of the dangers of having a big bulky loading thing with 500 slides and a lot of information, your clients and customers, as much as they probably want to see call to actions, they don’t want that to hold up their time. So if you do use a hero, maybe think about bringing the number of them down. One to three is optimal or use a static one.

Don’t have animations or just rely on building those assets into the start of the page and then changing it out every now and then for the seasons or what you’re offering.

Chris: So if you use a static one, you might have a problem with your Largest Contentful Paint. But as I said, you can fix that. That’s easier.

But yeah, some other tools that you can use to find out your site speed is Google’s Lighthouse². So if you use Chrome, there’s a plugin for Chrome. Basically Google’s page speed, tool that you can find on the web that basically uses lighthouse. So if you install lighthouse as an extension to Chrome, you can just press – it on whatever page you want, desktop, mobile. You will always get a slower ~ the results are going to be worse on mobile usually. It’s just the way it works, especially on WordPress, but you want to get them as high you possibly can.

Neil: Something to note with (Google) Lighthouse, it does depend on what screen orientation you’re using as well, right? So you can test mobile separate to that of tablets, separate to that of laptop type screens, separate to that of desktop.

Chris: But if you use the extension you can only click desktop and mobile. If you use Lighthouse within the inspect element you can make the page whatever size you want.

Neil: So that’s just something to know if you do go ahead and want to make these tests yourself.

Chris: Another quick one is Pingdom. So tools.pingdom³ use that, that’ll give you a real world idea of how quick the site is loading for people, different places in the world.

Neil: So that’s all those on that section, from you. So, yeah, any of these, that have sparked your interest, we will add them as links or I will add them as links as best as possible with an explanation of where you need to go in order to test them. Next on the agenda to check, are plugins.

This heavily applies to CMS’s like, especially WordPress. If you don’t know what a ‘CMS’ is, this is a Content Management System. These can apply to e-commerce sites and the like. There’s different brands of them and they make use of plugins to make functionality easier for people to build them in. Basically, if you can’t do something through hard code, you can use a plugin to cover it in some circumstances.

So with that brings implications. So what kind of implications can this have on website speed and why?

Chris: So this this is very – this is probably the other side of the coin when it comes to your host. This is the other most important part and I’m going to heavily talk about WordPress here because that’s really what we use here when it comes to content management systems.

Neil: However we have worked with other systems and we are willing to work with other systems. And we will work with your system because that’s how good we are. So, just had to get that across.

Chris: Yeah. What he said. So in in regards to WordPress. WordPress is a, open source platform. So originally it was a blogging platform and now it’s basically took over the internet. ~ It’s an open source platform, so you can use different third party themes, different plugins to basically get the style and functionality you want. Ideally [the] theme, comes coupled with the page builder that you use. So there’s lots of page builders out there, there’s Cornerstone, there’s Elementor, there’s Divi, there’s WP Bakery, they will all have an impact on speed. Let’s think about it this way. Out of the box, WordPress is the fastest it’s ever going to go get and every time you add something, you’re chipping away at that speed.

A large chunk of that is going to be taken up by your Page – Builder. Elementor at the moment for us is the fastest you can get if you use it right. So if you use it combined with the default theme, ‘Hello Theme’, create a child theme and then build your own theme on top of that hello theme – you’re going to reduce the amount of impact you have, and then you start to add your plugins on top of those.

Neil: So each time you’re basically taking your website to the gym and as it builds muscle if you don’t maintain it  or should I say if you don’t work on your stretching and your, your, your like, your cardio, you might end up big and bulky, look great, but then ~ this analogy is going nowhere… You didn’t work on legs!

Chris: Yeah. You lost me with the analogy at the start, then you brought it back. But yeah, yeah ~ I know what you mean. Plugins are then the next biggest thing, and keeping them up to date is key. But also using ones that are made by really good developers.

Neil: Reputable places. Just because somebody has put something on there ~ taking notice of when it was last updated, the reviews and stuff.

Chris: Just because it does what you want it to do, doesn’t mean it’s the best choice. If it does what you want it to do but it hasn’t been updated for two and half years? Don’t use it.

If it does what you want it to do and it’s and it’s maybe $100 a year, but it’s made by a developer that literally just makes plugins like ‘Yith’, for example. Yeah. Great. Really good. Use those and they will have an impact on speed regardless, but the better dev’d ones will have less, and obviously if you start to link out to different services like, if you’ve got an e-commerce website and you start linking it to sending your ecommerce products to eBay, start sending them to Etsy or Amazon or different other shop platforms using APIs – that might have an impact as well. So just keep that in mind.

You might need to increase your hosting to take into account.

Neil: Yeah, I think that’s probably the main takeaway for e-commerce sites, because even if you if you start off small, you can afford to not have to use all the functionality that a top brand, Nike or Amazon or somebody uses with regards how many things they stock. So their needs are a lot different to yours. But if it’s a case of you’re a business that’s starting out and you grow, you need to take these things into account because it comes to a point that you have so many products that A, it affects your hosting, but then not all items are displayed or stocked the same and so you have different –

Chris: I think there’s, definitely a common mistake made by people where they think, ‘my websites slow. It’s the hosting’. It’s not always the hosting. Most – a lot of things can be fixed by just giving it more resources. But why spend £300 a month on hosting when you can spend a hundred and optimise your website? You got to find a good balance there, and if your website’s leaking memory, if you give more resources to that website, it’s just going to eat it up anyway.

So optimisation is key.

Neil: Well, on the topic of optimisation, this lends itself to the next point with regards to how things are built and how they’re constructed. A culprit that can pop up that is generally out of the everyday person’s grasp is unoptimised code. So it can bloat websites and it can cause slow down. It can cause an array of problems. This is where problems come from, [with regards to] outdated plugins, because they become – they can become entry for attackers basically, right? So on a plugin basis but also just your styling in general and how you construct sites, especially within page builders and stuff right. So I think what I’m trying to get is without overloading people listening, what’s the top thing that they can look out for and action?

Chris: I think when it comes to unoptimised code, it’s again, just look at reputable, plugin makers. But if you really need to start to optimise your pages for the quickest load, you can start looking at asset optimisation, and in caching plugins like Hummingbird or Lightspeed and different things that, but it is on an advanced level. You need to understand what you’re moving.

You can move absolutely everything to load in the footer, but I guarantee your site will not load properly. It will look weird. Your styling will probably be broken. There’s a bunch of different things you can do, but just be careful with asset optimisation. It’s great if you can get the right balance, but it does require a lot of change, test, change, test – kind of thing.

One thing sorry, I want to shout out when it comes to caching something that we’re using lately and this is not an ad, they are not sponsoring us. This is genuinely my opinion, ‘NitroPack’⁴.

Neil: Oh yeah, difference maker. Obviously this is specific to CMS’ right as well?

Chris: This is specifically for WordPress as far as I’m aware. So NitroPack is a paid plugin. There is a free version, but you do have a big old ugly banner on the bottom and I wouldn’t recommend that. However, it does all the caching, it does all the page caching, the server caching – if you link it in with Cloudflare as well. It’s really good. But the interesting thing they do is preload the cache for you.

So caching on a website will only start to build when somebodys actually been on the website. So the page has to be requested. You can do that manually and we built a plugin. We called it Charlotte’s Web. Where basically we would just crawl the website and it would load up every page when we needed it to, [where] it needed the caching to be built.

This just basically does that and if you pay, you can get them to look at your XML sitemap and every time you update a page, it will delete that cache for that page, you can drop the whole cache and then it’ll just start again using, your sitemap as the entry to start to load up your pre-load cache. It’s really good.

Neil: Yeah, it’s really good. I feel like we need to namedrop Nathan as well because if we if we mention Charlotte’s Web and not him he’s gonna go ballistic.

Chris: Yeah, Nathan built Charlotte’s Web. [Then] we found out that, NitroPack was a thing so, kind of relegated Charlotte’s Web.

Neil: It did, but he was on the right lines.

Chris: Oh, yeah definitely he had the right idea.

Neil: So shoutout to Nathan. So, yeah, I think we can conclude this episode because every step that we’ve taken, we more or less gave the tips as we was going.

Chris: …bring back the analogy of the coin, hosting and your website, those are the two different things. Both will have an equal effect on speed.

So make sure you get a good host, make sure your website’s built well, make sure you’re using the right plugins and make sure you’re using the right caching. Because if you’re using WordPress, it will only be as fast as It can be out the box, add caching and you will be getting scores like we do where we’re getting GT metric scores of A’s, which is what you need and the core web vitals are all ticked. They’re all green. So yeah, that’s what you should be aiming for.

Neil: And in all honesty, these aren’t industry secrets. But whether your agency is transparent with these things, you may not even know they exist, which is why we’re trying to bring attention to them. Because, these are things, especially when we do the web audit, we present these, to the client in order to show A, if you don’t need – if it’s not broken, we don’t need to fix it, if they’re coming to us for work. And B, if it is broken, we have the means to fix it.

So yeah, each tip that has been given, we’ll put the links in the description. All of these as far as I’m aware, other than NitroPack are free to use?

Chris: Elementor for a page builder does have a paid version for a pro version, but it does have a free version.

Neil: But speed wise, testing like the lighthouse – GTMetrix actually?

Chris: GTMetrix, I think actually have moved to a paid model. But you can use it for free, just as long as you’re happy to look in Canada, which if you’re in the UK isn’t going to give you much of an insight, it’s going to be a bit slower.

Neil: But then and also Pingdom right?

Chris: Pingdoms free yeah.

Neil: So you’ve got different things that you can go back and at least begin to test your website with so that you can ask questions if need be. If you’ve got any other questions or any queries or want to follow up with any of these, topics or points that we’ve brought up, then please contact us.

You can visit the website https://voidapplications.co.uk or follow the links in the description to any of our social media to get in contact with us. We also have the website audit. So this time I’ve loaded up the actual page so I can remember it off by heart, even though I’m not remembering it off by heart.

But we run these tests for you for free and there is no catch if you want to work with us after we’ve flexed our muscles and showed you where you can correct your website or how you can improve your performance, then obviously the conversations there, but otherwise there is no – What’s the word I’m looking for?

Chris: No obligation. If you want to take this and use it with your existing supplier to say you need to be doing this – X, Y and Z on my website and you are happy with them. Great. We just want to make sure that everybody gets a website that’s working for them no matter who you work with.

Neil: Yeah, so if you want to do the website audit with us then go to https://voidapplications.co.uk/free-website-audit/ the link will be on the video and in the description. So you can just click it. If you head over there, enter your details. We’ll use that to contact you back and then we can get the ball rolling with doing your website audit.

So yeah. Anything else?

Chris: No, just to say that web audit does come with a free strategy call, so you’re not going to be given a web audit and no context to it. I will explain it and it will go through speed, best practices, your conversion potential and most importantly SEO.

Neil: So you’ll have all your bases covered and we’ll be able to either work with you or you’ll know what to do next. So yeah, I think that’s a good time to close. Onto the next one. Just want to say thank you again for listening. Shout out to Ketan behind the camera. Nathan’s on holiday, but still within our hearts and, yeah, big up Chris, obviously. Thank you for listening. Hopefully see you on the next episode. I’ve been Neil Cooper, he’s been Chris Carter. Peace.