Core Web Vitals คืออะไร เช็กได้ง่ายๆ พร้อมวิธีปรับแก้ไขด้วยตัวเอง

ก่อนหน้าที่ Google จะประกาศการใช้ Core Web Vitals มาเป็นปัจจัยหนึ่งในการวัดการทำ SEO หลายคนที่ทำ SEO อยู่ คงมีช่วงชีวิตที่มีความสุขมาไม่น้อย เพราะไม่ว่าจะสายขาวหรือสายไหมก็ทำอันดับได้สบายๆ

แต่หลังจากที่ดูเหมือนว่า Google เริ่มเอาจริงมากขึ้นในข้อกำหนดเงื่อนไข policy ต่างๆ ที่ต้องการคนทำเว็บไซต์เน้นสร้างประสบการณ์ใช้งานที่ดีให้แก่ผู้ใช้งาน

ก่อนหน้าที่ Google จะประกาศการใช้ Core Web Vitals มาเป็นปัจจัยหนึ่งในการวัดการทำ SEO หลายคนที่ทำ SEO อยู่ คงมีช่วงชีวิตที่มีความสุขมาไม่น้อย เพราะไม่ว่าจะสายขาว สายดำ ก็ดูจะสบายๆ แต่ช่วงนี้ดูเหมือนว่า Google เริ่มเอาจริงมากขึ้นในข้อกำหนดเงื่อนไขต่างๆ ที่เน้นสร้างประสบการณ์ให้แก่ผู้ใช้งาน

จากการปรับวิธีการคำนวนคะแนนบนเว็บไซต์ ตั้งแต่การมาของ BERT ทำให้ผู้สร้างเนื้อหา (Content) ต้องเน้นสร้างเนื้อหาที่มอบประสบการณ์ที่ดีแก่ผู้ใช้งานมากขึ้น (User Experiences)

เอาเป็นว่าต่อจากนี้ไปเรื่องความเร็วของเว็บไซต์ (Pagespeed) และปัจจัยอื่นๆ ที่จะบอกในบทความนี้ อยากให้ลองทดสอบและทำตามได้เลยเพื่อจะได้ทำให้เว็บตัวคุณเองมีประสิทธิภาพได้มากที่สุด ก่อนจะหลุดออกจากการจัดอับดับก็แล้วกันนะครับ

Core Web Vitals คืออะไร ทำไมจึงสำคัญต่อผู้ใช้

อธิบายแบบเข้าใจง่าย Core Web Vitals คือปัจจัยหนึ่งที่ Google ใช้ร่วมในการตัดสินอันดับบน Search Engine หรือ SERPs ที่เกี่ยวข้องกับประสบการณ์ของผู้ใช้งานเว็บไซต์โดยเฉพาะ

โดย Google ได้ประกาศและกำหนดใช้อย่างเป็นทางการภายในเดือนพฤษภาคม ปี 2021 ทำให้นักพัฒนาและผู้ที่เกี่ยวข้องจำเป็นต้องปรับปรุงเว็บไซต์ของตัวเองในทุกๆ ด้าน

ไม่ว่าจะเรื่องของการแสดงผล ความเร็วและโค้ดต่างๆ ที่ทำให้เกิดการบล็อคการแสดงผล ที่เป็นเหตุให้เว็บไซต์ช้าหรือประสบการณ์การเข้าใช้งานเว็บของผู้ใช้งาน (ดีไซน์หน้าตาเว็บไซต์)

ปัจจัย UX ที่เกี่ยวข้องใช้คะแนนรวมกับ Core Web Vitals

1. ระบบความปลอดภัย HTTPS
2. ความเหมาะสมกับหน้าจอมือถือ Mobile Friendliness
3. การท่องเว็บอย่างปลอดภัย Safe-Browsing
4. การมีโฆษณาคั่นแต่ละหน้า Intrusive interstitial guidelines

Core Web Vitals ใช้องค์ประกอบ 3 อย่างในการตัดสิน

1. Largest Content Paint (LCP)

การวัดเวลาในการโหลดเว็บไซต์ของเราว่ารวดเร็วแค่ไหน โดยโฟกัสไปที่เนื้อหาที่มีขนาดใหญ่ที่สุดบนเว็บไซต์ เช่น รูปภาพแบนเนอร์ขนาดใหญ่บนเว็บ โฆษณา Google Adsense ภาพถ่ายขนาดใหญ่ วีดีโอที่ต้องใช้เวลาโหลดนาน รวมถึงขนาดภาพที่ต้องกำหนดให้เหมาะสมกับทุกขนาดหน้าจอ เป็นผลทำให้คะแนน LCP ของเราต่ำ

2. First Input Delay (FID)

First Input Delay คือ การวัดความเร็วของการเข้าเว็บไซต์ โดยวัดการตอบสนองจากผู้ใช้งานที่สามารถกระทำอะไรบางอย่างบนเว็บไซต์ได้ เช่น คลิกลิงก์แล้วโหลดไปต่อเร็วแค่ไหน ปุ่มแชท ปุ่ม Call to Action ต่างๆ ช้าหรือไม่ ถ้ามีลิงก์หรือปุ่มใดที่โหลดช้า ไม่วิ่งไปยังปลายทางทำให้ผู้ใช้งานต้องคลิกซ้ำๆ

3. Cumulative Layout Shift (CLS)

