Core Web Vitals คืออะไร และธุรกิจควรใช้วัดเว็บไซต์อย่างไร
อธิบาย LCP, INP และ CLS แบบเจ้าของธุรกิจ พร้อมวิธีอ่านข้อมูลภาคสนาม แยกจากผลทดสอบในห้องแล็บ และจัดลำดับงานปรับปรุงเว็บไซต์
Core Web Vitals คือชุดตัวชี้วัดประสบการณ์ใช้งานจริงที่ช่วยตอบว่าเนื้อหาหลักปรากฏเร็วเพียงใด หน้าเว็บตอบสนองต่อการใช้งานได้เร็วแค่ไหน และ layout ขยับจนรบกวนผู้ใช้หรือไม่ ตัวเลขเหล่านี้มีประโยชน์เมื่อใช้ร่วมกับเป้าหมายธุรกิจ ไม่ใช่ใช้แทนคุณภาพเนื้อหาหรือ conversion ทั้งหมด
ตัวชี้วัดหลักสามตัวบอกอะไร
- LCP (Largest Contentful Paint) วัดเวลาที่องค์ประกอบเนื้อหาหลักใน viewport แสดงผล
- INP (Interaction to Next Paint) สะท้อนความเร็วในการตอบสนองต่อการคลิก แตะ หรือพิมพ์ตลอดช่วงที่ผู้ใช้เปิดหน้า
- CLS (Cumulative Layout Shift) วัดการขยับของ layout ที่ไม่ได้เกิดจากการกระทำของผู้ใช้
ข้อมูลภาคสนามกับผลทดสอบในห้องแล็บต่างกัน
ข้อมูลภาคสนามสะท้อนอุปกรณ์ เครือข่าย และพฤติกรรมของผู้ใช้จริงในช่วงเวลา ส่วนเครื่องมือทดสอบในห้องแล็บจำลองสภาพแวดล้อมคงที่เพื่อช่วยวิเคราะห์สาเหตุ เว็บไซต์อาจได้คะแนน Lighthouse ดี แต่ข้อมูลผู้ใช้จริงยังช้าในบางหน้า บางประเทศ หรืออุปกรณ์ระดับล่างได้ จึงควรใช้ทั้งสองแบบ
เริ่มแก้จาก template และเส้นทางที่มีผลต่อธุรกิจ
อย่าดูเฉพาะหน้าแรก จัดกลุ่มข้อมูลตาม template เช่น หน้าบริการ บทความ case study และแบบฟอร์ม แล้วให้ความสำคัญกับหน้าที่มี organic traffic, enquiry หรือรายได้สูง การแก้ component ที่ใช้ร่วมกันมักให้ผลมากกว่าปรับหน้าทีละ URL
สาเหตุที่พบบ่อยและสิ่งที่ควรตรวจ
- LCP: ภาพ hero ใหญ่เกินไป การตอบสนองจาก server ช้า CSS หรือ font ขวางการแสดงผล
- INP: JavaScript ทำงานยาว event handler หนัก หรือโหลด widget ภายนอกมากเกินจำเป็น
- CLS: ภาพไม่มีขนาดตายตัว font สลับแล้วกินพื้นที่ต่างกัน หรือ banner ถูกแทรกเหนือเนื้อหา
วัดผลหลังแก้โดยไม่หลงกับคะแนนเดียว
บันทึก baseline, วันที่ deploy, template ที่แก้ และผลกระทบต่อ conversion หรือการใช้งาน จากนั้นรอข้อมูลภาคสนามสะสมตามช่วงรายงาน คะแนน 100 ในการทดสอบหนึ่งครั้งไม่สำคัญเท่าประสบการณ์ที่เสถียรบนอุปกรณ์และเส้นทางที่ลูกค้าใช้จริง
ใช้ Core Web Vitals เป็นสัญญาณเพื่อหาปัญหาและจัดลำดับงาน ไม่ใช่เป็นเป้าหมายที่แยกขาดจากผู้ใช้และผลลัพธ์ธุรกิจ
แยก lab diagnosis จากผลของผู้ใช้จริง
| ค่า | บอกอะไร | วิธีใช้ |
|---|---|---|
| LCP | เวลาที่เนื้อหาหลักแสดง | หา TTFB ภาพหรือฟอนต์ที่บล็อกการแสดง |
| CLS | การขยับเลย์เอาต์ที่ไม่คาดหมาย | จองพื้นที่ภาพ ฟอนต์และ widget |
| INP | ความหน่วงของ interaction | ตรวจ event handlers และ long tasks ใน flow จริง |
| TBT ใน Lighthouse | งานที่บล็อก main thread ช่วงโหลดใน lab | ใช้วินิจฉัย ไม่อ้างว่าเป็น INP field |
เป้าหมาย good ของ Core Web Vitals คือ LCP ไม่เกิน 2.5 วินาที INP ไม่เกิน 200ms และ CLS ไม่เกิน 0.1 ที่ percentile 75 ของผู้ใช้แยกอุปกรณ์ ผล local ที่ไม่มี CDN scripts กับ production ที่มี scripts เหล่านั้นมีเงื่อนไขต่างกัน จึงแยกเพื่อหาต้นเหตุแทนกล่าวว่าคะแนน local คือประสบการณ์ของผู้ใช้ทั้งหมด
รักษาภาพและ motion ด้วยการลดงานที่ไม่จำเป็น
ส่งภาพตามขนาดที่แสดงและ DPR กำหนด dimensions เลือก eager เฉพาะภาพที่เห็นก่อนและพัก animation เมื่อออกจาก viewport ฟอนต์ที่ใช้ใน H1 อาจ preload ได้ แต่การ preload ทุกน้ำหนักอาจแย่งทรัพยากร ลด hydration ของส่วนที่เป็นเนื้อหาคงที่ แล้วทดสอบว่างานที่ผู้ใช้กดจริงยังเร็วและเข้าถึงได้
เชื่อมผลทดสอบกับหน้าที่สร้างผู้ติดต่อ
| หน้า | ขั้นตอนที่ควรตรวจ |
|---|---|
| บริการ | อ่านข้อเสนอ ดูผลงาน และคลิก LINE บนมือถือ |
| ผลงาน | โหลดภาพที่เห็นก่อนและเปิดภาพรายละเอียดได้ |
| บทความ | อ่านเนื้อหา เปิดสารบัญและไปบริการที่เกี่ยวข้อง |
| ติดต่อ | เลือกช่องทางและเห็นสถานะฟอร์มตามจริง |
เก็บผลก่อนและหลังด้วยอุปกรณ์และเงื่อนไขเดียวกัน แล้วติดตามข้อมูลภาคสนามเมื่อมีจำนวนผู้ใช้เพียงพอ ผล Lighthouse หรือ TBT ใช้วินิจฉัยในห้องแล็บ ส่วน INP ต้องดูจากการโต้ตอบของผู้ใช้จริง
อ่านวิธีวัด SEO ถึงผู้คุยงานผ่าน LINE →

