Why is it so important to speed up a website? There are many reasons – creating a better impression on your target audience, improving user experience and comfort, more reliability, saving precious time, etc. However, the most important one in this case is also the most obvious one – we must be faster than our competitors.
IMPORTANT ISSUES CONNECTED TO SPEED
First, it should be noted that the quality of a website is evaluated by Google and has an impact on a number of important factors, such as the efficiency of Google Ads, the selection of the right ad for the specific website, the consent for the publication of an advertisement as well as the position in the ad ranking system. In the process of approving Google Ads as well as later on during the campaign, there is an evaluation of how well the website “conforms” with the given advertisement. The reason behind this is that Google wants users to be able to quickly find what they are looking for. How quickly a website responds is one of the key elements reflecting its quality. This is true not only for the desktop version of a site, but the mobile form as well.
Nowadays, with the popularity of smarthpones and tablets, it is imperative to provide a smooth experience on every popular platform. An increasing number of other devices, such as smart TVs, also provide access to the internet as an additional functionality and should be able to run websites without issues. Furthermore, it’s worth mentioning the two main tools used by Google when verifying an ad. These are PageSpeed Insights and Mobile-Friendly Test. The first one analyzes the content of a website and suggests ways of improving its speed. The second one verifies whether mobile device users encounter problems when visiting a website. The tools are very simple to use – the only thing the user needs to provide is the website url. In exchange, we receive a lot of data that we can use to improve the behavior of our website.
Some theoretical information
To speed up a website, it is best to begin by checking its current parameters, you can do it here.
Website speed consists of 5 main elements:
- Time to Interactive (TTI) – 33.3%
- Speed Index – 26.7%
- First Contentful Paint – 20.0%
- First CPU Idle – 13.3%
- First Meaningful Paint – 6.7%
These are the five metrics that are taken into account. As you see, the first (TTI) is the most important one (33.3% value of the overall performance score).
The improvement of these metrics and the elimination of errors will cause a number of benefits, including:
- faster loading – improved website speed
- better SEO results
Let’s get down to work!
- What strategy should we use for page / score optimization?
To have better (faster) TTI, we recommend to:
- optimize it / optimize its loading time / remove it entirely
- How to test Performance score locally?
First, we usually apply some optimization, and we want to check performance score immediately after to verify if optimization helped. Just use Chrome /DevTool / Audits:
- open your browser in incognito mode
- click the ‘Audits’ tab
- check the following Categories: ‘Performance’, Device ‘Mobile’ – click Generate Report
Original PageSpeed Insights use similar ‘Lighthouse Engine’ to calculate the score. Therefore, checking Chrome Audits should give you an idea whether optimizations are going in the right direction.
- again – init ‘Generate Raport’ -> Chrome / DevTool / Audits
- click ‘View Trace’ (the button is located below the score numbers)
- click ‘Event Log’ tab
- now you can scroll down to see the scripts that are executed at the very end of the page loading process. Those should be optimized to improve TTI.
- What is not important or can be ignored?
PageSpeedInsights shows different “Opportunities” / Remarks that, in theory, should provide some help. Unfortunately, that’s not true. Most of the time, those remarks are difficult to implement and have 0 impact on the total score.
Therefore, such ideas like: Defer offscreen images, Remove unused CSS, add afficient cache policy, avoid excessive DOM size – have no practical sense. As such, they can be or even should be ignored. Why bother wasting time on things that don’t work?
- GoogleTagManager – don’t load it for PageInsights Crawler
- GTM is inefficient most of the time (it includes too many tags / events) and obscures the total score. We can use this snippet, but PageInsights will not load it
- Identify the part of the js code with long execution time. Don’t load it initially, only on demand (for example, when the user scrolls down to a particular section, or after clicking a button).
- Recommended plugin: https://github.com/stutrek/scrollmonitor
- Identify elements loading at the end. Let’s say we have a popup that is loading at the very end of the page loading process. Undoubtedly, this will increase TTI time (we have to wait for the popup to be loaded and displayed)
When you are conducting a speed test of your website and – in conjunction with the quality assessment with Google tools – you come to the conclusion that it’s time for optimization, it is worth reaching out to an experienced team with reliable solutions.
Using optimization, our team is able to increase traffic by nearly 40% on a website that supports a community of over 6 million users (see the details).
If you need a website and you want it to be professionally designed, contact our graphic design Link365 Global Solutions / RentDevelopers.
‘Link365 Global Solutions / RentDevelopers‘ is a software house, managed and run in Cebu, Philippines by European IT experts with over 15 years of experience. We offer a very competitive hourly rate with Western standards of services & code quality so you now get the best of both continents: excellent standards at an affordable price. Contact us now.
Article originally published here.