How to optimize the WPO on your web in a few steps
Last 24th of September, our SEO manager from Internet Republic, Laura López, went to the SEOnderground, the biggest digital marketing event of LATAM. She threw a useful presentation on ‘Tools for optimizing WPO performance easily without having knowledge about programming or anything related.
Let’s talk about WPO.
What are Core Web Vitals and how do they affect the web ‘s performance?
Web Performance Optimization (WPO, also known as Core Web Vitals) is a set of actions and improvements that are used on a web to reduce it’s loading speed, this way, the experience when using the page is a pleasant one.
Now, Laura explained the evolution of Core Vitals and talked about the existence of people who think that it’s something that doesn’t make an impact on rankings, while there are others that think otherwise. If we go back to John Mueller’s words, then the answer should be that it does affect the ranking of the website, but it won’t be the only thing having an effect on that decision.
Laura said that in her experience, optimizing WPO can provide a better position in ranking, so we must take that into consideration when upgrading our websites.
How can we improve our website’s performance?
It’s important to investigate what’s going wrong, why, and which tools are we going to use to examine it. So, we are going to divide this in three sections. The first step is checking our website’s performance. The second step is examining what is negatively affecting our site, and the last step is thinking about how to improve it for the better.
How to analyze a web’s performance?
There are countless tools that can help us carry out the task of checking on our website’s performance, but Laura also provided a list of what, in her opinion, are the best and most useful tools she’s encountered.
- Lighthouse: It allows us to analyze the page’s performance while using the browser, which provides speed when making a first report.
- PageSpeed: if we need more information on the web’s performance, this tool can differentiate what’s going right and what’s going wrong. It uses a very intuitive system of scores and colours to identify every detail.
- DevTools: within this tool, we can access an option that allows us to see what elements are being executed in our site. This is interesting because it shows which tags are being used by Google in the Core Web Vitals.
- Web.dev: this tool is similar to ‘PagesSpeed’. However, for each error it encounters, it also provides a solution, step by step, to said problem.
- Chrome UX Report: this is a ‘Google user experience report’ and it provides data on our web’s performance and its competition. It also allows us to monitor the results and select actions for each thing we want to change.
- Pagespeed Compare: a tool that allows us to select other URLs of competitors and access their main statistics. It can be used to compare to other competitors. It’s somewhat interesting especially if you want to do a quick benchmark on Core Web Vitals.
- Google Search Console: this tool provides data on errors happening at that moment and examples of other website’s in order to fix our’s.
- Google Analytics: it allows us to take notes of anything relevant related to the performance.
- Screaming Frog + Pagespeed: it’s important to analyze which URLs have bad working WPOs in order to fix them. We can measure this by adding the Pagespeed API to the Screaming Frog tool, which will allow us to thoroughly analyze each URL.
Where’s the negative impact coming from?
Usually, most of the errors we get in these Core Web Vital reports are the same in all the URLs. The negative impact can be because of:
- image sizes
- page loading speed
- resources blocking the rendering
- new generation formats
- a CSS that’s not being used
- changing or minimizing the CSS
- changing or minimizing the JavaScripT
How can I improve it?
Laura can help us turn the tide without any programming skills, and only by using some useful and easy-to-use tools and plugins.
One of the most common problems in website optimization is server loading time. How can this make an impact? Well, it has an influence on the TTFB (Time To First Byte), on the SI (Speed Indez), the FID (First Input Delay) and the LCP (Largest Contentful Paint). To improve it, it’s essential to keep our website updated, as well as our access privileges to the database and our API. By upgrading our hosting and cache, we also boost the site’s performance.
If we are, for example, working on WordPress, then the first thing we must do is update the CSS itself and the plugins we are using, to their latest version. Alway make a backup, if something goes wrong, it’s nice to have it saved somewhere.
Other things that slow down a website are the JavaCript and the CSS, because they influence the data from the: FCP (First Contentful Paint), the TTI (Time to Interactive), TBT (Total Blocking Time), LCP (Largest Contentful Paint) and FID (First Imput Delay).
To improve this step, we must shorten and unify the code, close all those processes that are not critical, fix the pre-loading (for resources needed in the first load), and remove any unused code. To make these improvements we can use the following plugins: WP Rocket, Autoptimize and Total Cache. Other compression tools would be CSSCompressor and JScompress, which will allow us to optimize the part of the code that we selected, thus achieving better performance.
Another thing we must be on the lookout for is any kind of multimedia. These can affect the FCP (First Contentful Paint) or the CLS (Cumulative Layout Shift). In this case, ‘fixing’ these files is very simple, we just have to optimize the pictures, resize them or compress them, and if there are videos, use LazyLoad so they are loaded at a different stage of the page charge.
The tools Laura recommends us to improve our metrics are Cloudinary and WP Smush. They are tools that allow us to analyze and manage everything we need. Other image compression tools are Compressjpeg and Compresspng, which help us optimize and reduce the pictures we are going to use. Another essential plugin is Lazy Load, which helps prevent videos from loading in our foreground and also achieve a simple and faster performance improvement.
Finally, we should considerar what Google marks in the cache. It affects the FCP (First Contentful Paint), the TBT (Total Blocking Time) and CLS (Cumulative Layout Shift). We can improve this in a very simple way:: optimizing the cache or indicating how much time there is to store in the cache. The most recommended plugins for these improvements are WP Super Caché, Total Cache and WP Rocket.
With these four things ( Server + JavaScript and CSS + multimedia + cache), we are now aware of what optimization features Google uses, so we can adapt and improve our website.
Thanks for reading!
Artículos relacionados
Internet República
Latest posts by Internet República (see all)
- New Instagram update: reel achievements - 19 October, 2023
- Elon Musk has bought Twitter. What does this mean? - 27 April, 2022
- NFTs ARE ARRIVING ON SOCIAL MEDIA - 21 February, 2022
