Farfetch ผู้ค้าปลีกสุดหรูได้รับอัตรา Conversion สูงขึ้นสำหรับ Core Web Vitals ที่ดีขึ้น

ผู้ค้าปลีกด้านแฟชั่นอีคอมเมิร์ซเชื่อมโยง Core Web Vitals และเมตริกประสิทธิภาพกับเมตริกธุรกิจได้อย่างไร ได้รับ KPI เพิ่มขึ้นและสร้าง "เครื่องคำนวณกรณีทางธุรกิจด้านประสิทธิภาพ" เพื่อกระตุ้นการตัดสินใจเกี่ยวกับผลิตภัณฑ์และวัฒนธรรมด้านประสิทธิภาพ

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

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

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

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

Farfetch ตระหนักว่าแผนกเดียวไม่สามารถบรรลุเป้าหมายนี้ได้เหมือนแต่ก่อน จึงรวบรวมทีมผู้เชี่ยวชาญหลักจากหลากหลายฝ่ายในบริษัท ไม่ว่าจะเป็นวิศวกร โครงสร้างพื้นฐาน สถาปัตยกรรม และผลิตภัณฑ์ ซึ่งจะวางกลยุทธ์ทีละขั้นตอนเพื่อปรับปรุงมุมมองของบริษัทในแนวทางนี้

ขั้นตอนที่ 1: การกำหนด การวัด และตรวจสอบเมตริก

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

บริษัทใช้ทั้งข้อมูลห้องทดลองและการตรวจสอบผู้ใช้จริง (ข้อมูลภาคสนาม) เพื่อติดตาม Core Web Vitals และเมตริกประสิทธิภาพที่เน้นผู้ใช้เป็นหลักเพิ่มเติมเพื่อวิเคราะห์สถานะปัจจุบันของประสิทธิภาพความเร็ว พวกเขาใช้ JavaScript และไลบรารี web-vitals.js เพื่อบันทึกข้อมูล ซึ่งทำให้ทีมวิเคราะห์ผลิตภัณฑ์มองเห็นเมตริกประสิทธิภาพควบคู่ไปกับเมตริกธุรกิจในเซสชันเดียวกัน และเริ่มตรวจสอบผลกระทบที่มีต่อกันและกันได้

กลุ่มสหวิทยาการกำหนดขึ้นเพื่อทำความเข้าใจว่าเมตริกใดมีความสำคัญต่อธุรกิจมากที่สุด โดยได้ศึกษาเส้นทางที่สำคัญของผู้ใช้ Farfetch และพยายามลิงก์เส้นทางนั้นกับเครื่องหมายประสิทธิภาพ นอกจากเมตริก Core Web Vitals ที่ Google ได้อธิบายไว้ ซึ่งแต่ละรายการแสดงถึงแง่มุมที่แตกต่างกันของประสบการณ์ของผู้ใช้ องค์กรยังใช้ JavaScript ที่กําหนดเองเพื่อติดตาม Time to First Byte (TTFB), First Contentful Paint (FCP), First Paint และ Time to Interactive (TTI)

ระบบจะรวบรวมเมตริกโดยใช้ Performance API, Long Tasks API และ Polyfill ของ Google ได้หลายวิธี ดูรายละเอียดเพิ่มเติมได้ในบล็อกโพสต์ Farfetch Tech ช่วงกลางปี 2020 โดย Manuel Garcia วิศวกรอาวุโสฝ่ายเว็บไซต์

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

  • พฤติกรรมของผู้ใช้
  • ประสบการณ์ของผู้ใช้ในแอปพลิเคชัน Farfetch
  • การใช้แอปพลิเคชัน
  • Conversion ระดับมาโครและไมโคร
  • การวิเคราะห์ข้ามแชแนลและ Funnel

แนวคิดก็คือการเพิ่มข้อมูลประสิทธิภาพของการดูหน้าเว็บแต่ละครั้งบน Farfetch.com ซึ่งบันทึกโดย JavaScript ลงในชั้นข้อมูลนี้ เมื่อใช้รูปแบบนี้ รับประกันได้ว่าข้อมูลประสิทธิภาพจะตรงกันระหว่างข้อมูลประสิทธิภาพกับเมตริก Funnel หลักของ Conversion สำหรับแต่ละเซสชันและฐานสําหรับการสำรวจเชิงวิเคราะห์เกี่ยวกับหัวข้อดังกล่าว

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

