Importance of website performance and audit results.

Website performance is very important when it comes to modern internet. Not only it directly affects the user experience (UX) but also is directly tied to how search engines view your site. After reading this post you’ll get to know the importance of web page performance, and the tools to perform a full-page audit and measure website performance.

Nowadays many web developers don’t even bother with website performance when creating a new project - as long as the client doesn’t explicitly require great performance it’s not on the developer's radar (most of the time). It’s a really bad sign of where the current website development standards are heading (mostly due to popularity of website builders and complexity of optimising them). Agencies and freelancers who care about performance and great audit scores are creating much better products for their customers - that’s because getting a very good audit and performance score requires applying technical knowledge in different parts of the internet technology as well as directly tweaking the code of a web application.

Performance matters

Have you ever left a website just because it wasn't loading anything? Yes, probably every user of the internet has done it at least once in their lifetime and it's a clear example of why performance matters so much.

Nowadays our personal devices are rather fast and we are used to them giving us instant responses to our requests and when they start being slow we tend to get frustrated. This fact translates directly into the field of web development - page visitors expect quick load times, fast interactivity, and basically a seamless web experience. If the expectations of page visitors are not met, then most of them will leave or abandon the pending transaction (of any kind).

“According to a Google study, more than half of mobile visitors will click away if the website takes longer than three seconds to load. Half of mobile visitors expect a page to load in less than two seconds. Google emphasised the importance of page loading times with the release of Core Web Vitals. The code behind the site can seriously affect page loading times.”

Let’s visualise how important performance is and how it affects further interaction with the page by glancing over a few statistics from the web:

• 64% of smartphone users expect pages to load in less than 4 seconds.
• 85% of mobile users expect pages to load as fast or faster than they load on the desktop.
• When faced with a negative mobile shopping experience, 43% of consumers will go to a competitor’s site next.
• Only 18% of the top 100 sites have a TTI (time to interact) of 3 seconds or less.
• 51% of online shoppers in the US say that site slowness is the top reason they’d abandon a purchase.

As you can see the expectations of web visitors are high (as they should be) and their bad experience is mostly caused by performance issues in different variations of web pages.

When the end user is hurt, so are page rankings. Page rankings in search engine results are of the utmost importance for any website that is trying to grow their audience - they guarantee the ability for organic users to find your website just by putting the keywords into their search bar. With bad performance, you’ll most likely notice low organic traffic (due to the fact that even if the user stumbles upon the website, he or she is most likely to end the connection before anything starts to appear on their screen - just think - have you ever clicked a link from Google and then closed the tab because nothing was starting to appear in the first few seconds?) and on top of that most of your existing users won’t be returning to the web page with a smile on their faces, rather than that they will feel a little discouraged to go onto a website that has been remembered by them as slow, unresponsive, or unpleasant.

Performance measurement explained

There are many tools with which we can measure performance or perform a full audit of a specific web page.

For a full-page audit we will be using PageSpeed Insights (a tool made by the Google team covering most important aspects of a website), but unfortunately, this tool is not the best when it comes to accurate performance results and their visualisation, so to understand our web performance a little better we’ll be using GTmetrix.

There is no need to worry if you have little to zero technical knowledge - everything will be explained in detail below.

For the sake of comparison between our performance and the usual performance of web pages, we will perform one PageSpeed and one GTmetrix audit on a random website that we found in google search results (search input was “dentist liverpool” and we chose the first option that Google recommended, which was https://dentalhouseliverpool.co.uk/), then we'll explain the metrics and compare the audited page to our website - you’ll see the huge difference between our pages and the current standard of the web.

PageSpeed Insights gives us two versions of the audit at the same time - one of them is from a simulated mobile device and the other one is a desktop version.

Mobile audit:

Desktop audit:

As you can see we have two categories of metrics provided by the PageSpeed Insights tool - the circles at the top of the audit and performance metrics at the bottom of the image. If you take a closer look at those two images you’ll see that the only noticeable difference is in the performance metric - this behaviour will be similar between most of the audited pages due to Accessibility, Best Practices and SEO having similar metrics on all devices.

Let’s dig deeper into the meaning behind those statistics.

Performance audit takes in variables such as First Contentful Paint, Time to Interactive, Speed Index and a couple more (which we will explain after showing you a GTmetrix performance audit), then calculates a score based on all of them.

Accessibility audit highlights opportunities to improve the accessibility of your web app. This includes not only people with disabilities, but also people with slow connections or very small screens/special devices.

Best Practices checks wether the developer of the app made sure common errors are taken care of and also checks for common User Experience (UX) errors, such as low image resolution.

SEO is short for Search Engine Optimisation and the audit checks if the page is overall ready to be showing up (properly) in search engine results. It is not a complete SEO audit, but it's a great start for any website.

As we went over the four main categories of web page audits, now we can proceed to deep dive into the metrics, which combined together make the performance score. In order to visualise the performance audit and it's metrics well, we will use GTmetrix audit tool.

TTFB (Time To First Byte) - amount of time elapsed between the users request to view the page and the first byte returned to the user from the server.

First Contentful Paint (FCP) - how quickly content like text or images are painted onto the users viewport. FCP metric tells us how much time is elapsed between page view request and the beggining of the rendering proccess.

Time To Interactive (TTI) - amount of time it takes for the page to become fully interactive (this does not mean that all the interactive elements are visible just yet).

Largest Contentful Paint (LCP) - is the amount of time elapsed between the page view request and the moment when all of the content is fully rendered onto the users viewport.

Onload Time - occurs when the processing of the page is complete and all the resources on the page (images, CSS, etc.) have finished downloading. (GTmetrix article)

Fully Loaded Time - this metric occurs once all tasks tied to fetching and rendering a website are finished, CPU and network devices are free from the browser proccess.

When you take a look at the PageSpeed Insights audit you'll notice that there are few different metrics in the performance section, to get to know them better click "Expand view" text on the top right side of the metrics grid.

The score of this page is pretty decent, although there is much room for improvement. We won't be getting into technical details of optimizing a web page, because this is different depending on technology used to build the site. Instead we'll show you our audit results.

Our performance and audit results

It's time to show you how good (and probably even better) it can get. There are three pictures of audits performed on our website: PageSpeed mobile audit, PageSpeed desktop audit and GTmetrix performance audit. Just take a look:

As you can see - our score is almost perfect. Our website fully loads 10x faster than the random tested website and on top of that, our website is fully loaded before any elements start appearing on the random tested website.

We are only lacking perfection in mobile performance - that's due to some 3rd party scripts taking a lot of time to respond on a throttled connection (yes, PageSpeed Insights throttles the mobile connection down in order to simulate performance on a rather slow device, our performance on a modern phone with LTE/5G or a wi-fi connection would be above 90).

Please feel free to test and compare any website using PageSpeed tool and GTmetrix. Once you test a couple websites you'll know how rare performance and audit scores are on a level like ours (spoiler: it's only about the top 5% of websites worldwide).

How can you get results like that?

Make sure that you choose a developer who can prove great results. As stated in the beggining of this post - many web developers don't care about performance as long as the client is happy with the site visually and functionally (big mistake), so if you'll be getting assistance from a developer who works mostly with website builders (ex. WordPress, Joomla, etc.) you should know that their hands are tied when it comes to editing certain pieces of code and in many cases it's impossible for them to move above a certain score.

You can always contact us and we will create your small, medium or large idea! With us you will always get the best performance, optimization, audit results and modern technology.

Thanks for reading!

For any copyright/ownership appeals please send an appropriate request to mail@nextweblabs.io.