Show notes
Your own vital signs are your heart rate, temperature, breathing and blood pressure. These are used to help get an idea of your health, and give a “heads-up” that something is not as performing as it should be.
Google has come up with its own set of web vitals to give you an idea of how your website (or web app) is performing, and suggest what you might do to improve it. Katie Hempenius is part of the Chrome team at Google and works with performance and core web vitals and joins us to explain more.
We discuss what the core web vitals are (get ready for acronyms!) and give examples of what they mean in practice – where to find the measurements, plus a few suggestions as to what, as a designer, you could do to help improve your web vitals.
(Listening time: 41 minutes, transcript)
#283 Core web vitals with @katiehempenius from the Chrome team at @Google – what are they, what is @____lighthouse and how can we make use of them as designers? https://t.co/LXsFUfV8Al #ux #uxpodcast #podcast pic.twitter.com/fJd2ETUPfu
— UX Podcast (@uxpodcast) February 25, 2022
References:
- Full transcript for episode 283
- Katie Hempenius
- Twitter https://twitter.com/katiehempenius
- LinkedIn https://www.linkedin.com/in/khempenius/
- Website https://katiehempenius.com/
- Web vitals
- Cumlative Layout Shift (CLS)
- Largest Contentful Paint (LCP)
- First Input Delay (FID)
- Optimize Cumulative Layout Shift
- How to Optimize Cookie Banner for Core Web Vitals
- Best practices for cookie notices (by Katie)
- 5 ways to optimize page load time and UX in 2022
- Should I Use A Carousel
- That big sliding banner? Yeah, it’s rubbish (Post by James)
- Best practices for carousels (by Katie)
- How to avoid layout shifts caused by web fonts
- Best practices for fonts (by Katie)
- How to Simulate Slow Network Conditions to Test Your Apps — It Works on my Wi-Fi
- Lighthouse
- CSS for web vitals (by Katie and Una Kravets)
- What Is a WebP Image? A Guide for Designers
- Can I use WebP
- HTML5 picture element
- AVIF Image Format
- Speed Up Your Website With WebP
- Episode 117: Designing with Images
- Episode 57: James and Per avoid spinning
- Backstage mailing list (show notes to your inbox, plus extra stories, news and offers): Sign up here
- Enjoying UX Podcast? Contribute with your time as a volunteer, or with real cash to help keep the podcast running: Support UX Podcast