With the launch of Core Web Vitals and Google’s upcoming page experience algorithm update in 2021, site speed and user experience have become more important than ever for your digital strategy. In this session, Alexis Sanders and Rachel Costello will explain how these updates will affect the search landscape, as well as showing exactly what you need to do to prepare.

1. The Future of Speed &
Performance: Your Core Web
Vitals Strategy
Alexis Sanders & Rachel Costello
#SEJeSummit
@AlexisKSanders @rachellcostello

2. How would
your 2021 be if
your team
could drive
these numbers:
+30% user engagement
+75% more revenue than average
+94% CVR
-24% abandonment
+30% revenue, +20% organic users

3. How would
your 2021 be if
your team
could drive
these numbers:
+30%
user engagement, Financial
Times
+75%
more revenue than average
ALDO
+94% CVR, Rossignol Skis
-24% abandonment, Google
+30%
revenue, +20% organic users,
Merkle eCommerce client

4. Companies that have shared bottom-
line performance improvements by
improving site speed.
Source: https://wpostats.com/

5. A user’s digital experience is
critical to a company’s success.
Optimal site speed is
critical to a digital experience.

6. About Alexis, Merkle
Role: SEO Director
Areas of expertise: Strategic &
technical SEO
Industries: Hospitality, telecom, real
estate, health, high tech (SaaS, cloud),
financial, travel, and retail industries.

7. About Rachel, Builtvisible
Role: Technical SEO Consultant
Areas of expertise: Technical SEO,
content, digital marketing
Industries: Leisure, ecommerce,
publishing, SaaS, insurance, travel

8. What we’ll
cover
● Google’s page experience update, Core
Web Vitals and how they are shaping the
SEO industry
● Optimization tips for future-proofing your
site against further algorithm updates
● Building a business case and getting buy
in for speed and UX implementation

9. An algorithm update is coming in
May 2021, with a new ranking
factor...

10. Page
experience

11. What is
page
experience?
It is “a set of signals that
measure how users perceive
the experience of interacting
with a web page beyond its
pure information value.”

12. What we
know so
far
1. The page experience algorithm update will
be released in May 2021.
2. We have been given 6 months notice
before it rolls out.
3. We will have work to do - Google only pre-
announces updates like this when there are
specific things we need to do. Remember
mobile-first indexing?

13. Query relevance is still key for ranking, but
page experience will determine rankings for
sets of pages with similar informational
value.

14. What are
core Web
Vitals?
This is “an initiative by Google
to provide unified guidance for
quality signals that, we
believe, are essential to
delivering a great user
experience on the web.”

15. The 3 most
annoying
things
about
websites
Loading
Experiencing a never-ending loading wheel, or a
blank page which slowly populates with
different tiles, like a slow, painful virtual jigsaw
being pieced together before your eyes.
Interactivity
Seeing the thing you want right in front of you
and clicking on it, with no response. And then
endlessly clicking in the vain hope that
something might eventually happen.
Going to click a button and the screen shifts at
the last minute and you end up clicking on a
new thing instead, then you have to go back to
find the thing you actually wanted.
Visual
Stability

16. What we
know so
far
1. Core Web Vitals are made up of 3 metrics that
help to measure the user’s experience of a page
as it loads; not just objective load times.
1. Largest Contentful Paint (LCP) will measure
visual loading, First Input Delay (FID) will
measure interactivity, and Cumulative Layout
Shift (CLS) will measure visual stability.
1. Core Web Vitals will be updated annually to
cover even more UX elements not yet being
measured, such as smoothness and privacy.

17. Core Web Vitals are a quantifiable way of
measuring user experience, this is why
Google has launched them.

19. Core Web Vitals (and other
important metrics) can be measured
in the lab via Google’s Lighthouse
Lab vs. field data
● Chrome DevTools
● web.dev/measure
● PageSpeed Insights
● WebPageTest.org
Field data (real user measurement)
is collected by Google and available
in the Chrome User Experience
Report (CrUX)
● CrUX API
● PageSpeed Insights
● Search Console (Core
Web Vitals report)

20. What do you prefer: lab or
field data?
Lab Fieldor

21. Why focus
on Core
Web Vitals in
2021?
#SEJeSummit
@AlexisKSanders @rachellcostello

22. 1. Getting
ahead of
Google’s
impending
update

23. Since 2010,
mobile sites’
size increased
>+1,200%

