200 มิลลิวินาทีเสียงเร็ว? การโต้ตอบกับ Paint ถัดไปสามารถช่วยเพิ่มการตอบสนองของเว็บไซต์ของคุณได้

เผยแพร่แล้ว: 2022-07-17
200 Milliseconds Sound Fast? Interaction To Next Paint Can Help Boost the Responsiveness Of Your Website

อาจออกไปพร้อมกับเสียงคำราม เดือนอะไร. Google Core Update, เมตริกผู้ใช้ Web Vitals ใหม่สองตัว และ WordPress 6.0!

เมื่อวันที่ 25 พฤษภาคม Google ได้ประกาศเปิดตัว Core Update ในวงกว้าง การอัปเดตหลักในเดือนพฤษภาคม 2565 คาดว่าจะใช้เวลาสองสัปดาห์ ผู้คนรายงานการเปลี่ยนแปลงในหน้าผลการค้นหา คุณสังเกตเห็นการเปลี่ยนแปลงใน SERP ของคุณหรือไม่?

WordPress 6.0 ซึ่งเป็น WordPress รุ่นใหญ่อันดับสองของปี 2022 ก็เปิดตัวเช่นกัน WordPress 5.9 เปิดตัวในเดือนมกราคม 2022 ได้แนะนำการแก้ไขเว็บไซต์แบบสมบูรณ์ (FSE) สำหรับตัวแก้ไขบล็อก ด้วย WordPress 6.0 โฟกัสอยู่ที่การขยายและปรับปรุงฟังก์ชันของ Block Editor อีกครั้ง เว็บไซต์ของลูกค้าของคุณทั้งหมดได้รับการอัพเดตเป็น WordPress 6.0 หรือไม่?

อัพเดททุกที่! เกิดอะไรขึ้นที่สำคัญสำหรับเว็บไซต์ของฉัน

การเปลี่ยนแปลงครั้งใหญ่ของ Google ในเดือนพฤษภาคมคือการเพิ่ม Time to First Byte (TTFB) และ Interaction to Next Paint (INP) ให้กับเมตริก Web Vitals การเพิ่มเมตริกใหม่เป็นวิธีพูดของ Google ว่า "ให้ความสำคัญกับสิ่งที่สำคัญ"

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

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

Core Web Vitals เติบโตขึ้น! pagespeed.web.dev เพิ่งได้รับการอัปเกรด ตอนนี้ RUM rata รวม Interaction to Next Paint (INP) และ Time to first Byte (TTFB) ทั้งสองทางเลือกที่ดีถ้าคุณถามฉัน! ในความคิดของฉัน INP เป็นวิธีที่ดีกว่าในการวัดการตอบสนองมากกว่า First Input Delay ซึ่งสามารถจัดการได้อย่างง่ายดาย Time To First Byte ควรมีความสำคัญมากกว่าเสมอ เพราะมันมาก่อนประสิทธิภาพการทำงานใดๆ ไม่ตอบสนอง = ไม่ทาสี ไม่มีการโต้ตอบ ฯลฯ!

Arjen Karel

Interaction to Next Paint (INP) คืออะไรและเหตุใดจึงสำคัญ

นอกจาก Google Core Web Vitals แล้ว Google ยังวัดจำนวนที่เพิ่มขึ้นของเมตริกการตอบสนองที่เน้นผู้ใช้เป็นศูนย์กลาง ซึ่งรวมถึง Interaction to Next Paint (INP) และ Time to First Byte (TTFB) อย่างไรก็ตาม ก่อนที่คุณจะปรับแต่งทีมของคุณ Google จะพูดว่า:

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

Google.com

การโต้ตอบกับ Next Paint (INP) เป็นตัวชี้วัดใหม่ที่มีจุดมุ่งหมายเพื่อแสดงเวลาแฝงของการโต้ตอบโดยรวมของหน้าโดยการเลือกการโต้ตอบที่ยาวที่สุดรายการใดรายการหนึ่งเมื่อผู้ใช้เข้าชมหน้า INP มักเป็นเปอร์เซ็นไทล์ที่ 98 ของเวลาในการตอบสนองของการโต้ตอบสำหรับหน้าเว็บที่มีการโต้ตอบจำนวนมาก สำหรับเพจที่มีการโต้ตอบน้อยกว่า 50 รายการ INP เป็นการโต้ตอบที่มีเวลาแฝงที่แย่ที่สุด

