Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

What you need to know about Core Web Vitals

Slides from my talk at the online Pint Sized Marketing Meetup in July 2020 about Google's new Core Web Vitals metrics and how they impact on a webpage's SEO.

  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

What you need to know about Core Web Vitals

  1. 1. @badams @badams What you need to know about CoreWebVitals
  2. 2. @badams
  3. 3. @badams @badams https://webmasters.googleblog.com/2020/05/evaluating-page-experience.html
  4. 4. @badams @badams Page Experience
  5. 5. @badams @badams Core Web Vitals https://web.dev/vitals/
  6. 6. @badams
  7. 7. @badams @badams Largest Contentful Paint
  8. 8. @badams @badams Largest Contentful Paint (LCP) • How fast does the page content load? ➢It measures when the visible content on your screen is rendered • Includes text, images, and videos • Optimal is 2.5 seconds or faster
  9. 9. @badams @badams Common causes of slow LCP ➢ Slow server response time (TTFB) ➢ Render-blocking resources (JS / CSS) ➢ Slow-loading resources (large files) ➢ Client-side rendering (CPU-intensive code)
  10. 10. @badams @badams Troubleshooting LCP • Server Response Time; ➢ Reported in GSC legacy report: Crawl Stats ➢ Also measured with WebPageTest.org
  11. 11. @badams @badams Troubleshooting LCP • Render-blocking Resources; ➢ Easily measured with PageSpeed Insights
  12. 12. @badams @badams Troubleshooting LCP • Slow-loading Resources; ➢ Large images, JS & CSS files
  13. 13. @badams @badams Improving LCP • Server Response Time; ➢ Improved hosting ➢ Server-side caching / CDNs • Render-blocking Resources; ➢ Include critical CSS & JS inline in the HTML source • Slow-loading resources; ➢ Optimise & minify images, JS and CSS files
  14. 14. @badams @badams Improving LCP • Server Response Time; ➢ Improved hosting ➢ Server-side caching / CDNs • Render-blocking Resources; ➢ Include critical CSS & JS inline in the HTML source • Slow-loading resources; ➢ Optimise & minify images, JS and CSS files
  15. 15. @badams @badams First Input Delay
  16. 16. @badams @badams First Input Delay (FID) • How fast does the page respond to a user’s input? ➢ Does it respond quickly to scrolls & taps when it first loads? • Human reaction time averages around 215 ms ➢ Anything over 300ms would be noticeable lag
  17. 17. @badams @badams Common Causes of slow FID ➢ 3rd Party Code; - Social media - Embedded content ➢ CPU-intensive code; - Badly written JavaScript
  18. 18. @badams Troubleshooting FID • Measure it with PageSpeed Insights
  19. 19. @badams Troubleshooting FID
  20. 20. @badams @badams Improving FID
  21. 21. @badams @badams Cumulative Layout Shift
  22. 22. @badams @badams Cumulative Layout Shift (CLS) • Does the page layout change after it’s loaded? ➢ That annoying thing when content & links move around after you’ve started reading the page • Reported scores are indicative of amount and severity of layout changes
  23. 23. @badams @badams Common Causes of CLS • Advertising that loads after the page is rendered • Embedded elements like videos, tweets, etc. • Images that don’t have proper size attributes
  24. 24. @badams Troubleshooting CLS • Measure it with PageSpeed Insights
  25. 25. @badams Troubleshooting CLS
  26. 26. @badams @badams Improving CLS • Provide size attributes for all elements on a page; ➢ Including images, video embeds, iframes, ad blocks, etc. • When using non-standard fonts, ensure these don’t cause page layout shifts • Don’t load new content above existing visible content; ➢ For example a big banner image that causes text to shift downward on a page
  27. 27. @badams
  28. 28. @badams
  29. 29. @badams @badams Summarised…
  30. 30. @badams @badams Core Web Vitals • Google to use Page Experience as a ranking factor; ➢ Coming in 2021… • Core Web Vitals are a part of Page Experience; ➢ Specific focus on speed & interaction signals • Improve your Core Web Vitals; ➢ Not just good for SEO – good for your audience as well
  31. 31. @badams @badams ThankYou! barry@polemicdigital.com @badams

×