5 Under-the-Radar Ways to Optimize for Google Page Speed in 2020

February 11, 2020 - 6  min reading time - by Milosz Krasinski
Accueil > pll_6051d8652c9fc > 5 ways to optimize for Google Page Speed in 2020

Website loading speeds have also been extremely important to both search engines and website visitors alike. Studies have shown that bounce rates quadruple if a page takes just 5 seconds to load as compared to the accepted standard of 2 seconds. Of course, the debate rages whether or not bounce rates come into play when Google (or its numerous algorithmic filters) decide how high a site will rank for a particular query.

Source

Page loading speed has clearly become a critical ranking factor as the web becomes more secure and mobile usage (for search, content consumption, and monetary transactions) continues to increase. According to Google’s own research, mobile sites with faster loading speeds have 70% longer visiting sessions and 25% more ad viewability and two times more ad revenue. Add to that Google’s preference to crawl and index mobile sites over their desktop counterparts!

So what options do you have to speed up page loading? Nearly all marketers know that browser caching, reducing plugins, or using CDNs are common tricks to improve loading speeds – but these systems are simply not enough to improve ranking these days, considering that 80% of the results on the first two pages load in less than two seconds. Here are some “next steps” past the basics for page loading optimization in 2020.

1. Utilize Lazy Loading to Speed Up Rendering

While high-resolution images can certainly make your website look more appealing, they can really slow things down. These images take a long time to download and they can also increase your website’s overall size dramatically.

Google’s research shows that the majority of web pages are over 1MB in size, but can be brought down by up to 250 kb simply by compressing or optimizing these images. However, this can compromise the quality of the image which impacts the overall look of your site.

The smart solution is to use “lazy loading,” which involves progressively optimizing the portions of a webpage that are loaded as the user scrolls down. So, a high-resolution image that is lower down on the page will not be fully loaded until the user has reached that point.

Source

Web builder platform Duda conducted research on how websites can conform to Google’s latest Lighthouse 3.0 page loading standards, and integrated lazy loading into their platform, resulting in sites scoring over 90 in the Google PageSpeed test, with a ten-point lift in Lighthouse scores. Needless to say, these scores could have a significant impact on a site’s ranking.

Source

2. Combine Files to Reduce HTTP Requests

HTTP (hypertext transfer protocol) requests are essentially information sharing invitations from one computer or host to another. When a visitor arrives to your site, their computer sends out an HTTP request for binary data to the server so they are able to download the content. About 80% of a webpage’s loading time is spent fulfilling HTTP requests – but browsers limit requests to four to eight simultaneous connections per domain in order to work around this liability.

So, if your website is sending out or responding to multiple HTTP requests per page for features like plugins, themes, and images, it could really slow down loading speeds. The best way to reduce this number significantly is to combine multiple CSS and Javascript files into one larger file. This is fairly technical – you need to know exactly which code works together, and whether it might break a plugin or two. So marketers need to have a strong understanding of code or work closely with developers before attempting this.

3. Integrate CSS Sprites for Faster Image Loading

If there are numerous repeated images throughout your site, you can reduce HTTP requests and speed up the loading process by using CSS sprites. You need to combine images into a Sprite Sheet so that the browser only retrieves the images one time and reuses them on multiple pages by positioning the correct image into view.

This works best for symbols, such as your company’s logo or image icons, that are used on multiple pages in various sizes.

Source

This doesn’t take much design wizardry – a simple CSS Sprites Generator tool found online can do most of the work; you only need to drag and drop the images you want to combine.

4. Eliminate Tracking Codes for Rapid Parsing

Another additional function that you should consider eliminating or reducing is the number of tracking codes throughout your site. While every other plugin or martech tool wants you to add their code to the page, purportedly in order to track and analyze key data, they can really slow down loading speeds to a crawl.

It is best to eliminate tracking codes on pages that are less important or drive in the lowest traffic and only use it on important pages. Also, whenever possible, paste the tracking code at the bottom – just before you close the tag – so that the content of the page is loaded and displayed to the user even while the code is still loading.

Some apps like Google Analytics specifically instruct you to place the tracking code in the header of the page, so that they can start tracking what happens as soon as the page starts loading.

Source

As a marketer, you need to make an informed decision on the tradeoff between data collection and user experience.

5. Optimize On-Page Elements for Quick Functionality

There are a lot of little tweaks you can make to random on-page elements of your website other than images and videos. The little fancy bells and whistles are often the ones that place extra load on the server and prevent the page from loading quickly.

One is sliders and image carousels, especially in banners. Your customers are likely to see only the first or most attractive image in a slider before they lose interest (or get confused) and start to scroll down. In addition to being detrimental to conversions (by diluting attention), multiple images add to the size of the page.

Another is on-site search. Your site search should be quick and effective, especially on mobile. Users expect to find features like autosuggest and autocorrect with every search box; so, you need to make sure your code for returning results works like a charm every time.

Also focus on your checkout process if you have an ecommerce site. Many sites make shoppers suffer slow transition times from one stage of the checkout to next, and make them wait forever in suspense while their transactions are being processed. Speed up your payment processing by working only with tried and tested shopping carts and payment gateways.

Collectively, these small tweaks will make sure your interactions with customers remain simple and intuitive every time.

Wrapping Up

Loading speed has always been an important aspect for creating a user friendly and search optimized website, but I’m betting that in 2020, it is going to become even more imperative for businesses to pick up the pace. Google wants to provide its users with results from quality websites that offer a great UX – so a slow loading site just isn’t going to cut it.

By trimming the fat (reducing the size) of your content, optimizing images and scripts, reducing HTTP requests, and using tests like Google’s Lighthouse, you can expect to see significant and lasting improvements to your site’s loading speeds.

Milosz is a digital growth consultant with over 10 years of diversified experience in the digital landscape. Prior to the acquisition of Chilli Fruit Web Consulting, he has been involved in digital growth for Plus Guidance an early-stage UK start-up (now acquired) and Sigma Digital Marketing Agency based in Oxfordshire (Cherwell Business Awards Finalist 2017.) He is a speaker and blogger as well and consults for international brands.
Related subjects: