Google is a big fan of fast websites, and the more pages you can load in under 3 seconds, the better your rankings will be. Page speed has become one of many Google ranking factors, which means website owners are always optimizing for it. In this article we’ll explore some strategies that have helped propel sites to higher rankings on page speed.
The author’s opinions are solely his or her own (with the exception of hypnosis), and they may or may not represent those of SagaReach Marketing.
A timeline of Google’s quest to make the internet quicker.
When Google issued a call to arms in 2009 to “make the web faster,” it embarked on a crusade to encourage website owners to make their sites load quicker.
In order to persuade website owners to take notice, Google declared in 2010 that site performance will be taken into account in its desktop (non-mobile) search engine ranking algorithms. This meant that sites that loaded fast had an SEO advantage over those that did not.
Google said six years later, in 2015, that the amount of searches conducted on mobile devices had surpassed those conducted on desktop computers. This proportion is continuing to rise. According to the most recent statistics, mobile devices accounted for 61% of all Google searches in 2019.
Google’s “Accelerated Mobile Pages” (AMP) initiative was created in response to mobile’s now-dominant position in search. This project aims to encourage website owners to design a mobile theme that is separate from their responsive mobile theme that adheres to a set of extremely tight development and performance requirements.
Despite the fact that many site owners and SEOs grumble about having to worry about page speed and AMP on top of the other 200+ ranking variables that currently cause them issues, page speed is a worthwhile effort for site owners to make. In 2017, Google performed a research whose findings strongly supported their commitment to make the web quicker. “As page load time grows from one second to ten seconds, the risk of a mobile site user bouncing climbs by 123 percent,” they discovered.
Page speed became a ranking factor for mobile searches in July 2018, and Google is now using even more speed-related indicators (dubbed Core Web Vitals) in its algorithms.
With the average human attention span shrinking all the time and our dependency on mobile devices increasing all the time, page performance is, and will continue to be, an enormously significant consideration for website owners.
What is the best way to speed up a website?
Consider yourself a racing car driver.
It takes the same skills to win a page speed race as it does to win a vehicle race. In order to win a car race, you must ensure that your vehicle is as light as possible, as powerful as possible, and that you negotiate the circuit as quickly as possible.
To make page speed optimization strategies more comprehensible, I’ll use this comparison.
Make it as light as possible
Websites are more attractive and useful than they’ve ever been, but they’re also larger than they’ve ever been. The majority of current websites are like to a limo or a party bus. They’re quite opulent, with a plethora of conveniences, and so HEAVY and SagaReach MarketingOW. With a party bus or limo, you will not win in the search engine “racetrack.” You’ll make a good impression, but you’ll lose.
A GTMetrix test results page is the source of this image.
You’ll need a competent racing car that is lightweight to win the page speed race. Radios, cupholders, glove boxes, and anything else that isn’t strictly required aren’t found in race vehicles. Similarly, extravagant animations, video backdrops, large photos, fancy widgets, superfluous plugins, and anything else that isn’t absolutely required should be avoided on your website.
In addition to removing extraneous frills and plugins from your site, you may reduce its weight by doing the following:
-
Keeping the amount of third-party scripts to a minimum (code snippets that send or receive data from other websites)
-
Reducing the amount of fonts used and switching to a lighter-weight (less code-heavy) theme
-
AMP Implementation
-
Image optimization
-
Code compression and minification
-
Performing database optimizations on a regular basis
There are speed plugins for open-source content management systems like WordPress that may make a lot of these jobs considerably simpler. WP Rocket and Imagify are two WordPress plugins that may be combined to drastically reduce the weight of your website by using image optimization, compression, minification, and other page performance best practices.
Make it more powerful.
Why would you put your website on a dirt-cheap shared hosting package if you wouldn’t put a golf cart engine in a racing car? If you’ve been on one of those plans for a long time, it may be hard to spend more than a few dollars each month for hosting, but think of it as a golf cart vs a racing car engine: do you want to win this race or not?
Thousands of websites are crammed onto a single server in traditional shared hosting arrangements. As a result, each site is severely limited in terms of computational resources.
It’s time to buy a grown-up hosting plan if you want to race in the big leagues. Managed hosting firms for WordPress sites, such as WP Engine and Flywheel, use powerful servers that are particularly optimized to deliver WordPress sites quicker.
If managed WordPress hosting isn’t for you, or if you don’t have a WordPress site, a VPS (Virtual Private Server) will provide your website with much greater processing power. You’ll also have greater control over your own hosting environment, enabling you to “tune up your engine” with contemporary web server technologies like the newest versions of PHP, MySQL, Varnish caching, and more. You won’t be at the mercy of your shared hosting provider’s avarice as they cram more and more websites onto an already overburdened server.
To put it another way, placing your website on a well-tuned hosting environment is like to installing a supercharger on your racing car.
Improve your driving skills.
Last but not least, without a competent driver who understands how to traverse the track properly, a lightweight and powerful racing vehicle can only go so fast.
The section of this analogy that says “navigate the course” alludes to the process of a web browser loading a website. As the browser goes through the code and evaluates the page’s output, each piece of a website is another twist or turn for it to traverse.
I’m going to flip metaphors for a second to attempt to convey this better. Before renovating the flooring in a home, you should paint the rooms first. If you paint the rooms first and then refinish the floors, the new floors will have paint on them, and you’ll have to go back and refinish them.
A browser goes through a process termed (coincidentally) “painting” when it loads a website. Each page is “painted” when data from the webpage’s source code is received by the browser. This painting process can be done in a more efficient manner (for example, painting walls before refinishing floors) or in a more chaotic out-of-order manner that necessitates several trips back to the beginning of the process to redo, fix, or add something that could’ve/should’ve been done earlier in the process.
WebPageTest.org Test Result image source (Filmstrip View)
Things might become complicated at this point, but it’s critical to do all you can to assist your site drive the “track” more effectively.
Caching is a principle that should be used on every website to make loading a page simpler for the browser. Because it takes a browser a long time to parse all of a page’s source code and render it visually to the user, you should have that source code ready to go on the server. Without caching, this isn’t the case by default.
Without caching, the website’s CMS and server may continue to generate the webpage’s source code while the browser waits to render the page. This may force the browser to stop and wait for additional code from the server to arrive. The source code of a page is pre-compiled on the server using caching so that it may be transmitted to the browser in its entirety in one shot. Consider a photocopier that has a large number of copies of a document previously printed and ready to be distributed rather than needing to make a copy on demand each time someone requests one.
Plugins, your hosting provider, and/or a CDN may all help with different kinds and amounts of caching (Content Delivery Network). CDNs not only offer caching, but they also host copies of the pre-generated website code on a number of servers throughout the globe, lessening the effect of physical distance on load time. (And, sure, the internet is made up of physical servers that must communicate with one another across long distances.) In that sense, the internet is not a “cloud.”)
Using caching plus a CDN, to return to our racing car example, means a considerably quicker journey around the racetrack.
These are two of the most important elements of effective page painting, however there are many additional methods that may be used. The following can be done with WordPress using a plugin or plugins (again, WP Rocket and Imagify are a great combination for doing a lot of this):
-
Script loading that is asynchronous and/or delayed. This is a sophisticated way of saying that you can load numerous items at once or that you can load things later if you don’t need them right now.
-
Preloading and prefetching are two terms that are used interchangeably. In other words, getting info about links ahead of time rather than waiting for the user to click on them.
-
Loading is slow. Although this idea exists for page performance concerns, most browsers by default load ALL photos on a page, even those that are hidden until a user scrolls down to see. Lazy loading tells the browser to be lazy and wait till the user scrolls down to see those out-of-sight pictures before loading them.
-
Images in next-generation formats are served. Browsers can load new image formats like WebP far quicker than they can traditional image formats like JPEG and PNG. However, not all browsers can accept these new formats yet, so be sure to install a plugin that can serve up the next-gen versions to browsers that can, while providing the old ones to browsers that don’t. When WP Rocket is used in conjunction with Imagify, this is possible.
WP Rocket plugin settings are the source of this image.
Optimize for the most important aspects of the web
Finally, optimizing for the new Core Web Vital metrics (Largest Contentful Paint, First Input Delay, and Cumulative Layout Shift) will help you go around the racetrack much faster.
source of image
These are quite complex terms, but here’s a brief rundown to help you understand what they mean:
- The painting of the page’s biggest element is referred to as Largest Contentful Paint (LCP). The PageSpeed Insights feature from Google will inform you which piece on a page is deemed the LCP element. This is often a hero picture or a huge slider section, but it varies each page, so use the tool to discover the LCP on your website and then consider what you can do to make that element load quicker.
-
The Initial Input Delay (FID) is the time it takes for the browser to react to the user’s first action. A button that is displayed to a user before it gets clicked is an example of a FID problem. The reason for the delay is because the click functionality loads much later than the button itself.
-
The acronym CLS stands for Cumulative Layout Shift, and it refers to a single notion. You know how when you’re on your phone loading a website and you want to click on anything or read something, but it jumps up and down because something else loaded above or below it? That movement called CLS, and it’s quite irritating. It’s a result of poor page painting.
Finally, a racing vehicle beats a golf cart.
Page speed optimization is obviously difficult and perplexing, but it is a necessary component of improving results. You’re in this race whether you like it or not as a website owner, so do all you can to turn your website into a racing car rather than a golf cart!