มีองค์ประกอบ UI มากมาย KeyDown เกิดขึ้นเมื่อกดปุ่ม KeyUp เกิดขึ้นเมื่อปล่อยคีย์ มี DragOver, Drop, OnFocus และอีกมากมาย การโต้ตอบแต่ละครั้งจะถูกกำหนด ประมวลผล และผลลัพธ์ที่แสดงต่อผู้ใช้

เวลาระหว่างทุกการกระทำสามารถวัดได้ และ ช่วงเวลาที่ยาวนานระหว่างการคลิกและการรับสามารถเพิ่มประสบการณ์ผู้ใช้ที่ไม่ดี ได้

การโต้ตอบกับ Next Paint (INP) จะวัดเวลาแฝงของการโต้ตอบกับเว็บไซต์ของเรา ตัวอย่างบางส่วนของการโต้ตอบเหล่านี้ ได้แก่:

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

เว็บไซต์ของคุณมีการโต้ตอบมากมายหรือไม่? คุณใช้แพลตฟอร์มอีคอมเมิร์ซหรืออีเลิร์นนิงหรือไม่? เนื่องจากคุณรู้ว่าผู้ใช้จะ ไม่ ต้องการรอสำหรับเหตุการณ์เมาส์นั้น INP นั้นค่อนข้างน่าตื่นเต้น

ตอนนี้ คุณสามารถดูได้ว่าการโต้ตอบใดที่ทำให้คุณช้าลง และอาจเห็นที่ที่คุณอาจสูญเสีย Conversion ผ่านเวลาตอบสนองที่ช้า

ไซต์อีคอมเมิร์ซของคุณสูญเสียเงินไปเท่าไหร่เนื่องจากเวลาแฝง ประสิทธิภาพต่ำ และพูดตามตรงว่าโฮสต์ WordPress ที่ได้รับการจัดการซึ่งมีเทคโนโลยีที่ล้าสมัยสำหรับความคาดหวังของลูกค้าในปัจจุบัน

Rocket.net

ฉันจะวัดการโต้ตอบของ Google กับตัวชี้วัด Paint ถัดไปได้อย่างไร

หากต้องการวัดการโต้ตอบของ Google กับ Next Paint ให้ไปที่ PageSpeed ​​Insights เพื่อวัด INP ของหน้าเว็บของคุณ จดจำ. คุณกำลังวัดผลหน้านั้น ไม่ใช่ทั้งเว็บไซต์ของคุณ

INP คล้ายกับ Cumulative Layout Shift (CLS) โดยที่ค่าการวัดจะเปลี่ยนเมื่อผู้ใช้ยังคงอยู่บนหน้าเว็บของคุณ เมื่อผู้ใช้ออกจากหน้าแล้ว การวัดจะถูกสร้างขึ้นโดยสร้างค่า INP โดยรวม บางหน้าจะมีการโต้ตอบมากกว่าหน้าอื่นๆ การโต้ตอบของบางหน้าอาจไม่เกิดขึ้นหากไม่มีการเลือกการกระทำ

เพียงเพราะคุณผ่าน Vitals ตอนนี้ไม่ได้หมายความว่าคุณจะผ่านในเดือนหน้า Core Web Vitals กำลังอยู่ในช่วงทดลองและเปลี่ยนแปลง กลับมาตรวจสอบอย่างสม่ำเสมอและยังคงสงสัยอยู่!

เว็บไซต์ที่ตอบสนองหมายถึงมากกว่าบล็อกที่ยืดหยุ่นใน CSS ของคุณ

การวัดการโต้ตอบกับ Next Paint ค่อนข้างน่าตื่นเต้นเพราะตอนนี้เราสามารถวัดว่าเว็บไซต์ของเราตอบสนองได้ดีเพียงใดภายใต้มือของผู้ใช้ของเรา จำได้ไหมว่าเมื่อเว็บไซต์ตอบสนองหมายถึงเมนูของเรายุบเป็นแฮมเบอร์เกอร์?

