Another one of these. Google is making your life harder… yet again! We all know it’s important to ensure your website is smooth and loads in a reasonable time. But what is a reasonable time? What are the variables, and how does it affect your search engine rankings? Well Google likes to move the goalposts all the time, so it can be a little confusing to know exactly where you stand. I’m here to help clear some of that confusion and help you get a speedy site without killing yourself trying to get that coveted 100/100 mobile and desktop score on PageSpeed Insights.
1. Images
Images, images, images. Who doesn’t love a good image? Well… Google apparently. Having crisp, clear images on your site is often imperative, but it can also be a pagespeed nightmare. However, the good news is, this is the easiest thing to sort. Here are some tips to ensure your images aren’t bogging down your website:
- Ensure your image is no bigger than it needs to be. Don’t just upload an image straight from your camera, or the highest resolution image you find on the stock image bank. If it’s fitting a space that’s 200px x 150px, make sure the image size is no bigger than those dimensions. You’re just wasting valuable resources and forcing the user to download those massive images every time the user visits your website.
- Save the images down. Make sure when you save JPEGs in editing tools (like photoshop) that the quality settings aren’t pushed all the way up to the top. Those settings are usually reserved for print where a high DPI and sharp lines matter most. If saving a jpeg on Photoshop for example, saving it at quality 8 (high) is more than enough for the web. That’s valuable kb saved right there. This is often referred to as ‘Lossy’ compression as you’re throwing out some of that visual data in order to achieve a lower file size.
- Then there’s Lossless compression. This is a godsend. Some tools use a combination of lossless and lossy compression techniques to achieve a dramatic reduction in file size, such as tinypng. The results are often indistinguishable but can make a huge difference. You can often strip out up to 50% of the file size by using these techniques. Lossless compression is often achieved by stripping meta information stored with the image which results in a reduction in file size.
- Use modern image formats like WebP. Google is really pushing WebP nowadays, it’s a brilliant format that allows for rich, deep colours and sharp lines with a tiny file size. It’s great. BUT… unfortunately isn’t quite supported by all browsers at the moment. But this will change, and give it a year it’ll likely be the go-to for web images, especially considering it has Google’s support.
2. Videos
Try to avoid video backgrounds. Video backgrounds can look great, but they’re heavy. Really heavy. Even if you compress a video right down, you’re often still looking at a couple of megabytes of data there for a 720p or 1080p video. Which is a couple of mb that you don’t need. I can hear you saying ‘oi, you’ve got a video background on your homepage, you hypocrite’. And you’d be right, we do. But that’s because we wanted it, and we decided that speed was secondary to design in this instance, but this will probably change with a redesign later down the line, we have disabled it on mobile devices (which we advise you all to do with all video backgrounds).
3. Ensure GZIP (or similar) compression is enabled
When a user visits your site, they have to download all the data for the webpage they’re viewing on their browser before they can view it. So their browser requests the data from your server, and your server sends that data to the user’s browser for them to view at their leisure… make sense?
So you know when you’re trying to send a large folder or file over email but it’s just that little bit too big, what do you do? You add it to a .zip file don’t you? A zipped folder compresses that data so it’s small enough, and tidy enough to email to your friend/colleague. Gzip compression is kind of like that.
Gzip compression zips up the files and folders that contain your website, and sends it in a neat and tidy package that your browser can then unzip and serve to the user. This is standard, and should be enabled by your developer on launch.
4. Reduce Server response times
This can often be a difficult one to sort. Google’s PageSpeed Insight tool often tells you that you need to do this in order to speed up your website, but no matter what you do, sometimes it’s just not possible to remove this error if you’re not a massive company with thousands of pounds at your disposal to pay for costly state-of-the-art servers. But, it’s worth asking the question, often your hosting provider can move you to a better server for a small cost, or can suggest some things that might help improve server response times. Something to think about, but don’t get hung up on it too much.
5. Utilise browser caching
As mentioned above, each time a user visits your website they have to download all the folders and files in order to view your page. However, if they’ve been there before, utilising browser caching can often take some of this legwork out for your user’s browser and speed the process up by storing some of the files in order to improve load times. If you’re using WordPress, there are tonnes of plugins available, my favourite is W3 Cache.
Conclusion
This is by no means a comprehensive list, there are literally tens, if not hundreds of things you can do to improve load times, but these are some of the most basic that you can do yourself (or your developer can implement relatively easily).
I do want to stress though… don’t get hung up on it! It’s so easy to get obsessed with reaching that coveted green score (80+) on PageSpeed Insights, but I can tell you now, Google moves those goalposts regularly and it’s a constant uphill battle trying to get there. Just be reasonable, follow the guidelines and ensure you’re doing what you can, aim for a reasonable score of 60+ if possible, but remember it is still just a small part of a bigger puzzle, so oftentimes it’s more worthwhile focussing on other things instead.
We’re Laika Digital, a digital marketing agency based in Wellingborough. We provide a variety of services including Web Design, Graphic Design, SEO and Print services. Get in touch with us on 0122 366 0909 or email us on info@laikadigital.co.uk to find out more about how we can help you grow your business.
