In December of 2015, Google rolled out a mobile-friendly algorithm update, which had a very specific focus on website load times.
Websites that did not load quickly enough on a mobile device were negatively impacted. While the update only affected the top 10% of websites ranking in Google’s search engine results pages (SERPs), the impact was huge.
Websites with uncached content, based on certain criteria from Google, had their rankings plummet. In particular, homepages of “underperforming” websites took a significant hit.
However, if you google “introduction to page speed”, the top result has an extremely low page speed score – 48 out of 100. This means that not all websites have come to realize the importance of a fast-loading page.
I’m sure you’ve heard about the importance of making your website mobile-friendly. However, it’s important to optimize your mobile page speeds as much as possible, because it’s still the preferred method of browsing. Indeed, mobile minutes accounted for 77% of online time in the US in 2019.
Even though we’re all now familiar with the term “mobile-friendly”, and we’re all trying to get our websites to be friendly to mobile users, I imagine most people don’t know what “mobile friendly” actually means.
Some quick definitions: there are two different kinds of page load speed measurements when it comes to web pages – Page Speed and Time to First Byte.
The latter is the time it takes for a browser to receive the first bit of data from a server. This is an important metric because waiting too long for data can cause visitors to become impatient and leave your site before they can see it fully loaded.
The Page Speed measurement is more complicated and measures how long it takes for a website to fully load and appear on a user’s screen.
Let’s go over the basics of what a good page speed is and how to leverage it to increase your chances of ranking higher on Google and providing a better user experience than your competitors.
What is a good website page load speed?
Every second counts.
Your website should load within two seconds. Human reaction speeds vary, but a significant portion of the population has a reaction time of under 1 second.
Studies by Akamai found that the average page loading time threshold for e-commerce sites is under two seconds.
That’s what makes the difference between an amazing user experience and an annoying one. People are out there to become your customers and bring you sales, so why not help them buy quicker?
How can I increase my website’s page speed?
If you go to Google Page Speed Insights and check your website’s load time, you will get a few suggestions on how to improve it.
Here are a few tips that can boost your page speed and improve your user experience.
Use fast-loading themes and drop the clunky ones
We all love a beautiful design. It has a big impact on whether or not someone decides to contact us.
A difficult problem arises, though, when good design comes with poor speed. This is the case with WordPress websites the vast majority of the time, and this is due to poor choice of themes and WordPress plugins.
There’s an easy fix – you can use a nice theme but then speed up your site load times with plugins that remove unnecessary content and compress it all down into something lightweight and fast.
If you’re a WordPress user, make sure you choose a good WordPress theme and customize it yourself. Some examples are GeneratePress, Parallax Pro, Hello Elementor, and Bricks.
Use page speed plugins
While all of the tips and tricks in this article play a role in boosting your website load speed, some plugins can do most of the work for you.
For those on CMS platforms like WordPress we recommend; W3 Total Cache, as it is easy to install and configure. It also has many performance-enhancing features such as preloading, browser caching, database cache, viewport control, and much more.
There’s also WP Super Cache, which I’ve used in the past and still think is a good plugin if you want something that needs less configuration.
Optimize your images
The number and size of images on a page are important because they influence how quickly the browser will have to download each one for the page to display.
You can have one image that is 10KB, but if you have hundreds of them, they will take longer to load than just 10 bigger images.
The average webpage contains about 3MB of data, which makes images and video at least 50% of the load time of any given page (and often more).
Here’s what to do about it:
- Compress your photos. Compressing a picture means taking a larger file and shrinking it down to a smaller size. This way, instead of using a huge 1 MB image, you can shrink it down to 500 KB or 5 MB or any other smaller dimension you choose. You will notice that when you use the same ratio when shrinking the image to a different size, the image is still perfectly fine.
- Only upload JPG images. That, unless PNG is necessary. Try to avoid formats like TIFF and BMP.
So how do you go about resizing your images? I thought you’d never ask! It used to be a lot trickier to go about all of this. Fortunately, in recent years, resizing your images has become much friendlier.
A few tools that can compress images without sacrificing quality in no particular order:
Content Delivery Network
A content delivery network, or content distribution network (CDN), is a geographically distributed network of servers and data centers.
An excellent analogy to understand how a CDN is beneficial to users is by considering the banking system.
Imagine the lines in banks if ATMs didn’t exist. Today, getting cash out of your bank is as simple as finding the ATM closest to you.
Similarly, your central server can sit behind a content distribution network. Essentially, allowing the server to only work when needed and for the distributed network to serve most static files that don’t change as often.
Aside from offloading heavy loads from your server, this will significantly improve your site’s page speed. Instead of a user from Hong Kong waiting for your server in New York to respond, they can load your website directly through a CDN endpoint sitting in Hong Kong.
So how do you take advantage of this concept? Thankfully, it’s not nearly as complicated anymore as it used to be.
You can route your traffic through a free or paid CDN service with just a few updates to your DNS records.
A few services out there to consider:
Is website speed a ranking factor?
Speed is a Google ranking factor for mobile searches.
In 2020, Google launched a new algorithm update that takes into account your Core Web Vitals score.
The idea of this test is to prove if a website has a fast first-page load speed and user experience for a mobile device.
Before we discuss what this means, we should mention the history of the past few updates, Penguin 3.0 and Quality Update. Both of those updates were algorithm changes that dropped websites from rankings due to mobile usability issues.
Core Web Vitals, along with other features Google has said they are exploring for inclusion in future search results, are the next step in Google’s movement towards ranking websites based on their user experience instead of just using link metrics or keyword placements.
Google’s core search results are a mixed bag of user experience and link metrics. The Core Web Vitals signal is an even more direct approach to measuring user experience and how it relates to a website’s authority. How does Google define ‘good UX’ in this context? And how can you optimize for it?
Why is Google Doing This?
The web has evolved over the last ten years, and Google has adjusted its ranking algorithm accordingly. In the beginning, links were the most significant factor in determining a website’s authority. As time went on, however, other factors like website load time and mobile-friendliness became important as well.
Now, with the announcement of Core Web Vitals, Google is taking things one step further by directly measuring the quality of a website’s user experience instead of just factoring it into their algorithm as a secondary signal.
What are the three Core Web Vitals?
Google’s Vitals take a real look at the usability and accessibility of a web page.
The Largest Contentful Paint value looks at the difference between the first paint of a page and the point where you can’t scroll anymore.
FID looks at how long it takes from when a user has clicked a link until they see something on the screen.
CLS looks at whether or not users will understand what to do on a page without zooming in.
1. Largest Contentful Paint – LCP
Largest Contentful Paint is the measurement of how long it takes for Googlebot to see the “largest” piece of content on your page.
It then calculates this time in relation to the total loading time of that page.
The more text or images have to be loaded, the higher the paint time will be due to the additional bytes coming from these elements.
Measuring the largest contentful paint time (LCP) for your site can help you track performance, identify pain points, and prioritize improvements. Matching the LCP on your website to that of your competitors’ websites will also tell you what visitors expect from you.
2. First Input Delay – FID
First input delay (FID) is a term used to describe the time from when a user first interacts with a website to when the browser is able to respond to that interaction.
This metric can be most frequently used in testing with JavaScript-powered controls but is also an issue for mobile sites, where it can also be caused by mobile redirects.
First input delay is one of the only real-user performance metrics that directly relate to user experience.
While metrics like page load time, visual completeness, and download time all have a hand in ensuring that a page is visually complete when a user interacts with it, if a page isn’t able to respond to inputs at or near the same time as they are made, it will feel slow and laggy.
When it comes to the user experience, the perception of speed is arguably the largest contributing factor. The more quickly your site feels, the more likely users are to stay on your site. This is why measuring First Input Delay (FID) is so important. A recent study suggests that reducing FID can lead to an increase in conversions for some sites.
3. Cumulative Layout Shift – CLS
Cumulative layout shift (CLS) is a term that encompasses all of the various unexpected things that can happen to a website that cause elements on the page to shift around.
More often, I’ve seen this happen with images, but it can occur with anything. The most common places I see this are on homepage sliders, 3rd party call-to-action buttons, title tags, contact forms, and the social media buttons at the bottom of sites.
The longer it takes to load a webpage, the higher the chances of the site visitor leaving the page and going somewhere else.
So you can understand why a sudden shift of a website element could be a nightmare for your conversions rate if not adequately handled. The proper solution is not just minimizing CLS or eliminating it, but understanding what types of elements have caused shifts and if possible how to fix these issues.
How do I pass Core Web Vitals?
The Core Web Vitals assessment is part of Google’s Mobile-Friendly Test. The assessment evaluates the three Core Web Vitals (Largest Contentful Paint, First Input Delay, and Cumulative Layout Shift) based on field data. Failing the Web Vitals assessment could reduce your site’s ranking in mobile search results, impacting traffic to your site.
Core Web Vitals are evaluated based on scores in Google Search Console.
To improve your Core Web Vitals scores, check the following:
- For LCP – optimize your CSS and images, by following the steps outlined in the above sections.
- For FID – start by checking what elements are keeping the browser from going interactive. You can reduce JavaScript’s execution time or reduce the impact of your third-party code.
- For CLS – always have images with size attributes included and do not insert any content above other content elements that are already loaded.
Page speed tools
Google PageSpeed Insights
Google PageSpeed Insights is a great tool for understanding how fast your website loads. However, there are plenty of other tools you can use to track your website’s performance and turn that data into actionable insights for improving your website speed.
Pingdom
Pingdom provides you with an overall performance score which you can use to compare against other websites. This is done in the form of a star rating which you can view through its Chrome Extension.
Once installed it will ask for access to your PageSpeed Insights account. This allows Pingdom access to your account’s insights so your scores are consistent. For example, if you change hosting providers, you can still see how well your site is performing for different geographic regions, browsers, and devices when compared against the star rating.
GT Metrix
With this tool, you can set a goal for the maximum time a page takes to load. This will then give a score that indicates how well your site performs against that goal.
GT Metrix will also show you the steps in red that may need to be optimized to create better performance for visitors going through your website.
WebPage Test
WebPage Test gives you in-depth metrics into the anatomy of your web page with components like DNS, TCP, TLS, and more.
You can run simulations to test your user’s experience with global locations, modern devices, and the latest browser versions.
Using WebPage Test, you’ll quickly gain insight and a better understanding of what is making.
Improve page speed for a better user experience
How fast should a website load? Many factors contribute to site speed, including network bandwidth, server infrastructure, query optimization, and more.
Luckily for us, there are some very easy things we can do to improve how fast our site loads.
We live in a fast-paced, mobile-first world and slow site speed is now the number one complaint of Internet users everywhere. Make sure you are ahead of the game constantly and maximize your chances of success.