ขั้นตอนที่ 2: การสื่อสารผ่านภาษาของธุรกิจ

เมื่อข้อมูลประสิทธิภาพมีอยู่ในชุดข้อมูล Business Intelligence ภายในของ Farfetch ทีมวิเคราะห์จึงเริ่มสำรวจรูปแบบและรูปแบบทางคณิตศาสตร์ในข้อมูลที่อาจแสดงถึงความสัมพันธ์ระหว่างเมตริกประสิทธิภาพกับ KPI ธุรกิจ (เช่น อัตรา Conversion และเปอร์เซ็นต์การเข้าชมหน้าเดียว) ทำให้เกิดมุมมองใหม่เกี่ยวกับผลกระทบทางการเงินจากความเร็วเว็บไซต์และ UX สำหรับธุรกิจ วิธีนี้จะช่วยให้ผู้มีอำนาจตัดสินใจทางธุรกิจสามารถอภิปรายเรื่องประสิทธิภาพเป็นภาษากลางได้ การวิเคราะห์นี้รวม Core Web Vitals ทั้งหมดและเมตริกอื่นๆ ที่ Farfetch เห็นว่ามีคุณค่า จึงช่วยเผยให้เห็นข้อมูลเชิงลึกที่มีประโยชน์อย่างยิ่ง

เมื่อทราบว่า Google แนะนำให้ใช้ Largest Contentful Paint (LCP) ที่น้อยกว่า 2.5 วินาทีเพื่อมอบประสบการณ์ที่ดีที่สุดแก่ผู้ใช้ Farfetch จึงศึกษาเกณฑ์นี้อย่างละเอียดและพบผลลัพธ์ที่มีความหมาย

การวิเคราะห์สหสัมพันธ์ทางสถิติเกี่ยวกับ Farfetch แสดงให้เห็นว่านอกเหนือจากจุดนั้นแล้ว อัตรา Conversion จะเริ่มลดลง และอัตราการออกเพิ่มขึ้น ผลสรุปนี้แสดงให้เห็นว่าผู้ใช้เริ่มรู้สึกด้านข้อเสียของความเข้าใจในการโหลดหน้าเว็บที่ช้า และอัตรา Conversion ลดลงโดยเฉลี่ย -1.3% โดยมี LCP เพิ่มขึ้นทุกๆ 100 มิลลิวินาที

กราฟของ LCP โดยแกน Y คืออัตรา Conversion และเปอร์เซ็นต์ของการเข้าชมหน้าเว็บ และแกน X เป็นเวลา LCP เนื่องจาก LCP รวดเร็วขึ้น เปอร์เซ็นต์การเข้าชมหน้าเว็บเดียวจะลดลง และอัตรา Conversion จะเพิ่มขึ้น

นอกจากนี้ Farfetch ยังยืนยันอัตราการออกที่ลดลง -3.1% สำหรับคะแนนแต่ละ 0.01 ที่ลดลง Cumulative Layout Shift (CLS) ซึ่งเป็นการยืนยันอีกครั้งถึงผลกระทบของความเสถียรของหน้าเว็บที่ทำให้ผู้ใช้เข้าชมเว็บไซต์ต่อไป

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

สําหรับการโต้ตอบและความลื่นไหลของหน้าเว็บ แม้ว่า First Input Delay (FID) จะได้รับการติดตามและวิเคราะห์อย่างต่อเนื่อง แต่ Farfetch ยังวัด TTI ด้วย ซึ่งพิสูจน์ให้เห็นว่าเป็นเมตริกที่มีผลกระทบอย่างมากสำหรับช่องทาง Conversion ของธุรกิจ Farfetch

จึงได้แทรก TTI Polyfill ของ Google ลงในเว็บไซต์เพื่อจัดเก็บเมตริกนี้ การใช้ Long Tasks API เพื่อรายงานงานที่ใช้เวลานาน (งานที่ใช้เวลานานกว่า 50 มิลลิวินาทีในเทรดหลักของเบราว์เซอร์)

