Core Web Vitals คืออะไร
เป็นตัวชี้วัด 3 ตัวที่ Google ใช้ดูว่าคนใช้เว็บจริง ๆ แล้วรู้สึกยังไง ตั้งแต่ปี 2024 ตัวที่วัดการตอบสนองเปลี่ยนจาก FID เป็น INP ซึ่งวัดทุกครั้งที่ผู้ใช้กด ไม่ใช่แค่ครั้งแรก เลยมีเว็บสอบไม่ผ่านมากขึ้น
| ตัววัด | วัดอะไร | ดี | แย่ |
|---|---|---|---|
| LCP | นานแค่ไหนกว่าเนื้อหาหลัก เช่น รูปใหญ่ หรือหัวข้อ จะขึ้นครบ | ≤ 2.5 วินาที | > 4 วินาที |
| INP | กดปุ่มแล้วหน้าจอตอบสนองไวแค่ไหน | ≤ 200 มิลลิวินาที | > 500 มิลลิวินาที |
| CLS | หน้าเว็บกระโดดไปมาระหว่างโหลดมากแค่ไหน | ≤ 0.1 | > 0.25 |
Google ดูที่ผู้เข้าชม 75% ของทั้งหมด หมายความว่าต้องมีผู้เข้าชมอย่างน้อย 3 ใน 4 ที่ได้ค่า "ดี" ทั้ง 3 ตัว ถึงจะนับว่าผ่าน
วัดเว็บตัวเองฟรี
- เข้า PageSpeed Insights ของ Google แล้ววางลิงก์เว็บ
- ดูส่วนบนก่อน ถ้ามีข้อมูลจากผู้ใช้จริง จะบอกว่าผ่านหรือไม่ผ่าน
- ถ้าเว็บยังมีคนเข้าน้อย จะเห็นแค่ผลทดสอบจำลอง ใช้ดูทิศทางได้ แต่ไม่ใช่คะแนนจริงที่ Google ใช้
- ทดสอบแบบมือถือเป็นหลัก เพราะลูกค้าส่วนใหญ่ใช้มือถือ
สาเหตุที่เว็บร้านค้าช้าบ่อยที่สุด
รูปใหญ่เกินจำเป็น ทำให้ LCP แย่
แบบที่ควรเลี่ยงอัปโหลดรูปจากกล้องขนาด 4000 พิกเซล ไฟล์ 5 MB แต่แสดงจริงแค่กว้าง 800 พิกเซล
แบบที่ควรทำย่อรูปให้พอดีขนาดที่แสดง ใช้ WebP หรือ AVIF และกำหนดให้รูปแรกของหน้าโหลดก่อน
ปลั๊กอินและสคริปต์เยอะเกิน ทำให้ INP แย่
แบบที่ควรเลี่ยงติดตั้งปลั๊กอินแชท ป๊อปอัป สไลด์ และตัวนับยอดวิว รวมกันสิบกว่าตัว
แบบที่ควรทำเก็บเฉพาะที่ใช้จริง และให้สคริปต์ที่ไม่จำเป็นโหลดทีหลัง
ไม่จองพื้นที่ให้รูปและโฆษณา ทำให้ CLS แย่
แบบที่ควรเลี่ยงข้อความขึ้นก่อน แล้วโดนรูปที่โหลดตามมาดันลง จนลูกค้ากดผิดปุ่ม
แบบที่ควรทำกำหนดความกว้างและความสูงของรูปไว้ในโค้ด ให้เบราว์เซอร์จองพื้นที่ไว้ก่อน
เว็บ 3D จะช้าไหม
ไม่จำเป็นต้องช้า ถ้าบีบไฟล์โมเดลให้เล็ก โหลดโมเดลหลังจากเนื้อหาหลักขึ้นแล้ว และมีรูปนิ่งแสดงแทนบนมือถือรุ่นเก่า เดโม 3D ทุกชิ้นใน ผลงานของ webpang ใช้หลักนี้
อยากให้เราดูเว็บของคุณ
ส่งลิงก์เว็บมาให้ webpang ตรวจฟรี เราจะบอกว่าตรงไหนควรแก้ก่อน พร้อมราคา ตอบกลับภายใน 24 ชั่วโมง
แหล่งข้อมูล
