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

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

core web vitals

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

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

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

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

Core Web Vitals signals

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 คืออะไร

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

Largest Content Paint Result

1. Largest Content Paint (LCP)

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

First Input Delay Result

2. First Input Delay (FID)

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

Cumulative Layout Shift Result

3. Cumulative Layout Shift (CLS)

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

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

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

pagespeed test core web vitals
mobile
pagespeed test core web vitals
desktop
Core Web Vitals คืออะไร

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

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

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

pagespeed insights

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

google search console
Core Web Vitals จะบอกข้อผิดพลาด

วิธีปรับปรุงคะแนน 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 (ฟรี)
imagfy
ใช้แล้วภาพเบาสุดๆ
  • เอาไฟล์วีดีโอที่ใหญ่ๆ ออก (แนะนำให้แปะลิงก์ 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