Core Web Vitals คืออะไร?​ เช็กคะแนน & ปรับเว็บให้ดี (ฟรี)

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

Core Web Vitals คืออะไร?​

โดยจะจริงจังถึงขนาดอาจจะมีป้าย Label บน SERPs เลยว่าเว็บไหนผ่าน Core Web Vitals และเว็บไหนไม่ผ่านค่ะ ทาง Google จะเริ่ม Core Web Vitals ใช้อย่างเป็นทางการพฤษภาคม 2021 ดังนั้นสำหรับการทำ SEO แล้ว ตัว Core Web Vitals เป็นเรื่องที่เราไม่สนใจไม่ได้เลยค่ะ

ตัว Core Web Vitals นี้ประกอบไปด้วยสามปัจจัยย่อยก็คือ largest contentful paint, first input delay และ cumulative layout shift ค่ะ เดี๋ยวมาดูกันว่าแต่ละตัวหมายถึงอะไรบ้าง

Largest Contentful Paint (LCP) คืออะไร?

Cumulative Layout Shift (CLS) คืออะไร?

จากตัวอย่างด้านล่างจะเห็นว่าหน้าหลักของเมมีรูป แต่ตอนแรกไม่โหลด มันเลยขึ้นตัวหนังสือมา เสร็จแล้วพอรูปขึ้น มันดันตัวหนังสือลงไป ถ้าจ้องอยู่จะเห็นหน้าเว็บขยับค่อนข้างเยอะ คะแนน CLS เลยไม่ดี ถึงคะแนน Speed Score รวมๆ จะดีก็ตามค่ะ

First Input Delay (FID) คืออะไร?

วิธีการเช็ก Core Web Vitals ของตัวเอง

ดูคะแนน Core Web Vitals ด้วย Google PageSpeed Insights

วิธีการอ่านข้อมูลบน Google PageSpeed Insights

ส่วนด้านล่างที่มีคะแนน จะเห็นได้ว่าคะแนน Core Web Vitals จะมีป้ายสีน้ำเงินแปะอยู่ค่ะ ซึ่งคะแนนทั้งหมดนี้ไม่ต้องถึงขนาดเขียวหมดก็ได้ แต่ถ้าเป็นสีแดงคือต้องเริ่มดำเนินการแก้ไขแล้วค่ะ

ถ้าเว็บไซต์ที่มีข้อมูลเยอะๆ จะเห็นได้ว่าหลังจากการทดสอบ จะมีคะแนนขึ้นมาสามช่องตามนี้ค่ะ

  • Field Data คือข้อมูลจากผู้ใช้งานจริงของหน้าที่เรากำลังเทส ที่ Google เก็บข้อมูลเอาไว้ย้อนหลัง 28 วัน ตัวนี้จะมีข้อมูล Core Web Vitals ครบทั้งสามตัว แต่ว่าข้อมูลอื่นๆ จะน้อยกว่า Lab Data ค่ะ
  • Origin Summary คือข้อมูลของเว็บไซต์จากการใช้งานจริงย้อนหลัง เหมือนกับ Field Data แต่เป็นข้อมูลของทั้งเว็บ รวมทุกหน้า
  • Lab Data คือการทดสอบใน controlled environment เหมือนห้องแลปที่ Google สร้างขึ้นมา ใช้ Debug ได้ ทดสอบผลได้เร็ว เพราะถ้าเราปรับเว็บตรงไหน ก็จะเห็นผลได้ทันที ไม่ต้องรอข้อมูลอีก 28 วันค่ะ ดังนั้นสามารถใช้คะแนนอันนี้เป็นหลักได้ แต่จะไม่มีข้อมูล First Input Delay (FID) ค่ะ

ดูคะแนน Core Web Vitals ด้วย Google Search Console

ถ้าใครติดตั้งไว้อยู่แล้ว ให้ไปที่ Search Console แล้วหาเมนู Core Web Vitals ทางซ้ายมือนะคะ พอกดเสร็จแล้ว จะมีข้อมูลของเว็บเราขึ้นมาทั้ง Mobile และ Desktop ให้เราโฟกัสที่ Mobile เป็นหลักค่ะ ตรงนี้คือไม่ต้องเขียวก็ได้ แค่อย่าแดงก็พอนะคะ ถ้าเราอยากรู้ข้อมูลเพิ่ม ก็ให้เกิด Open Report ทางด้านบนขวามือ แล้วก็จะมีรายงานอย่างละเอียดว่าแต่ละ URL ของเรามีปัญหาตรงไหนบ้างค่ะ ตัวนี้จะดูได้ทุกหน้าพร้อมกันเลย ไม่ต้องไล่เช็กทีละหน้าค่ะ

วิธีการปรับเว็บไซต์ให้คะแนน Core Web Vitals ดีขึ้น

  • เอาโค้ดที่ไม่จำเป็นออก ทำได้ง่ายๆ ด้วยการไป Deactivate/Delete Plugins บน WordPress ที่เราไม่ได้ใช้ค่ะ
  • เลือก Host ที่ดี เลือกโฮสที่โหลดเร็ว มีชัยไปกว่าครึ่งค่ะ
  • Lazy Load การตั้ง Lazy Load คือการทำให้รูปโหลดขึ้นมาเมื่อต้องใช้เท่านั้น แล้วมันจะค่อยๆ โหลดขึ้นมาจนสมบูรณ์เองค่ะ อันนี้สามารถใช้ Plugin ช่วยได้ เช่น Shortpixel หรือ WP Rocket ค่ะ
  • เอาคอนเทนต์ที่ขนาดใหญ่มากๆ ออก เช่นวิดีโอ หรือรูปภาพที่หนักๆ
  • ลดขนาด (Compress) รูปภาพก่อนลง ตัวนี้เมใช้ Plugin Imagify อยู่ค่ะ แต่ถึงจะไม่ได้ใช้ WordPress ก็สามารถเอารูปไปลดขนาดในเว็บนี้ แล้วค่อยเอาไปใช้งานต่อได้ค่ะ
  • Minify your CSS/Javascript ตัวนี้เมใช้ปลั๊กอิน WP Rocket ทำค่ะ ถ้ายังไงอาจจะลองปรึกษาโปรแกรมเมอร์ให้ช่วยดูได้นะคะ
  • ใช้ Cache การเก็บแคชคือเก็บข้อมูลการใช้งานเว็บเอาไว้ ถ้าคนเคยเข้าแล้วมาใหม่ก็ไม่ต้องโหลดใหม่อีกค่ะ ปลั๊กอินที่ช่วยในการ Cache มีเยอะมากๆ WP Rocket ก็ได้ หรือจะใช้ LiteSpeed Cache หรือ W3 Total Cache ก็นิยมใช้กันค่ะ
  • กำหนด attribute dimensions ไว้เลย การทำแบบนี้จะช่วยให้หน้าจอไม่เลื่อนไปมา เพราะรู้อยู่แล้วว่าต้องเก็บพื้นที่ให้กับรูปภาพขนาดเท่าไหร่ค่ะ

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

ใครอยากเรียน SEO เพิ่มเติม ตอนนี้เมมีคอร์สอยู่ ดูรายละเอียดเพิ่มเติมได้ที่นี่ หรือติดตามกันได้ใน Facebook นะคะ

Foodie. Product Owner. Writer. Digital Nomad. https://chalakornberg.com/

Foodie. Product Owner. Writer. Digital Nomad. https://chalakornberg.com/