24. 2. UX

25. 3. Case
studies
● Enterprise eCommerce client:
○ page speed improved by +21%
○ users increased +20% (compared to prediction via
CausalImpact)
○ revenue increased +23% (compared to prediction
via CausalImpact)
○ bounce rate improved by +40% (compared to
prediction via CausalImpact)
● UK nutritional product client:
○ +26% site speed savings
○ +357% CVR
○ -62% CPC
○ estimated savings of £31k in paid search

26. So, how do I
get started?
#SEJeSummit
@AlexisKSanders @rachellcostello

27. Before we dive to deep
here, let’s address ->
What’s a non-dev to do?

28. Read
documentation
that Google
suggests to help
understand.
be that kid

29. Jim’s face, exactly.
Understand your
top competitions
performance
(nothing happens
in a vacuum).

30. Advice from a Jedi master. Yes, please.
Identify and
prioritize top
pain points.

31. Collaborate
w/devs to
determine
feasibility and
realistic
timelines.
unsuspecting
friendly dev
“slightly” over
caffeinated SEO

32. Be the person
that builds
compelling
business
cases to get
buy-in.

33. Us internal advocates during lunch & learns
Work
towards
getting
internal
education
and support
on site
speed.

34. Chat question:
What advice
has helped you
with promoting
site speed
initiatives?
(comment)

35. Step 1: Review data in GSC.
https://search.google.com/search-
console/core-web-vitals

36. Step 1.5: Run a test.
https://web.dev/measure/
or in Lighthouse in DevTools or in
PageSpeed Insights

37. Internalize
site’s top
issues.
GSC hands us this
information (and
let’s us validate
fixes!).

38. Step 2: Gather the data.
Identify core page templates
Run example pages from each template through PageSpeed Insights and
WebPageTest.org You can also use Lighthouse in DevTools

39. Step 2.5: Set
benchmarks
Where possible,
focus on realistic
competitors with
similar content
quality.
Template TTFB FCP LCP TTI FID CLS
Forecast page 0.7s 1.4s 2.6s 13.2s 45ms 0.64
Article page 0.8s 1.9s 2.7s 17.7s 37ms 0.15
Pollen forecast
page
0.7s 1.2s 1.9s 10.7s 32ms 0.64
Domain TTFB FCP LCP TTI FID CLS
Your client 0.7s 1.4s 2.6s 13.2s 45ms 0.64
Competitor 1 0.8s 2.3s 1.8s 27.4s 34ms 0.12
Competitor 2 0.8s 1.4s 2.4s 6.6s 51ms 0.56
Competitor 3 0.7s 1.8s 1.9s 17.6s 40ms 0.23

40. Step 3: Build a
business case
- estimate $ to
connect with
KPIs
https://www.thinkwit
hgoogle.com/feature
/testmysite/

41. ● Identify current vs. desired state
● Estimate impact of these changes
● Ensure feasibility of changes with devs
● Build user stories
● Build a roadmap to success
● Get buy-in from stakeholders
Step 3: Build
a business
case

42. ● WebPageTest.org
○ Image Analysis
● Chrome DevTools
● GTMetrix
Step 3:
Explore
other tools

43. The stacked Filmstrip views
from webpagetest.org is fire

44. 1. Get each filmstrip test
2. Add comma to end of URL + test
https://webpagetest.org/video/compare.php?tests=201012_DiZ0
_df9481ac4048033e5ba2e576d54062c2-r%3A1-
c%3A0%2C201012_DiZ0_df9481ac4048033e5ba2e576d54062
c2-r%3A2-
c%3A0%2C201012_DiZ0_df9481ac4048033e5ba2e576d54062
c2-r %3A3-c%3A0&thumbSize=200&ival=1000&end=visual

45. Tips on execution,
based on real-
world page
experience
auditing.
#SEJeSummit
@AlexisKSanders @rachellcostello

46. Remember,
Core Web
Vitals is just
one aspect
of page
experience

47. ● Improve server response times and reduce TTFB.
Utilizing CDNs, link rel=“preconnect” and caching static
resources can help here.
● Reduce the file size of resources like images.
Implementing compression, caching and CDNs can work
well.
● Prioritize the loading of critical resources by using link
rel=“preload”.
Optimizing
for LCP
Render main content
faster

