Why is page speed important?
The faster the page loads the better especially on mobile phones as the users patience isn’t that great on mobile. The user is on to the next thing if the site loads slow. Many newspapers have a problem because they are dependent on ads and connect to many different ads servers. These can from time to time be slow in responding and that influences the loading of the page. They have what we call bad Core Web Vitals.
Core Web Vitals
In this post you will learn some actionable items on how to improve your metrics
Let’s dive into it.
What are Core Vitals?
Core Web Vitals are a set of factors that Google considers crucial for assessing a webpage’s overall user experience. They consist of three specific metrics related to page speed and user interaction. These metrics score how quickly page content loads, how quickly a browser loading a webpage can respond to a user’s input, and how unstable the content is as it loads in the browser. These metrics are:
- LCP
- FID
- CLS
Largest Contentful Paint (LCP)
Measures the loading performance of a page, specifically the time it takes for the largest content element in the viewport to become visible. It aims to provide a good understanding of how quickly the main content of a webpage loads and becomes readable for the user. So, a large image or a YouTube video, text block or a background video can influence your LCP.
Action: Preload any images, video or iframes above the fold and defer all other.
First Input Delay (FID)
Assesses the page’s interactivity, capturing the time from when a user first interacts with a page (i.e., when they click a link, tap on a button, etc.) to the time when the browser is actually able to begin processing event handlers in response to that interaction. This metric helps in understanding the experience users have when trying to interact with unresponsive pages. So, it measures when the user first can interact with the page. The user might see a visual button but can’t interact with it until all JavaScript is loaded for example. Make sure you state for example width and hight attributes in images tags. Make sure that you state attribures like width and hight in the image html tags.
Cumulative Layout Shift (CLS)
measures the visual stability of a page, quantifying the amount of unexpected layout shift of visible page content. A low CLS score is crucial for ensuring that the page is stable as it loads, preventing users from clicking on something by mistake because the content moved unexpectedly.
Source: Google
My notes: Here are a list of items you should focus on:
- Optimize TTFB (Time To First Byte)
- Enable caching of your pages. Use a cache plugin like LiteSpeed, WP Rocket or W3 Total Cache
- Defer JavaScript. You can use a PlugIn like Autoptimize.
- Compress images by using a service like shortPixel or go there manually compress the images.
- Convert images to wepb. All browsers support this format today or use a plugin called MediaConvert.
- If you have images above the fold you can preload these.
- If you have YouTube videos above the fold consider having an image and then lazy load the iframe
- Use a service like NitroPack which take care of all above for you and have a CDN in additon.
- Use Simple Local Avatars Plugin
Google has stated Core Web Vitals as a ranking factor and that is why you should be concerned. You can check your Core Web Vitals here https://pagespeed.web.dev or https://webpagetest.org
Webpage Speed Quick Fix!
If you want to set and forget a service like NitroPack will improve your page speed. You install their plugin and they take care of the rest. See the How to Instll NitroPack for Webspeed Optimization.
Conclusion WordPress Page Speed:
When you are dependent on external sources check their influence on your sites performance and tweak the settings so you minimize the influence on your scores. Look out for my guide how to fine tune your Core Web Vitals which is work in progress. See the image below the details for this post, yes each post and page on your site has it own score, but you can optimize site wide. There is a score for both your mobile which is the most important and for desktop.
