In the real world, breaking the speed limit is not good. Best case scenario is you getting away with a warning. Worst case scenario is... Well, you get the picture!
Unlike the real world, when a website breaks the speed limit, it won't have to worry about waking up next to a cellmate. In fact, websites should be loading as fast as possible. As devices and internet speed getting faster and faster, people expect websites to be fast as well. After all, we are too busy tapping, swiping and clicking. We don't have that extra half a second to wait for a website to load.
If you are a business owner and you have a website, you should find out about its loading speed. Make sure it's fast enough so that you know you won't be losing customers because they've lost their patience with your website.
 |
| Artwork by 1 Stop Coder |
So how is website speed measured? What are the ways to find out about the speed of your website? This article will help you find the answers. Let's dive in!
The Best Tool to Measure Website Speed
One tool that many web developers and designers swear by is Google PageSpeed Insights. We consider it to be the most comprehensive, the most reliable and the most trusted. The Google name badge is enough to tout the authority and effectiveness of it.
To use this tool, simply go to
Google PageSpeed Insights (works better if you're on a full screen device like a desktop). Copy and paste the URL of the website you want to check the speed of. And just let the tool run its tests. In the end, it will produce 2 results, 1 of mobile speed and another of desktop speed. Note that this test analyzes the initial
loading speed of the website only, not the speed of user interactions after the site is fully loaded.
 |
| This article page scored 90 at the time of testing |
How Fast Is Fast Enough
Once you get the results, it's time to make sense of them. As you can see the results are measured with a score, from 0 - 100, higher the better. Google has defined 3 score ranges.
0 - 49: slow
50 - 89: average
90 - 100: fast
 |
| Score ranges. This article page scored 90. |
Before jumping into the technical details, let's talk about perceivable speed. In other words, how fast a site "feels". Based on what's perceivable, if your score is below 70, your site speed will be noticeably slow. If it's between 70 and 89, I would consider that to be reasonably fast. If your score is above 90, then it will definitely feel quite snappy.
There are 6 metrics that make up the speed score:
First Contentful Paint
Time to Interactive
Speed Index
Total Blocking Time
Largest Contentful Paint
Cumulative Layout Shift
They are total tech gibberish to the average person, despite the fact that Google does a good job of explaining them. Lucky for you, we're here to pick out the ones you should be concerned about and explain them in laymen's terms.
We think you should be most concerned about these 2 metrics. First contentful paint and time to interactive.
First contentful paint measures the time it takes for the first content (be it text or image) to be displayed on the page. So basically it is the time between the user loading your page and actually seeing something show up on the screen. It's measured in seconds. For example, the first contenful paint of this article page was 0.9s at the time of testing. Google considers anything below 2s to be fast. We however consider that a minimum requirement. Nowadays even 2 seconds can be too long for the average user to wait. If nothing shows up on their screen by the 2 seconds mark, they may start wondering whether the site exists at all in the first place.
Time to interactive measures the time it takes for the website to become fully interactive, meaning the buttons are able to be clicked on, the side menu can be scrolled, etc.This metric is measured in seconds. Google considers anything under 3.8s to be fast. We think it's a good rule to follow. It is particularly important if your page has many interactive elements such as buttons, inputs & other functionalities. Users typically can't tell when a page goes fully interactive, nor will they wait before starting their interactions.
Ways to Get Faster
How you can improve your website loading speed depends on the infrastructure of your website.
If you are with a DIY website builder like Squarespace or Wix. There is really nothing much you can do to improve your site loading speed. The server and the website code are completely taken care of by them. The good news is we find that they are reasonably quick in most cases. The bad news is this speed comes at the cost of lack of functionalities. Because these platforms generally follow a template driven build pattern, it is hard to program advanced functionalities on your site. Building an enterprise level website/application on a DIY platform is basically impossible. I mean, there is a reason that Amazon.com is not built on Squarespace.
If your site is built on WordPress by either yourself or a web designer, then you have a little bit of freedom to improve your site speed. Based on our knowledge, WordPress doesn't offer server-side customization. On the front-end (the website "files"), it uses "plug-in"s to add site functionalities. It does also allow direct code injection to some degree. To improve your site speed, please consult your web designer. Ask him/her about the plug-ins on your site, and any custom code injections, etc. All in all, WordPress is still an added layer between the developer and the raw source code of your website. So any potential improvement will be limited by this nature. Server-side improvement is basically impossible with WordPress.
If your website is coded directly by a web developer, then you have the maximum amount of freedom to optimize. The entire web infrastructure, from the back-end server to the front-end website, are written in code. With access to the source code of the server and the website, a seasoned developer can practically fine tune anything and everything. So if your site is written in code, consult your developer about optimization. Here at 1 Stop Coder, we code every site. And we employ just about every trick possible to help speed up our sites.
Without getting too technical, here are 2 common practices we use to speed things up.
1. Try to serve images in next-gen format such as JPEG 2000 & WebP and in appropriate resolutions.
2. Eliminate render blocking resources such as non-critical JavaScript or CSS.
If this part is confusing to you, please feel free to leave us a comment below or schedule a consultation with us. We'll help you find out what infrastructure your website is on, and offer solutions to help improve its loading speed.
Don't Sacrifice These for Speed
A website with very little content or functionalities on it is always going to be fast. But that's not what we want, is it? Our goal is to improve website loading speed without sacrificing the functionalities on your website.
Things you don't want to sacrifice:
Text content,
Critical images that need to be displayed upon loading,
Core functionalities that need to be ready as soon as possible,
Tracking & analytical (such as Google Analytics, Facebook Pixel, etc)
So it entirely depends on how good your web developer is with coding and different optimization practices.
Here is a bonus tip. If you are interested in a comprehensive audit of your site, try our
website audit tool! It has the same speed test function Google PageSpeed Insights has. In fact we use the same API as them, meaning we are practically identical under the hood!
And we do much more than just a speed test. You can test your website's SEO, usability, security and social media scores. Best thing is, it is completely free! After the audit, we will offer you a free website improvement consultation as well.