จากนั้นทีมวิเคราะห์พบว่าอัตรา Conversion เพิ่มขึ้น 2.8% สำหรับการลด TTI ทุกวินาที ซึ่งเป็นเรื่องที่สำคัญสำหรับประสิทธิภาพของโค้ดที่ดีขึ้นและเป็นการอุดตันเทรดหลักของเบราว์เซอร์

กราฟของ TTI ซึ่งแกน Y คืออัตรา Conversion และเปอร์เซ็นต์ของการเข้าชมหน้าเว็บเดียว และแกน X เป็นเวลา TTI เมื่อ TTI เพิ่มขึ้น อัตรา Conversion จะลดลง และเปอร์เซ็นต์ของการเข้าชมหน้าเว็บเดียวเพิ่มขึ้น

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

ขั้นตอนที่ 3: การฝังการเปลี่ยนแปลงทางวัฒนธรรม

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

Farfetch สร้างเครื่องมือแบบบริการตนเองที่ตั้งชื่อว่า Site Speed Business Case Calculator เพื่อปรับปรุงการจัดลำดับความสำคัญ โดยได้แรงบันดาลใจจากโปรแกรม Speed Impact Calculator ของ Google ซึ่งช่วยให้ผู้จัดการผลิตภัณฑ์สร้างกรณีทางธุรกิจจากการปรับปรุงประสิทธิภาพได้โดยการคำนวณผลกระทบทางธุรกิจในทันที เมื่อใช้โมเดลข้อมูลที่ใช้ความสัมพันธ์ระหว่างอัตรา Conversion กับเมตริกประสบการณ์ของผู้ใช้ คุณจะสามารถปรับให้เข้ากับขอบเขตผลิตภัณฑ์ อุปกรณ์ และจุดติดต่อในเส้นทางของผู้ใช้ได้อย่างยืดหยุ่น

ภาพหน้าจอของ Site Speed Business Case Calculator ของ Farfetch

ในขณะเดียวกัน ชุดแดชบอร์ดการวิเคราะห์แบบบริการตนเองได้ช่วยให้เห็นตัวชี้วัดประสิทธิภาพแบบเรียลไทม์ทั่วทั้งธุรกิจและผลกระทบที่มีต่อธุรกิจ ปัจจุบันประสิทธิภาพได้เข้ามาเป็นส่วนหนึ่งในการพัฒนาผลิตภัณฑ์อย่างเต็มรูปแบบ และทีมผลิตภัณฑ์ก็สามารถเข้าถึงเมตริก เครื่องมือตรวจสอบ และการตรวจสอบงบประมาณด้านประสิทธิภาพได้อย่างง่ายดาย นอกจากนี้ เนื่องจากการผสานรวมชั้นข้อมูลยังทำให้เมตริกประสิทธิภาพพร้อมใช้งานบนเครื่องมือทดสอบ A/B ของ Farfetch ด้วย ซึ่งเป็นอีกเวกเตอร์หนึ่งของข้อมูลเชิงลึกที่มีประสิทธิภาพให้กับผู้จัดการผลิตภัณฑ์

ในช่วงหลายเดือนที่ผ่านมา ทีมหลักยังพยายามสร้างวัฒนธรรมนี้ ไม่เพียงเฉพาะทีมพัฒนาฟรอนท์เอนด์และภายในโดเมนของแพลตฟอร์ม โดยใช้วิธีการที่คล้ายกันในการตรวจสอบและพิสูจน์ผลกระทบของบริการและธุรกรรมย่อยหลักๆ ด้วย

มีงานนำเสนอที่ขับเคลื่อนด้วยการดึงข้อมูลล่วงหน้าจำนวนหนึ่งเกี่ยวกับหัวข้อนี้ แต่ยังมีการพูดถึงภายนอกด้วย ตัวอย่างเช่น การกล่าวถึงงาน Google I/O ประจำปี 2021 พูดถึงผลกระทบทางธุรกิจของ Core Web Vitals ทั้งยังช่วยให้เกิดความเกี่ยวข้องกับธีมอย่างต่อเนื่องและสร้างเสริมกลยุทธ์ของทีมเกี่ยวกับวัฒนธรรม

ขั้นตอนที่ 4: การปรับปรุงเมตริก

