My Talk on Measuring User Experience On the Web using the Google Core-web Vitals metric system delivered for the Audience at GDG DevFest Ikorodu.

1. Measuring User
Experience on the
Web with Core Web
Vitals
GDG Devfest Ikorodu Oluwaseun Raphael Afolayan
@theafolayan

2. What are Core Web Vitals?
Core Web Vitals are a set of essential
metrics introduced by Google to quantify
crucial aspects of the user experience.
These metrics focus on aspects like
loading speed, interactivity, and visual
stability.
They Include metrics like:
1. Largest Contentful Paint
(LCP)
2. Cumulative Layout Shift
(CLS)
3. First Input Delay
(FID)

3. Why You should
you take them
seriously?
GDG DevFest Ikorodu

4. 70%
More than
Of online customers have their
willingness to buy online affected
by page-speed.

5. Diving Into Each
Metric
DEVFEST IKORODU ‘23

6. Largest Contentful Paint (LCP)
This measures how long it takes for the
largest content element on a page to load.
LCP should be less than 2.5 seconds in
order to provide a good user experience.
Why it matters:
LCP directly influences users' perception
of how quickly a page loads.
Tips for optimization:
● Optimize images.
● Prioritize critical
resources.
● Consider lazy loading.

7. First Input Delay (FID)
This measures how long it takes for the
browser to respond to a user’s first
interaction with a page, such as a click or a
tap.
FID should be less than 100 milliseconds
for a good user experience.
Why it matters:
FID reflects how responsive a web page is,
impacting user engagement.
Tips for optimization:
● Minimize JavaScript
execution time
● Use web workers
● Optimize third-party
scripts.

8. Cumulative Layout Shift (CLS)
CLS quantifies the amount of unexpected
layout shifts during a page's lifespan.
Ideal CLS should be less than 0.1 for a
good user experience.
Why it matters:
CLS helps assess and improve the visual
stability of a website, reducing user
frustration.
Tips for optimization:
● Set dimensions for media.
● Use CSS aspect ratio boxes.
● Avoid dynamically injecting
content

9. There is a fourth metric called Interaction to
Next Paint (INP) that Google has announced will
replace FID as part of the Core Web Vitals in
March 2024.
INP should be 200 milliseconds or less for a fast
and responsive experience.

10. Measuring the CWB
Measurement tools:
● Google PageSpeed
Insights
● Google Search Console
● Chrome Lighthouse etc.

11. Core Web Vitals
LCP (Loading)
Other Core Web Vitals
All Web Vitals
No Intrusive
Interstitials
Safe Browsing
/ HTTPS
Mobile
Friendliness
FID
(Interactivity)
CLS (Stability)

12. web.dev
Learn more on
Google’s resource centre for web
development & optimization

13. Questions,
Comments,
Compliments?