How your page speed will affect SEO ranking in 2021

• #Digital

Google has announced that by May 2021, page speed will be a determining factor for SEO rankings. Here is a summary of how this will affect you and your business and a summary of 3 top things to consider:

The update

A year ago, Google announced it would factor in speed (load time) and other metrics when ranking Search results. And now, the time has come for the changes to take effect.

As of May 2021, the new initiatives will see Google penalizing slow pages to improve user experience.

So why is page loading time so crucial for SEO?

Because visitors want to interact with the website, and when they have to wait too long for this to happen, the website becomes undesirable.

Still, this shouldn’t necessarily be cause for panic.

According to Google’s official announcement, the ‘Speed Update,’ as they are calling it, “will only affect pages that deliver the slowest experience to users and will only affect a small percentage of queries. It applies the same standard to all pages, regardless of the technology used to build the page. The intent of the search query is still a very strong signal, so a slow page may still rank highly if it has great, relevant content.”

With that in mind, you shouldn’t see your website as an exception to the rule, so it’s best practice to make sure your landing page is as optimised as possible.

Avoid or remove 3rd party scripts

One reason why your website might be lagging is due to the impact of third-party JavaScript. We’re not talking about just one, but the cumulative effort of all.

In this case, you can either get rid of them or optimize the process.    

The first step is to identify slow-loading third-party JavaScript using tools such as Page Speed Insights, Chrome DevTools or WebPageTest, which will show you the number of third-party scripts loaded by your site and the time they take to execute.

Then, you have a few options:

1. Delay the Loading of Third-Party Scripts
   
   This is done one of two ways: by using HTML’s ‘async’ attribute to force the browser to continue parsing the rest of the website until the script gets downloaded (and once the script finishes downloading, it pauses parsing the HTML document to run the script).
   
   Or, by using the ‘defer’ attribute, which works in the same way except the browser doesn’t run the script until it has parsed the entire HTML document.
   
   
2. Self-Host Third-Party JavaScript Files
   
   If a script is considered critical to your website’s functioning, self-hosting will provide you with more control over how it’s loaded. You’ll be able to reduce DNS lookup and round-trip times, improve HTTP caching headers and take advantage of HTTP/2 server push.
   
   A word of caution: scripts can go out of date and will not update automatically when there’s an API change or a security fix.
   
   “Manually updating scripts can add a lot of overhead to your development process and you might miss out on important updates. If you are not using CDN hosting for serving all the resources, you are also missing out on edge-caching, and you have to optimize your server’s compression,” says Milica Mihajlija.
   
   
3. Remove the Third-Party Script Altogether
   
   Then again, if the script adds no apparent value, there is no need to keep it. If you are unsure, perform A/B testing to check if removing a script impacts your website’s performance vs usability.
   
   
4. Implement Browser Resource Hints
   
   DNS lookups, redirects, and any round-trips for loading each third-party script can add up to significant delays. Instead, you can use browser resource hints such as dns-prefetch or preconnect.
   
   This will help establish a connection with the external domain hosting the third-party script at the start of page load itself. In short, it’ll tell browsers to fetch and download resources for your pages ahead of time for better actual and perceived website performance.
   
   
5. Lazy-load Third-Party JS
   
   Embedded third-party elements such as ads and videos add a lot of stress on your website, but they are an essential income source for many sites.
   
   The solution lies in lazy-loading them.
   
   Suppose you’re serving ads in the footer of your website –  you can lazy-load them so that they’re only loaded when the user scrolls down the page (just by doing this, Mediavine had a 200% speed increase!)
   
   Tools such as Intersection Observer and Lazysizes are good starting points.

Content

First impressions count, and the look of a website is no different. However, content (specifically images, videos, and other media files), can delay loading times.

1. Resize Images
   
   Did you know that the average page size is more than 2 MB, and images comprise more than 60 percent of that?
   
   By compressing and optimizing your images, you reduce their “weight” without losing their quality. This way, Google won’t penalize your SEO ranking, and visitors can still view great images on your site.
   
   
2. Reduce Auto-Play
   
   Many businesses think that having auto-playing videos on their sites makes them stand out from the crowd, but an auto-playing video is very bandwidth-intensive. This will not resonate significantly with the 57% of online shoppers who supposedly abandon a page after 3 seconds of load time.
   
   Myth: Google will not penalize sites with auto-playing videos.
   
   Truth: Google will not penalize sites with auto-playing videos, but auto-playing videos are large, they are a disruption to the user, and might not always work (some mobile devices still won’t render an auto-play video). So, by proxy, Google will penalize the site.
   
   Unless they form an integral part of your marketing plan, getting rid of them can increase organic traffic, increase sign-ups, and improve your bounce rate.
   
   
3. Use SVGs
   
   If you want to maintain a raster image’s quality, the bigger it is, the larger the file size. This is because pixels-based graphics such as JPG and PNG don’t scale very well.
   
   Using graphics in the Scalable Vector Graphics format can shave off seconds of loading time because they maintain the same quality no matter their size on the screen.
   
   “SVG uses shapes, numbers, and coordinates — rather than a pixel grid — to render graphics in the browser, which makes it resolution-independent and infinitely scalable.”
   
   They improve the quality of zoom-ins (particularly for icons), don’t require ICC profiles, and can make a big difference in your website’s speed.

Use CDN

Along with the above mentioned reasons, website delays can also occur due to the physical distance between you and that website’s hosting server, and web “traffic”.

Today, most major sites like Facebook, Netflix, and Amazon deal with the problem using content delivery networks.

A CDN speeds up your loading time by distributing content closer to website visitors using a nearby CDN server. It can also handle more traffic and withstand hardware failure better than many origin servers.

Having multiple data centres globally improves the web site’s overall performance because it reduces data delivery latency.

With that said, keep in mind that CDNs are “next-level” optimizations – ergo, third-party services and not a self-contained fix.

Will your website be faster with a CDN? Absolutely. Do you need it? Not necessarily – you can still provide a decently fast website experience without a CDN, but it all depends on your goals, priorities, and budget.

Slow-loading sites are no longer tolerated, and it’s not just by Google. A site optimised for speed not only enhances the user experience (UX) but can also help to boost your search engine rankings, so it’s in your best interest to speed things up!