Cumulative Layout Shift (LCP) คือ การวัดว่าเว็บไซต์เรามีความเคลื่อนไหวได้มากแค่ไหน กระตุกหรือไม่ เช่น เมื่อผู้ใช้งานเข้าเว็บไซต์เราแล้วกดปุ่มเมนูด้านบน หน้าเว็บเรามีการกระตุกเลื่อนลงมาสักพักหนึ่งหรือเปล่า

ผลคือทำให้ผู้ใช้งานกดปุ่มพลาดและ Google ได้ใช้ปัจจัยนี้ในการให้คะแนน เพราะการแสดงผลมันกระตุกหรือหน้าจอสั่น ผู้ใช้งานจะไม่ได้รับประสบการณ์ที่ดี (คือเข้าใช้งานลิงก์ที่ต้องการไม่ได้) ถ้าเว็บสั่นสู้มือขนาดนี้ใครจะทนไหว ก็ต้องหักคะแนนสิครับ

ตัวอย่างการวัดผลบนหน้าเว็บไซต์และเว็บเพจด้วย Pagespeed Insights

เครื่องมือตรวจเช็ก Core Web Vitals

เช็กผ่านเครื่องมือ Google Pagespeed Insights

เพียงเข้าไปที่ลิงก์นี้ : https://developers.google.com/speed/pagespeed/insights/

เช็กผ่านเครื่องมือ Google Search Console

วิธีปรับปรุงคะแนน Core Web Vitals ให้ดีขึ้น

ปกติเมื่อเราเช็กเว็บไซต์ของเราในตัว PageSpeed Insights ข้อมูลจะแสดงผลและคำอธิบายในการแก้ไขนะครับว่าต้องปรับส่วนไหน อะไรบ้าง

แต่ก็มีบางข้อที่จำเป็นต้องมีความรู้เรื่องการเขียนโค้ดครับ หรืออาจต้องหาโปรแกรมเมอร์มาช่วยในบางจุดเพื่อเพิ่มประสิทธิภาพ

การปรับปรุงเว็บไซต์ด้วยตนเอง

• การปรับภาพ เช่น การย่อไฟล์ภาพด้วยเครื่องมือต่างๆ หรือใช้ปลั๊กอินย่อรูป เช่น Shortpixel หรือแปลงแบบ Manual จากเว็บไซต์ Tinypng.com, imagify (แปลงเป็น Webp)
• การเลือกใช้ Hosting ที่มีคุณภาพ ช่วยให้โหลดเร็วขึ้นหรือใครเงินเหลือใช้ Cloud Server ก็ได้ครับ
• การใช้ CDN หรือ Content Delivery Network เช่น Google Cloud หรือ Cloud Server ต่างๆ ผมแนะนำใช้ Cloudflare (แต่เท่าที่ทดสอบเว็บไซต์ในไทยไม่ช่วยอะไรนัก แต่ช่วยเรื่องระบบความปลอดภัยมากกว่า)
• การทำ Lazy Load คือ ทำให้ภาพบนเว็บไซต์ค่อยๆ โหลดทีละภาพ ในเวลาที่เราอ่านเนื้อหาบนเว็บไซต์ ถ้าใครใช้ wordpress สามารถใช้ปลั๊กอิน Lazy Load (ฟรี)

• เอาไฟล์วีดีโอที่ใหญ่ๆ ออก (แนะนำให้แปะลิงก์ Youtube เอา) ช่วยลดการใช้ทรัพยากรบนเว็บไซต์เราได้
• ทำ Minify CSS / Javascript มีปลั๊กอินช่วยหลายตัวที่เห็นจะดีที่สุดคือ WP Rocket ดีแบบสุดๆ (แต่เสียเงิน) ผู้พัฒนาเดียวกับ Lazy Load ช่วยอุดหนุนเค้าก็ไม่เสียหายนะ
• ใช้ปลั๊กอินเก็บ Cache ตัว WP Rocket ที่แนะนำสามารถข้างต้นสามารถทำได้หมดเลยนะครับ
• ทำ Preload Links, Proload Fonts ก็ช่วยได้อีกขั้น

อย่าลืมว่าเราจำเป็นต้องทำสิ่งเหล่านี้ เพื่อให้ประสิทธิภาพเว็บไซต์และคะแนน Core Web Vitals เราดีขึ้น เพื่อช่วยให้เราสามารถติดอันดับบน Google Ranking ได้อย่างไม่ต้องกังวลใจ

สุดท้ายนี้ผมมีเครื่องมือมาฝากให้เพื่อนๆ นะครับ 4 เครื่องมือตรวจเช็กประสิทธิภาพเว็บไซต์ง่ายๆ ลองใช้งานกันดูนะครับ ง่ายและวัดผลได้ละเอียดมาก (เพื่อนำไปปรับต่อ)

สรุป : Core Web Vitals เป็นปัจจัยที่มีความสำคัญต่อการทำเว็บไซต์ เพราะมีผลกับประสบการณ์ผู้ใช้โดยตรง เพื่อนๆ ลองไปปรับกันนะ สำหรับคนที่สนใจเรียน SEO ผมมีเปิด คอร์ส SEO สำหรับผู้ประกอบการ ใครที่สนใจสอบถามได้ครับ

พี่หมีฮาร์ดเซลล์

source : searchenginejournal, google search central, web.dev