It is becoming increasingly important to have a fast website. Google values a website that loads super fast. So today I’m going to talk about how to get a 100/100 score in Google Pagespeed Insights!
A piece of background
Google has a lot of expectations. She wants a (visitor) searcher to get value for money and that they get the best result based on their search query. The countless algorithms of this search engine all contribute to getting the best search result. But Google remains a machine and is not an omniscient power. The expectations or requirements that Google sets for a website or webshop also have their flaws. This is also the case with the speed of a website.
Google uses the Pagespeed Insights tool to map the speed of a website on both mobile and desktop. This is expressed in a score of 0/100 to 100/100 (see images below). As mentioned, this system also has its flaws, which you can read more about below.
If you look purely at the performance and speed of a website, a score of 100% in Google Pagespeed Insights does not exactly correspond to a fast website. Having a 100/100 score in this tool does not mean that your website is super fast. This phenomenon also works the other way around: a super fast website does not necessarily have to have a 100/100 score in Pagespeed Insights.
I wouldn’t be an SEO if I didn’t see website speed and a 100/100 score in Pagespeed Insights as two separate things. Today I will therefore not discuss how to make your website super fast, but I will discuss how to achieve a 100/100 score purely from ‘ scoring in Google ‘. In this way, you don’t just use a fast website to please visitors, but you use it as an active means to possibly achieve higher positions in Google.
1. Provide a solid foundation: hosting
The fact that the results of Paspeel Insights do not correspond 100% to reality does not mean that you do not have to do anything about the speed of your website. It is still important to build a solid foundation.
With a solid foundation I mean good and reliable web hosting. Every website has features that increase loading time. If there’s enough horsepower to work with, and your hosting has enough space for your website, you already have a solid foundation to work with. To be on the safe side, you can also make sure that you don’t use shared hosting , where you share a server with several others.
2. Prioritize content above the fold
As soon as a visitor lands on your website, he already sees part of your website. This is content that is visible without the visitor having to scroll down. To stay in book terms, this is referred to as “above the fold” content. Because Google wants visitors to get started right away, it’s important to prioritize content above the fold.
Keep this in mind when building your website – especially how the HTML of the website is structured. For example, you have to ensure that the data that is loaded above the fold is reduced. Another option is to make sure that the HTML is structured in such a way that the important content above the fold appears first before other elements are loaded. Are you not that familiar with coding, or do you not have anyone for this? Then I advise you to choose a theme for your website that supports this ambition.
3. Minify code as much as possible
Although a website with all kinds of bells and whistles is a nice business card, Google generally prefers small, compact websites. This really doesn’t mean you have to make a white area with a menu and text. It does mean that you should limit/remove ‘unnecessary’ code as much as possible. If you make the code of your website more compact, it will make the site load faster.
First of all, you can get started with shortening the code yourself. Let programmers get to work digging through CSS, HTML, and JavaScript on your site. In it, have them remove the following things: unnecessary blank lines, unnecessary newlines, excess formatting, or parts of the code that are older and are currently not being called at all.
Are you a bit on the lazy side, or do you not have the means to do this manually? Then I advise you to use tools for this. Think HTMLMinifier , CSSNano and UglifyJS.
4. Implement browser caching
Whenever you visit a website, your browser saves parts of the website in a local cache. Think of HTML, CSS, JavaScript and images. When you visit the website the next time, your browser has already saved it, so to speak, so that the website loads even faster on a second visit. But this must be set.
It is very easy to set up browser caching. If you have a WordPress website, you can do this through plugins like W3 Total Cache or WP Rocket .
5. Optimize images
This is probably the tip you’ve heard before, but it’s too important not to include in this overview. Images are still the part where you can get the most profit. Check all images on your website and resize them as much as possible. This is possible, for example, with Compressor or Compressjpeg . Also useful to know: jpg images are generally a lot smaller than png images!
A nice rule of thumb to use, and to check whether the images have actually been optimized, is not to make them larger than 200 to 300 kb. It is also not good to make the image much smaller than 100kb. In this case it does load quickly, but you have the chance that the image on full screen will not be displayed properly.
Thoroughly implementing all these changes can earn you 50 points in Pagespeed Insights!
6. Reduce files
Your website consists of several files. A browser must send a request to the site’s server to load all of these files. If your website consists of hundreds of files, all of which are also very large, the server and browser take a very long time to load the total in mutual communication. Each request is called a request . If you merge the right files and merge as many as possible, you reduce the number of requests and ensure that your browser receives the files at lightning speed. This is also a point that makes Google very happy.
Now of course you also want to know how to approach and reduce/reduce these requests! This is quite complex matter, but the requests from your website can be handled via the .htaccess , among other things . Here you can, for example, merge various CSS files.
7. Remove Render Blocking
‘Render blocking’ is a generally accepted term within web design, but the pity is that there isn’t really a nice Dutch term for it. So that’s my title for this tip. Let me explain what render blocking is and why you should ensure that your website does not apply it.
Your website has many parts that are not interesting for a visitor, but that need to be loaded. Think of certain CSS or certain (Java) Scripts, such as Google Analytics. You need this information, but it is basically of no use to the visitor.
What you can do then is to load certain CSS and JavaScript files by placing them in the <head> tag. Parts that are of no use to a visitor, such as Google Analytics, can be placed in the footer again. Google Analytics is only for measuring statistics, and will therefore only slow down your website. It is therefore useful that this is loaded last and that the CSS and Javascript files that actually have to do with the website are loaded first.
Also look at other tools
All in all, a super fast website is no guarantee of a 100/100 score in Google PageSpeed Insights. And a 100/100 score does not guarantee a lightning fast website. By implementing the above points, you build your website according to Google’s rules. This will surely make them appreciate your website more. In addition, your website will of course also become a lot faster.
If you do not want to be completely dependent on Google, and ensure that your website actually becomes lightning fast, then I would not only use Google Pagespeed Insights, but also look at other tools. The main tools I use for this are GTMetrix and Pingdom Tools . Just like with Google, concrete points for improvement are put forward here, which you can go a long way with even as a layman!