Optimizing Core Web Vitals - How to Speed Up Your WordPress Site (Using Gutenberg)
ฝัง
- เผยแพร่เมื่อ 30 ก.ค. 2024
- In this video, you'll learn how to optimize Google's Core Web Vitals and speed up your WordPress site using Gutenberg for your Largest Contentful Paint, First Input Delay, and Cumulative Layout shift scores in Google PageSpeed Insights which will lead to a Google ranking boost.
If you have a slow WordPress site and are struggling with how to speed up your Core Web Vitals scores, then this tutorial will run you through several WordPress speed optimization tips that will take your painfully slow WordPress site to scores of 100 in both the desktop and mobile tab in Google PageSpeed Insights.
Also, you'll learn what things you should use GTMetrix for to test your WordPress page speed and where to be careful as GTMetrix generally uses an outdated Google Lighthouse version.
TABLE OF CONTENTS
0:00 Intro
0:59 Core Web Vitals Overview
2:46 What is Largest Contentful Paint?
3:22 What is First Input Delay?
4:07 What is Cumulative Layout Shift?
6:45 My CWV Journey
9:59 Google PageSpeed Insights
12:09 Find Largest Contentful Paint
13:03 Be Careful With GTMetrix
14:58 Mobile-First Indexing
15:41 Google DevTools
16:45 Find CLS Problem Elements
17:16 Where People Go Wrong
18:12 Optimizing Core Web Vitals Overview
19:02 Use High-Performance Hosting
20:38 Use a Lightweight Theme
22:00 Kadence Blocks
22:40 Use Gutenberg for Page Building
23:47 Gutenberg vs Elementor Intro
24:17 Kadence Starter Template Demo
25:42 Elementor Page Speed Test (Kadence)
27:50 Gutenberg Page Speed Test (Kadence)
30:03 Gutenberg Speed Optimizations
31:15 Kadence Blocks Speed Optimization
32:30 Use a Proper Caching Plugin
33:57 Caching Plugin Settings
35:10 Front-End Optimizations
37:23 Optimize Google Fonts
38:35 Optimize Largest Contentful Paint
39:47 Optimize Images
42:14 Lazy-Load Media
43:03 Free WP Speed Mastery Course
44:07 Exclusive Kadence Discount
44:28 Outro
**************************
LINKS:
🖥 Recommended Hosting: startblogging101.com/hosting/
☁️ Cloudways - Fastest hosting and easiest to pass Core Web Vitals - Use Vultr HF server: startblogging101.com/cloudways
📈 FREE 7 Days to WordPress Speed Mastery Email Course: startblogging101.com/wordpres...
Kadence Discount Code: 10% OFF any product using code SB10OFF
✅ Kadence Suite (Kadence Membership): Includes Kadence Theme Pro + Kadence Blocks Pro + Kadence Cloud + Membership-Only Starter Templates and much more: startblogging101.com/kadence-... (10% OFF Use Code SB10OFF)
✅ Kadence Theme Pro: startblogging101.com/kadence-pro (10% OFF Use Code SB10OFF)
✅ Kadence Blocks Pro: startblogging101.com/kadence-... (10% OFF Use Code SB10OFF)
✅ Free Kadence Theme download: startblogging101.com/kadence
I’d love it if you joined my completely free Start Blogging 101 Community Facebook Group which is a group of rockstar individuals who are passionate about building fast, profitable WordPress sites with Gutenberg. Come join and say hi!
👋 Start Blogging 101 Facebook Community: / startblogging101
👉 Start Blogging 101 Facebook Page: / startblogging101
**************************
First, I'll talk about what each of the three Core Web Vitals is: Largest Contentful Paint, First Input Delay (which can be interchanged with Total Blocking Time), and Cumulative Layout Shift.
Then, I'll go over my Core Web Vitals journey from a very slow blog that had an average page load time of 17 SECONDS to a blog that now passes all of the Core Web Vitals on both the desktop and mobile tabs in Google PageSpeed Insights.
I'll talk about where I see a lot of people go wrong when figuring out how to speed up their WordPress site (hint: you don't need 7 or 8 caching or optimization plugins).
Next, I'll talk about 4 core changes you can make to automatically speed up your WordPress site and pass Core Web Vitals:
1. Use high-performance WordPress hosting
2. Use a lightweight, Gutenberg-ready WordPress theme
3. Use Gutenberg (the built-in WordPress editor) to build your pages
4. Use a proper caching plugin
Lastly, I'll talk about front-end optimizations you can enable using a caching plugin to speed up your WordPress website and specific tips and tricks on how to optimize images and fonts.
With this whole speed optimization package, you're sure to pass Core Web Vitals and get that precious Google ranking boost!
**************************
My channel is supported by my viewers. If you purchase through a link in my description, I may earn a commission which allows me to continue providing tutorials and content for all of you. I appreciate all your support!
#corewebvitals #gutenberg #pagespeed
Thanks for sharing tons of value
Glad it was helpful!
This is a great video that will help answer a lot of questions for those of us who are not speed experts. Clearly presented with no wasted time. Thank you.
That's what I was going for! I appreciate the comment :)
Great video. Thank you!
Thanks for watching!
Great video... one of the best I've watched on this topic. 10/10
Oh man, 10/10? I'll take that rating all day :) Thanks for the compliment!
Gret video! Thank you Sir! I have a question regarding Cloudways - which server you use: 2 Gb Ram , 1 Core or 4Gb Ram, 2 Core or better? I use 2 Gb, 1 Core and thinking maybe I need better but not sure if it worth $20 extra
Hey Igor! You're very welcome! As for Cloudways, I currently use 2 GB RAM, 1 Core and that's plenty for me for now. Are you running into any CPU warnings or anything? If not, you should be fine for now. But sites with a ton of visitors or a resource-intensive site such as a heavy WooCommerce site would benefit from 4 GB RAM, 2 cores.
Here's my Cloudways referral link as well: startblogging101.com/cloudways
Any tips on passing core web vitals with Ezoic ads?
Great video. Would using Kadence blocks with Gutenberg hurt speed for Google ranking?
Hey there! Glad you enjoyed the video. No, using Kadence Blocks with Gutenberg isn't going to hurt your speed for Google ranking. Kadence Blocks all load conditionally meaning that if you don't use the block on your page, none of the code is loaded for that block at all. And their blocks are extremely lightweight compared to page builders so if you switch away from a third-party page builder to building your pages in Kadence Blocks, you should see an instant speed boost.
@@StartBlogging101 thank you for the information. I really appreciate that you responded. One more last question; would adding the Kadence theme affect the speed of should I just stick to Kadence blocks and Gutenberg? I'll be migrating away from elementor and so many plugins and a heavy theme. I'm sure anything is going to be faster but I respect your opinion as someone who is more experienced. Thank you again!
Unfortunately I don't have a sigrid so it didn't help me much