If you’re not a web professional, then it’s natural that you base your thoughts on a website off the things that are most apparent; looks and user experience (how easy it is to use the site).
But, as you can imagine, there’s a lot more that goes into a successful website than that… And website performance might be chief among them.
Performance touches nearly every aspect of a website.
Website performance touches nearly every aspect of a website, user experience, to conversions, and even how well your website ranks in search engines.
No one likes a slow, poorly optimized website — so it’s important your website loads as quickly and efficiently as possible if you want to see the best results.
If you’re looking for ways to make your website a better choice over your competitors, performance is a great place to start.
But what is performance, and how can we test it? That’s exactly what we’re going to discuss in this article.
What is website performance?
In general terms, website performance is the measurement of how quickly a website loads and how it is rendered during loading.
Unlike aesthetics, performance is an objective metric that can be measured by a variety of testing tools (which we’ll talk about later).
What’s great about having objective data is that we can measure it, compare it with other websites, and see direct results from our work to optimize our website.
Why is website performance important?
Statistics show that if a website doesn’t load within 3 seconds, up to 53% of people will leave and look for an alternative.
Sadly, most websites today don’t load in under 3 seconds.
The sites that are getting the most traffic are the ones that can make users happy by providing a quick and easy experience.
This fact is amplified since most website traffic comes from mobile devices, which are harder to optimize for and are often being loaded from slower 3G or 4G connections.
Google uses page speed to help determine rankings in search results
Google (and other search engines) recognize this, and in an effort to give their users the best experience possible, they much rather send traffic to sites that load quickly. Part of the algorithm that determines where your website ranks is based on its performance.
But it’s not just load times that you have to consider…
I’m sure you’ve inadvertently clicked on an ad or the wrong button because the content of a page suddenly “jumped” at the last second. This is called “content shift” and is another (and perhaps more frustrating!) symptom of a poorly performing website.
If you wanted to compare these things to the physical world, having a poorly performing website would be like having a queue to get into your store and then moving items off the shelf as customers reach for them.
Most store owners would never want that — and you shouldn’t want to give that experience to users on your website either.
What things affect website performance?
In theory, this is simple… It’s the number and size of elements that need to load and the resources available to transfer them from the website’s server to the user.
Hundreds of factors affect your website’s performance
But, in reality, there are hundreds of factors that affect these things. Here are a few of the biggest culprits:
Hosting. The first thing to consider is your website server or hosting. Choosing a budget (aka “cheap”) host means that you’ll have less resources available to you. Even if your website is a lean, mean, fighting machine — if your server is overloaded it will still cause performance issues.
But even the best server in the world will struggle to overcome a poorly built website.
Bloat. D-I-Y website builders (like Wix and Squarespace) give even novice users the ability to create a pretty website — but everything comes with a tradeoff.
In order to make those systems work, they have to build in a lot (and I mean a lot) of extra code. In the industry, we refer to this as “bloat”, and most DIY websites are filled with thousands of lines of unnecessary bloat.
But it’s not just the D-I-Y tools — professional tools also suffer from bloat (one of the reasons I switched to building block-based websites) or can become bloated if the developer isn’t being conscious.
Media. Beyond the code base, the elements you include on your website should be optimized too. Images, videos, and other types of media are typically the “heaviest” thing on your website and need special care and attention to reduce their burden on performance.
How to test website performance
If you’re following along, you’re probably wondering how well your website is performing.
Thankfully testing a website’s performance is easy — with hundreds of tools on the market.
Of course, that raises another problem… Which one should you choose?
While I have a few of my favorites, there’s one tool that I recommend over all the others: PageSpeed Insights.
Why PageSpeed Insights?
PageSpeed Insights is a modern testing tool developed by Google themselves which is focused around what is referred to as “Core Web Vitals”.
Core Web vitals focuses around 3 pillars of page experience:
- Loading performance (how quickly things appear)
- Responsiveness (how soon are you able to interact with the page)
- Visual stability (items “shifting” around the page).
Google knows a thing or two about what makes people stay on websites (they’ve been collecting that data all along!), and since most search traffic comes through Google anyway, it makes sense to use the same metrics they use to determine your rankings.
How to use PageSpeed Insights
Testing your website is simple.
Head over to the PageSpeed Insights testing tool and type your website address in the search field and hit “Analyze”.
It will take a few moments for Google to run all the tests and you’ll be presented with a full report for both Mobile and Desktop devices.
At its simplest level, you’ll get an overall score which is graded from 0 to 100 (with 100 being the best).
These scores are color coded. Green (90-100) means your website is doing great. Yellow (from 50-89) means your website needs some improvement. And red (0-49) means your website is failing.
This method of measuring speeds makes it easy to get a general sense of your performance without having to understand all the nitty-gritty details.
You’re also provided with more granular details for things like First Contentful Paint, Time to Interactive, Speed Index, Total Blocking Time, Largest Contentful Paint, and Cumulative Layout Shift. These metrics are a bit techie, but if you click the “expand view” button located just beneath the screenshot of your website you can get a simple definition of each metric and links to further documentation.
Testing defaults to your Mobile test (since this is where most internet traffic comes from), but you’ll want to check your Desktop scores as well. You’ll likely find that your Desktop score is better than your Mobile score, which is typical.
Other website performance testing tools
There are a handful of other testing tools I use regularly for different purposes — though none of them are as complete, accurate, or consequential as PageSpeed Insights.
GTMetrix has a great chart called “Waterfall” which will show you how long it takes each resource on your website to load individually, as well as the total number of requests your website has to make.
This information can be really helpful as you debug any issues and need to get granular on your improvements.
Web.dev is another site I test with often. It gives you similar information as PageSpeed Insights, but will also measure Accessibility, SEO, and Best Practices.
This is helpful if you’re wanting to measure the overall health of your website, but if you’re solely focused on performance it might be more information than you need.
Pingdom is another popular performance testing site that can give you a quick readout of the total requests, load time, and page size (all handy!), but I’ve found their overall grades less reliable and load times much more favorable than other testing tools.
How to correct website performance issues
When it comes to correcting performance issues, there are typically lots of measures you can take to improve an existing website before it’s deemed beyond repair.
In order to make any corrections, you have to diagnose what problems are causing your issues (which is done with a combination of the testing tools we already discussed). There could be a dozen or more things affecting your site — all unique to your setup.
However, there are some usual suspects…
Moving to a better host
Hosting is one of the easiest things you can do to get performance gains, especially if you’re on a shared host (like BlueHost, GoDaddy, or HostGator).
There are hundreds of hosts to choose from, each with their own benefits and drawbacks, but if you’re looking for a solid recommendation across the board, take a look at Kinsta.
We recommend Kinsta for their great performance and top-notch support.
Kinsta is a premium host that will do a great job no matter what kind of website you have. And even better than that, it’s a lot easier to use than most hosts of its caliber and comes with great support.
I personally use Vultr servers that are bundled with and managed through a hosting panel called Cloudways.
If you’re hosting multiple sites, Cloudways will come in at a better price than Kinsta, but the ease-of-use and support is a considerable downgrade. I would only recommend this if you’re familiar with servers and have the time to spend monitoring and managing them.
Optimize your images
If you’re on a WordPress site, then there are lots of great plugins that will do most of the heavily lifting when it comes to image optimization.
My personal favorite is ShortPixel which is a “sit it and forget it” type of solution that doesn’t require a lot of setup.
But the saying “garbage in, garbage out” applies. You’ll be a lot better off at least sizing your images before you upload them to your website and run them through an optimization tool.
Caching gets technical in a hurry, and can easily break your website completely if you don’t know what you’re doing. There are all kinds of WordPress caching plugins on the market (both free and paid) that can drastically improve your pagespeed if configured correctly.
Hosts like Kinsta include caching with their hosting package and are completely managed for you so you don’t have to become a technical geek to set it up.
If you’re not confident you know what you’re doing with caching you’re better off leaving it to Kinsta or skipping it to avoid adding more problems to your website.
Get rid of any unnecessary plugins
The number of plugins on your website doesn’t really matter — but what those plugins do and how well each one is coded does.
Look through your list of plugins, and get rid of anything that isn’t necessary to the functional operation of your website.
I would recommend doing this one plugin at a time, and both manually checking your site as well as running it through a performance test to ensure that it’s not breaking things and improving your performance.
Perfmatters is our personal favorite WordPress performance optimization plugin. We’ve consistently seen it take websites from failing Core Web Vital scores to 90+ across the board with the flip of just a few toggles.
I recently interviewed the plugin’s founder to learn how to use it and what settings are best for your website:
Better performance, better results
There’s little point in having a website if no one can find it or it frustrates your users.
Being conscious about your website’s performance helps solve both of these problems by giving Google signals that you care about the experience visitors of your website have.
While it may take time for Google to recognize your efforts and reward you with better rankings, improving your performance can give you immediate results when it comes to user experience. These gains can be measured by reviewing your bounce rate (how often people come to your site and leave immediately), and your visitor duration (how long people stay on your website) which can be found in your analytics software.
If you’d like to have a professional analyze and diagnose your performance issues, then reach out and we can perform a full diagnostic on your website and provide you with a quote on solving any issues we find.