The penultimate instalment in our Core Web Vitals series dives into website improvements and how we can generate a better overall user experience. To learn a little bit more about Core Web Vitals and how they’re measured, check out our previous posts: An Introduction to Google’s Core Web Vitals, Core Web Vitals Metrics and Measuring Core Web Vitals.
Optimisation
Optimisation and continual testing are key to improving your site’s Core Web Vitals. Tools that monitor Core Web Vitals metrics, such as PageSpeed Insights are hugely valuable in offering not only suggestions on improvements but also detailed feedback on file compression and merging. Whilst not all the suggestions on optimisations are achievable for every website, the majority can be checked-off with recommendations from Page Speed Insights.
Optimising LCP (Largest Contentful Paint)
LCP (Largest Contentful Paint) stands as a fundamental metric within the Core Web Vitals, measuring the speed at which a web page’s primary content is loaded. You can improve a site’s LCP in a number of different ways. Some of the most common are; reducing unused Javascript, reducing unused CSS and eliminating render-blocking resources. Another method is ‘reducing initial server response time’. Server response time can usually be improved by upgrading to a faster hosting package or using a CDN.
Optimising FID (First Input Delay)
FID (First Input Delay) measures interactivity. More specifically, it measures the time from when a user first interacts with a page to the time when the browser is actually able to respond to that interaction. The faster a page is interactive, the shorter the FID.
The main cause of a poor FID is large JavaScript files taking a long time to execute. The execution time can be reduced by removing unused JavaScript and deferring less critical scripts. Another method to increase interactivity readiness is to avoid an excessive DOM size.
Optimising CLS (Cumulative Layout Shift)
CLS (Cumulative Layout Shift) measures the instability of content. It examines the extent to which visible content has moved within the viewport and the distance by which the affected elements have shifted. Aiming for a perfect score of 0.1 or below, CLS can be improved by: Ensuring all images, iframes, ads and embeds have dimensions; avoiding CSS animations for box-shadow or box-sizing and ensuring that web fonts have a similar fallback font. Making these updates can avoid unnecessary layout shifts when loading a site.
In summary
Having an optimised website is a crucial part of making a good first impression. Improving your site’s Core Web Vitals can greatly enhance the user experience and in many cases promote a lower bounce rate and increase user engagement.
Let’s keep in touch
Join our mailing list for insight that can boost your business. Unsubscribe anytime.