ท้ายที่สุดแล้ว ทั้งหมดนี้ก็จำเป็นต่อการทำให้ Farfetch ปรับปรุงเมตริกความเร็วเว็บไซต์อย่างเป็นกลาง และรับประกันว่าทีมจะทำตามแนวทางปฏิบัติที่ดีที่สุดในชั้นเรียนและคว้าโอกาสในการเพิ่มประสิทธิภาพ

โอกาสสำคัญอย่างหนึ่งที่ตรวจพบในปี 2021 คือความต้องการปรับปรุง LCP ในหน้าหลักของ Farfetch 2 ประเภท ได้แก่ หน้าผลิตภัณฑ์และหน้าข้อมูลผลิตภัณฑ์ที่แสดง

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

  • ปรับเปลี่ยนคอมโพเนนต์การโหลดรูปภาพผลิตภัณฑ์จากโซลูชันแบบ JavaScript ให้เป็นการใช้งานแบบเนทีฟ
  • กำหนดลำดับความสำคัญของรูปภาพและแบ่งรูปภาพออกเป็นเนื้อหาที่สำคัญและไม่สำคัญ
  • โหลดรูปภาพที่สำคัญตั้งแต่เนิ่นๆ โดยแหล่งที่มาในหน้าของ HTML อยู่แล้วและใช้ <link rel="preload"> เพื่อให้ดาวน์โหลดโดยเร็วที่สุด
  • ใช้แอตทริบิวต์ <img loading="lazy"> สำหรับรูปภาพที่ไม่สำคัญ โดยมี Polyfill ซึ่งใช้ Intersection Observer ในเบราว์เซอร์ที่ไม่รองรับ เช่น Safari

พวกเขาจึงสามารถสร้างความเปลี่ยนแปลงและพิสูจน์ผ่านการทดสอบ A/B เกี่ยวกับสมมติฐานและผลลัพธ์ทางธุรกิจ ตัวอย่างเช่น ในหน้าผลิตภัณฑ์ ความพยายามนี้ลดลงมากกว่า 600 มิลลิวินาที และการทดสอบ A/B แสดงให้เห็นว่าอัตรา Conversion เพิ่มขึ้นในช่วง 1-5% ด้วยระดับความเชื่อมั่นที่บริษัทกำหนดไว้

ด้านล่างนี้คือการปรับปรุงที่ทีมสามารถทำได้ในด้านเปอร์เซ็นต์การดูหน้าเว็บที่ถือว่า "ดี" "ต้องปรับปรุง" และ "แย่" ตามคำจำกัดความของ Google เกี่ยวกับคะแนน LCP

กราฟแท่งแบบซ้อนของ LCP ตามค่ามัธยฐานตามเกณฑ์ Core Web Vitals สำหรับหน้าข้อมูล Farfetch หน้าเว็บที่มีเกณฑ์ &quot;ดี&quot; เพิ่มขึ้นจาก 37% เป็น 53%
กราฟแท่งแบบซ้อนของ LCP ตามค่ามัธยฐานตามเกณฑ์ Core Web Vitals สำหรับหน้าข้อมูล Farfetch หน้าเว็บที่มีเกณฑ์ &quot;ดี&quot; เพิ่มขึ้นจาก 36% เป็น 48%

ผลตอบแทนของเว็บไซต์ที่เร็วกว่าและแนวทางการทำงานที่ดีขึ้น

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

Rui Santos ผู้จัดการผลิตภัณฑ์อาวุโสฝ่ายช่องทางเว็บของ Farfetch อธิบายว่า "เราต้องการหยุดวงจรของประสิทธิภาพเนื่องจากข้อกังวลด้านเทคโนโลยีเท่านั้น ซึ่งเป็นสิ่งที่มีแต่ทีมวิศวกรเป็นเจ้าของเท่านั้นที่ต้องจัดการและแก้ไข" "การเชื่อมต่อเมตริกประสิทธิภาพกับเมตริกธุรกิจทำได้ดีอย่างไม่น่าเชื่อในการถ่ายทอดข้อความได้อย่างรวดเร็ว ธุรกิจช่วยขับเคลื่อนบริษัท และการเชื่อมต่อความสำเร็จกับเมตริกความเร็วส่งเสริมให้ผู้มีส่วนเกี่ยวข้องในวงกว้างเข้าใจและรับมือกับการตัดสินใจได้

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