49. ● Analyze third-party scripts in terms of main thread usage
and defer loading of non-critical ones like tracking tags below-
the-fold.
● Test interactivity of server-side rendered content as pixels
can be painted before re-hydration on the client side occurs
and interaction is possible.
● Minimize main thread work. Use code splitting to serve code
in smaller chunks and use web workers to deliver code off the
main thread.
Optimizing
for FID
Respond to user
interactions faster

51. ● Specify image and embed dimensions with the ‘width’ and
‘height’ attributes, or use a CSS aspect ratio box to block out
the required space. This is important to assess on responsive
sites which often leave this out.
● Assign static space to ad spaces, push non-sticky ads below
the viewport and add placeholders to reserved spaces rather
than collapsing empty ones.
● Avoid inserting new dynamic content above existing
content unless this is in response to user interaction. This
includes pop-ups and interstitials.
Optimizing
for CLS
Avoid sudden layout
shifts

52. What not to do Best practice

53. ● Use Mobile-friendly Test and Mobile Usability report in
GSC to see how well-adapted pages are to mobile.
● Incompatible plugins, viewport not set and text too small
to read are some of the key issues to avoid.
● Use URL Profiler to query the Mobile-friendly Test API at
scale. If Google’s tools return no results, run a few hundred
pages to verify.
Optimizing
for mobile
Ensuring mobile
friendly experiences

54. What not to do Best practice

55. ● Check the Security Issues report in GSC to see whether
your site has any hacked content, malware, unwanted
software, or social engineering content that tricks visitors into
revealing confidential information or downloading software.
● Use URL Profiler to query the Google Safe Browsing API to
test the safety of a broader subset of your pages beyond what
is reported on in GSC.
Optimizing
for safe
browsing
Removing malicious
or deceptive content

57. ● Spot check connection security in a browser such as
Chrome to check if individual URLs have connections that
aren’t secure.
● Run a full website crawl of your site’s URLs and resources
to identify pages, forms, images, and scripts that are being
served over HTTP to be migrated.
● Look out for expired certificates, TLS versions, HTTPS
being blocked by robots.txt and content embeds when
auditing HTTPS issues.
Optimizing
HTTPS
Ensuring secure
connections

58. What not to do Best practice

59. ● Analyze cookie banner and pop-up designs to make sure
they don’t take up too much of the viewport for users.
● Use your browser or ‘screenshots’ in Chrome DevTools to
do more manual analysis of interstitials.
● Use a crawler with JavaScript rendering enabled for
analysis at scale. In Screaming Frog, go to the ‘rendered page’
tab and flick through screenshots for the crawled list of URLs.
Optimizing
interstitials
Keeping key content
unobstructed

60. What not to do Best practice

61. (When you can) build with speed in
mind.

62. Keep a record of progress. When
you make changes, report on them.
Get everyone psyched about it.

63. To close us out, some tips
on working w/developers!

64. Be precise
about
requirements

65. Internalize it’s
easier to
critique than
execute.
what you don’t want anyone to feel.

66. Don’t assume
things are
simple to do.
I don’t want to get too introspective here, but ...

67. Prioritize.
Prioritize.
Prioritize.

68. Be open to
listening and
learning.

69. Be a partner in
the process.

70. Chat question:
What advice
has helped you
to work better
with dev
teams?
(comment)

71. Every resource has a cost.
You gotta get buy-in - creative to tech.
Optimizing for page experience will
future-proof sites against algorithm
updates in the long term, and improve
UX in the short term.
Your 3
takeaways
1.
2.
3.

72. Thank You!
#SEJeSummit
@AlexisKSanders @rachellcostello
#SEJeSummit
@AlexisKSanders @rachellcostello

73. Appendix
#SEJeSummit
@AlexisKSanders @rachellcostello

74. ● https://httparchive.org/reports/state-of-the-web
● https://web.dev/chrome-ux-report-data-studio-dashboard/
● How you stack up against competitors:
○ https://vitals-leaderboard.pazguille.me/
○ https://pagespeed.compare/
● https://builtvisible.com/googles-page-experience-update-and-
core-web-vitals-everything-you-need-to-know/
● https://www.searchenginejournal.com/improve-core-web-
vitals-scores-page-experience-signals/386542/
● https://web.dev/optimize-lcp/
● https://web.dev/optimize-fid/
● https://web.dev/optimize-cls/
Data &
Resources