If you have been investing in SEO for some time, chances are that when you run your report your SEO score will be close to 100. Else, it may be time to change your SEO provider. As for the other metrics, the likelihood of achieving an ideal score is quite low. The reason for this is because most SEO agencies have historically overlooked user experience.
In fact, most SEO agencies do not have the in-house expertise to achieve some of the more technical optimisations when it comes to manipulating website files. It takes a certain level of experience and understanding of website code to achieve this.
However, although there are easy fixes to implement, they are not enough to ensure that your website surpasses all core web vital measurements. Each component of your website should be optimised to align with what Google wants to see from the resources of your website.
The good news, although these can be a nightmare to fix, is that there are many recommended solutions now available from Google. In addition to this, once you do manage to fix the issues, you will see an increase in user engagement and also your visibility on Google.
As some examples of techniques you can use to achieve the perfect core web vital score, take a look at our recommended suggestions below.
These are the same techniques that we used to get the perfect Web Vitals score for the client you just saw above.
1. Optimising page images
When a website loads slowly, you can almost guarantee that the majority of this bloat comes from large image files. For every image, the browser has to download the complete file before being able to serve the image to your visitors. Let’s say you have 10 images on your landing page and they are all over 1MB in file size. That’s 10MB that needs to be downloaded on top of everything else you want to display.
By optimising the images of your website, you can help speed up each landing page and offer a superb user experience to your customers. Take a look at some of our suggestions for optimising images below:
Content Delivery Networks:
If your images load from the same server, it might put a lot of load pressure on your server. The most effective way to dismiss this problem is by using a CDN server. AWS and Cloudflare are currently the best picks if you’re looking for a good Image CDN provider.
Google has a recommended image format which is called WebP. If you are using WordPress, there are plugins available (such as WebP Express) that will convert your images into this format. You upload via JPG or PNG and the plugin will convert and serve your images in this format to your users. It couldn’t be simpler.
Implementing a lazy loading technique also increases the score of WebVitals as only the onscreen image resources come along with the initial payload. The off-screen images will load as and when the viewers reach near the particular image viewpoint on the website. During the loading process, only the dimensions of the off-screen images load to avoid page break.
2. Optimising Java and CSS
GZip compression has become a standard practice for almost all websites. However, this is still important as it makes the files smaller and enables faster network transfer.
To be frank, there is a ton of it. Our tests have come out with mind-blowing results for websites that have enabled it.
3. Optimising website fonts
Font rendering behaviour is one of the most important speed drainers Browsers are trained not to render the text unless the font loads from the payload. This causes a lot of delay in rendering the pages and results in slower page speed. To optimise the font, ensure your CDN can override font rendering behaviour. A good CDN can swap the font of the rendered text and display the original font as soon as it loads from the CSS.
In normal cases, this happens within a few microseconds as both resources are delivered from the same CDN server simultaneously. This can significantly decrease the Cumulative Layout Shift and give you a perfect WebVitals score.
Embedding images and videos on a website can slow down a site. However, many businesses cannot choose to get rid of these videos since they are a part of a product demo or introduction video. Google recommends a quick fix for embedded images and videos where you can lazy load these assets too. Also make sure the video resources load only when a user clicks on the “Play media/video” button.
When we implemented this optimisation, it showed a 70% improvement in performance in Lighthouse.
A slow server can significantly affect the performance of a website. AMP cache can help optimise delivery, but enabling AMP for desktop may cause significant UI changes and impact conversion. So ensuring your server is responsive and fast still remains essential.