และไม่ใช่แค่มือถือเท่านั้นที่มีความสำคัญ การดูเดสก์ท็อปมีความสำคัญเช่นกัน โดยเฉพาะอย่างยิ่งถ้าเรากำลังพูดถึงเว็บไซต์เหล่านั้นที่ผู้คนใช้เวลามากกว่า

การโต้ตอบกับ Next Paint หมายถึงการวัดเวลาที่ใช้สำหรับองค์ประกอบบนหน้าเพื่อตอบสนองต่อการโต้ตอบ ตอนนี้ เราสามารถเห็นได้ว่ารูปภาพผลิตภัณฑ์ต้องใช้เวลานานเท่าใดในการเปลี่ยน หากผู้ใช้เลือกสีอื่นหรือคำตอบนั้นใช้เวลาเท่าใดจึงจะปรากฏบนหน้าจอ ความเร็วที่นี่อาจเป็นเรื่องน่าพิศวงสำหรับผู้ใช้หลายคน จำไว้ - ความเร็วชนะ

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

ความเร็วมีความสำคัญมากในเว็บไซต์เพราะคุณต้องการดึงดูดและรักษาผู้มีโอกาสเป็นลูกค้าไว้ และคุณต้องการให้พวกเขาบอกเพื่อนของพวกเขา สิ่งที่ทำให้ผู้คนไม่อยู่ในเว็บไซต์ของคุณ – และทำให้เกิด Conversion – คือประสบการณ์เว็บไซต์ที่ไม่ดี

Rocket.net

Microinteractions เป็นความแตกต่างระหว่างเว็บไซต์ที่ดีกับเว็บไซต์ที่ยอดเยี่ยม

บันทึกเวลาแฝงของการโต้ตอบ กำจัดการโต้ตอบคุณพูด?

Microinteractions เป็นสิ่งเล็ก ๆ ที่ทำให้ผู้ใช้ของเรารู้สึกว่าสามารถทำอะไรบางอย่างได้ เป็นความรู้สึกที่ไม่ได้เป็นผู้เข้าร่วมที่แข็งกร้าวและไม่สำคัญอีกต่อไป แต่สามารถเคลื่อนไหว พูด หรือเปลี่ยนแปลงบางสิ่งได้โดยใช้ความพยายามเพียงเล็กน้อย ผู้ใช้มีส่วนร่วมอย่างสนุกสนานโดยไม่มีอะไรซับซ้อน Gamification ใช่ไหม?

ไมโครอินเทอร์แอกชันสร้างความแตกต่างให้กับประสบการณ์ออนไลน์ของเรา ดังนั้นอย่าทิ้งทารกด้วยน้ำอาบเพียงเพื่อประหยัดการทำความสะอาดอ่างอาบน้ำ

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

UsabilityGeek.com

พูดคุยราคาถูก ให้ Rocket แสดงให้คุณเห็นว่าโฮสติ้ง WordPress ที่เร็วที่สุดหมายถึงอะไร!

ประหยัดประสิทธิภาพไซต์ เวลา และเงินของเอเจนซีของคุณใช่หรือไม่ ใช่. แพลตฟอร์ม Rocket มีคุณสมบัติในตัวที่ขจัดความต้องการของคุณสำหรับการรักษาความปลอดภัยเวอร์ชันอื่น การเพิ่มประสิทธิภาพรูปภาพ ปลั๊กอินโหลดเนื้อหา CDN และ JS เป็นคุณสมบัติที่สร้างขึ้นในแพลตฟอร์มใหม่ที่คุณชื่นชอบ (ผลิตภัณฑ์เดิมชื่อ Managed WordPress Hosting)

มาพูดถึงวิธีที่เราสามารถย้ายไซต์ของคุณไปยัง Rocket.net ซึ่งเป็นโฮสติ้ง WordPress ที่เร็วที่สุดที่มีอยู่ได้ทุกที่ เปิดตัวภารกิจของคุณวันนี้!