Page Speed SEO: 23 Ways to Speed Up Your Website in 2021
Google Page Speed is an incredibly useful tool for SEOs and site owners of all types.
In this post, you’ll find out (almost) EVERYTHING you need to know about page speed and SEO, including how to speed up your website.
We’ll cover how Google has evolved page speed and what that means moving forward.
Let’s get started!
How important is page load time in SEO?
Search Engine Optimization (SEO) is about performing actions that optimize for search engines. In turn, those search engines aim to optimize for relevancy of searchers — a.k.a. people.
I think you get the point, page speed is important.
So a crucial part of SEO is being aware of what people like and expect. And with few exceptions, people don’t like slow sites.
Looking forward, there are fewer and fewer reasons to tolerate a slow site. And Google themselves continuously put on pressure to have page speed affect rankings.
Increasing site speed has been shown to increase SERP rankings and other metrics like conversion rates.
How much does page speed affect SEO?
Most notably was the introduction of PageSpeed Insights.
What is PageSpeed Insights?
PageSpeed Insights (PSI) is a tool from Google used for auditing the performance of a page for mobile and desktop devices and suggesting how it might be improved.
What is Lighthouse?
Lighthouse is an open-source, automated tool for auditing performance, accessibility, progressive web apps, SEO, etc.
PSI uses Lighthouse to analyze a given URL, generating a performance score that estimates the page’s performance on different metrics, including First Contentful Paint, Largest Contentful Paint, Speed Index, Cumulative Layout Shift, Time to Interactive, and Total Blocking Time.
In May 2020, Google announced Web Vitals to provide unified guidance for quality signals essential to delivering a great user experience on the web.
What are Core Web Vitals?
Core Web Vitals are a standard set of signals critical to all web experiences.
The 2020 Core Web Vitals’ foundation is loading experience, interactivity, and visual stability of page content.
These are represented with the following metrics: Largest Contentful Paint, First Input Delay, and Cumulative Layout Shift.
By the end of May 2020, Google provided an early look at an upcoming Search ranking change—Core Web Vitals will become ranking factors.
Google stated that Core Web Vitals are a way of evaluating page experience for a better web and “looking ahead towards 2021, we are investing in building better understanding and ability to measure page speed, and other critical user experience characteristics.”
And Google said that over the next few months they would be updating Lighthouse, Chrome DevTools, PageSpeed Insights, Search Console’s Speed Report, and other tools for Core Web Vitals.
Page Speed is a big deal.
How can I increase Google Page Speed?
When looking to increase page speed, technical problems are some of the most common issues you’ll face. Technical SEO tools are remarkable for helping you find and fix a wide array of technical issues.
Because there’s a vast array of problems your site may be having, tools like Google PageSpeed Insights and other site audit tools give you better website analysis to optimize more effectively.
Let’s check out these tactics in more detail:
1. Eliminate Render-Blocking Resources
Every user has to download and process these files before they can see the rest of the page, so having a lot of them, or poorly optimized files, can negatively impact your site’s speed.
Google recommends two solutions:
2. Avoid Chaining Critical Requests
This audit message refers to how browsers render content through the Critical Rendering Path (CRP).
A few ways to avoid chaining critical requests are covered by other recommendations here, including:
- Eliminating render-blocking resources
- Deferring offscreen images
3. Keep Request Counts Low, and Transfer Sizes Small
Every request slows your page speed. So, it makes sense to recommend that you minimize the number of required requests to decrease the time it takes to load.
There’s not any specific request number or maximum request size to follow. Instead, Google recommends setting a performance budget with goals related to things like:
- Maximum image sizes
- The number of web fonts used
- The number of external resources you call
- The size of scripts and frameworks
4. Minify CSS
CSS files are always larger than they need to be.
To make them easier to work on and develop they might include unnecessary characters like carriage returns and spaces that are wasted space that doesn’t help computers to read them any faster.
Minifying CSS is the process of condensing CSS files by removing those unnecessary characters like spaces, and duplications. This can greatly reduce your CSS file size, and the increase in speed gets bigger with the size of your CSS file.
6. Remove Unused CSS
Any styles included in your CSS is data that will have to be loaded before your page is visible to users. If that data isn’t actually being used, you’re wasting resources and slugging your performance. That’s why it’s often recommended to remove any unused CSS.
Google Chrome Dev Tools has a coverage tab that will show you what CSS a page actually uses.
- Press Command+Shift+P (Mac) or Control+Shift+P (Windows, Linux, Chrome OS) while DevTools is in focus to open the Command Menu.
- Start typing coverage and select Show Coverage. The Coverage tab appears.
- Click a CSS file to see a line-by-line breakdown of what CSS it uses.
7. Minimize Main-Thread Work
Main-thread is responsible for turning code into a webpage that users can interact with.
So when the main thread is working through your site’s code, it can’t handle user input.
If your site makes the main-thread take too long, you’re likely not providing a good user experience and slow page loading times (that Google will factor into rankings).
Ways to reduce main-thread work share methods for other sections, including:
- Minifying your code
- Removing unused code
- Implementing caching
9. Reduce Server Response Times (TTFB)
Time to First Byte (TTFB) measures how long it takes for a browser to receive the first byte of data from your server after making a request.
Several factors that can influence and lower your TTFB include:
- Using a high-quality web hosting provider
- Using lightweight themes and plugins
- Reducing the number of plugins installed on your site
- Using a Content Delivery Network (CDN)
- Implementing browser caching
- Using a quality Domain Name System (DNS) provider
10. Properly Size Images
Images quickly become the largest tear on site performance if you’re not careful.
Images that are larger than they need to are automatically resized with CSS, and this takes longer than using properly sized images to begin with.
Properly sizing images is a simple way to reduce your loading times.
Either upload images at the proper sizes, or use responsive images by creating differently-sized images for various devices and use the srcset HTML attribute.
11. Defer Offscreen Images
Deferring offscreen images is commonly known as lazy loading.
Instead of making the browser load every image on a page before displaying above-the-fold content, you can have it only load images that are seen on page load. Less loading means better performance.
12. Efficiently Encode Images
You’re probably getting the point that images have a significant impact on site performance. One of the most basic optimizations you can do is compression.
This reduces your file sizes so they’ll load faster.
Additional recommendations to compressing images include:
- Serving images at the correct size
- Implementing lazy loading (deferring offscreen images)
- Converting images to next-gen file formats, such as WebP
- Using video formats for animated content, such as GIFs
13. Serve Image in Next-Gen Formats
Some image file formats will load more quickly than others.
We’re not talking about your PNG or JPEGs. But image files like WebP and AVIF are becoming the new standard.
14. Use Video Formats for Animated Content
Animated content delivered through formats like GIF cost to your performance.
GIFs are demanding to load, and you’ll see recommendations to load video formats like:
- MP4: Will create slightly larger files, but is mostly browsers compatible.
- WebM: Highly-optimized video format, but has limited browser compatibility.
15. Ensure Text Remains Visible During Webfont Load
Similar to images, fonts are often large files that take a good amount of time to load. Browsers sometimes even hide text until the font loads completely.
You can resolve this issue by applying the Font Display API swap directive in your @font-face style.
16. Enable Text Compression
In some cases text compression is enabled automatically on your server. If that’s not the case for your site, here’s a few things you can do.
- The first is to install a plugin with a GZIP compression feature.
- Compress your text manually by editing your .htaccess file.
17. Preconnect to Required Origins
Preconnect HTML attributes immediately tell browsers that you have third-party scripts on your page that need to be loaded so they can initiate as soon as possible and improve your performance.
You likely have a couple third-party resources on your site.
These resources take time for browsers to establish a connection to these resources and slow down your loading speeds. So it helps to tell browsers that they need to establish a connection as quickly as possible.
18. Preload Key Requests
Following preconnect, preload minimizes the number of requests browsers must make to your server.
But instead of connecting to third-parties “preload key requests” refers to loading critical assets on your own server.
19. Avoid Multiple Page Redirects
You’ll often have redirects when you move or delete a page on your site. While this is what you should use redirects for, be aware that redirects do cause additional delays in loading time.
So avoid using multiple redirects unless you absolutely have to.
20. Serve Static Assets With an Efficient Cache Policy
Caching refers to how browsers save copies of your pages to load faster on future visits.
Browsers periodically clear their caches to keep them updated and you want this time to be higher rather than lower.
Clearing your site from browser caches every couple of hours doesn’t make any sense, so you can optimize your cache expiration period using Cache-Control and Expires headers.
21. Reduce the Impact of Third-Party Code
We’ve already touched on how third-party scripts can do big hits to your performance. So it’s important to reduce their impact on your performance where you can.
A few methods to reduce the impact of third-party code on your page speed include:
- Use link tags with preconnect attributes
- Self-host third-party scripts
22. Avoid Enormous Network Payloads
Large network payloads use more data and cost everyone more money. Minimizing the number of network requests needed to load your site helps avoid this.
Google recommends keeping your total byte size under 1,600 KB.
A few ways to lower your network payloads include:
- Minifying code
- Compressing image files
- Using the WebP format for images
- Implementing caching
23. Avoid an Excessive Document Object Model (DOM) Size
The DOM is how browsers see HTML as objects in a tree-structure with individual nodes representing each object. The larger your DOM is, the longer it takes to load.
Google recommends you keep DOM trees with:
- Under 1,500 nodes in total
- Under 32 node depth
- Under 60 child notes for any parent node
Page Speed matters for your ranking. Google continuously focuses on measuring page speed alongside other user experience characteristics.
We covered how Google search has, over the years, put more effort into measuring page speed. Your page speed should be a focus moving forward, but page speed is just one of many SEO KPIs you should be tracking.
We also shared SEO tools that can give you recommendations to work on your site, and ways to improve your page speed.
Do you have questions about Page Speed or optimizing your site’s performance?
Our SEO audit service provides actionable insights into putting your site on the right path, and our team can take care of the implementation work required to increase targeted search traffic to your business.
Never miss an article again.
Sign up for our newsletter to get the best content directly to your inbox.
Now it’s your turn.
Now I’d like to turn it over to you to spark a debate or lead a new discussion.
What in this post were you excited about? What was useful? What would you like to read more about?
Or maybe you just have a question about something you read.
Either way, let us know in the comments below.