แนวทางที่เน้นข้อมูลเพื่อปรับปรุงประสิทธิภาพเว็บของ T-Mobile ช่วยลดปัญหาในเว็บไซต์ของผู้ใช้ได้ 20% และเพิ่มอัตรารถเข็นที่สั่งซื้อได้ 32%

bookmark_border จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ

Lucas Miré

David Lee

Tee Yeow

เผยแพร่: 19 มีนาคม 2025

T-Mobile เป็นบริษัทโทรคมนาคมชั้นนำในสหรัฐอเมริกาที่ให้บริการเครือข่ายที่ครอบคลุมและการเชื่อมต่อ 5G ที่รวดเร็ว

จากการวิเคราะห์ Web Vitals ของผู้ใช้จริง T-Mobile พบว่าการปรับปรุง Core Web Vitals ส่งผลต่อทั้งประสบการณ์ของผู้ใช้และเมตริกทางธุรกิจอย่างมีนัยสําคัญ

T-Mobile พยายามปรับปรุงการแสดงข้อมูลทางดิจิทัลอย่างต่อเนื่อง โดยได้ปรับปรุง Core Web Vitals ของเว็บไซต์ โดยเฉพาะ Largest Contentful Paint (LCP) เพื่อยกระดับประสบการณ์ของผู้ใช้ และปรับปรุงเมตริกทางธุรกิจที่สำคัญ

การเพิ่มการรับรู้เกี่ยวกับประสิทธิภาพของเว็บด้วยข้อมูล

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

T-Mobile จึงหันมาใช้กลยุทธ์ที่อิงตามข้อมูลเพื่อแก้ไขปัญหานี้ T-Mobile ตระหนักดีว่าข้อมูลห้องทดลองจาก Lighthouse และข้อมูลจากรายงาน UX ของ Chrome (CrUX) ให้มุมมองเพียงบางส่วนเกี่ยวกับประสิทธิภาพ จึงผสานรวมไลบรารี JavaScript ของ Web Vitals ไว้ในพร็อพเพอร์ตี้เว็บของ T-Mobile เพื่อบันทึกและวิเคราะห์ข้อมูลประสิทธิภาพโดยตรงจากผู้ใช้จริง ซึ่งเรียกว่าข้อมูลภาคสนาม

การผสานรวมข้อมูล Core Web Vitals จากภาคสนามเข้ากับชุดข้อมูลวิเคราะห์ช่วยให้ T-Mobile ค้นพบข้อมูลเชิงลึกที่มีประสิทธิภาพหลายประการ ซึ่งได้แก่

• ผลกระทบต่อประสบการณ์ของผู้ใช้: ผู้เข้าชม T-Mobile.com มีแนวโน้มที่จะตีกลับมากขึ้นเมื่อหน้าเว็บใช้เวลาโหลดนาน
• ผลกระทบต่อธุรกิจ: อัตรา Conversion ของ T-Mobile.com ลดลงเมื่อหน้าเว็บใช้เวลาโหลดนานขึ้น

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

การประมาณผลกระทบต่อรายได้ในกลุ่ม LCP 100 มิลลิวินาทีช่วยให้ทีมได้รับความสนใจจากผู้นำ และเริ่มจัดตั้งกลุ่มทำงานข้ามสายงานเพื่อปรับปรุงประสิทธิภาพของเว็บไซต์ ทีม SEO และทีมผลิตภัณฑ์ของ T-Mobile สื่อสารความสำคัญของการปรับปรุง Core Web Vitals ได้อย่างมีประสิทธิภาพด้วยการนำเสนอข้อมูลที่ชัดเจนและวัดโอกาส

การปรับขนาดการปรับปรุงประสิทธิภาพของเว็บเพื่อให้ได้ผลลัพธ์สูงสุด

ทีม T-Mobile ได้ดำเนินการปรับปรุงทางเทคนิคหลายอย่างโดยคำนึงถึงความยืดหยุ่นเพื่อแก้ไขปัญหาด้านประสิทธิภาพอย่างครอบคลุม โดยมุ่งเน้นที่การเพิ่มประสิทธิภาพคอมโพเนนต์ที่สําคัญและใช้ประโยชน์จากเทคโนโลยีเพื่อให้ได้ประสิทธิภาพที่เพิ่มขึ้นอย่างต่อเนื่องในแพลตฟอร์มดิจิทัล

ผลกระทบต่อประสบการณ์ของลูกค้า

ความพยายามในการปรับปรุงประสิทธิภาพเว็บไซต์ส่งผลให้ Largest Contentful Paint (LCP) โดยรวมลดลง 42% ดังนี้

การปรับปรุงนี้ส่งผลเชิงบวกต่อประสบการณ์ของผู้ใช้หลายประการ ดังนี้

ผลกระทบทางธุรกิจ

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

การอัปเกรดประสิทธิภาพที่สําคัญซึ่งขับเคลื่อน T-Mobile ไปข้างหน้า

ต่อไปนี้เป็นรายการโดยละเอียดของโครงการริเริ่มหลักและผลลัพธ์ที่เกี่ยวข้อง

• การแคชและการจัดระเบียบโค้ด API

  ระบบได้แคชและปรับโครงสร้าง API รวมถึง Products and Promotions API เพื่อปรับปรุงเวลาในการตอบสนองและลดภาระของเซิร์ฟเวอร์ การย้ายข้อมูลไปยังเครือข่ายนำส่งข้อมูล (CDN) เพื่อเพิ่มประสิทธิภาพการแคชมีส่วนช่วยในการปรับปรุงเหล่านี้อย่างมาก

• การแคชชิ้นงานแบบคงที่

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

• การเพิ่มประสิทธิภาพคอมโพเนนต์รูปภาพ

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

• การโหลดคอมโพเนนต์ล่วงหน้าและการโหลดล่วงหน้า

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

• เชื่อมต่อกับโดเมนที่สำคัญล่วงหน้าและการปรับปรุงสคริปต์ป้องกันภาพกะพริบ

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

• การย้ายข้อมูลแพลตฟอร์ม Adobe Experience Manager (AEM)

  ทีมได้ย้ายข้อมูลไปยังแพลตฟอร์มส่วนหน้าเวอร์ชันใหม่ซึ่งมีประสิทธิภาพและโครงสร้างพื้นฐานที่ดีขึ้น

• การย้ายข้อมูลคอมโพเนนต์ Angular ไปยังคอมโพเนนต์เริ่มต้นของ AEM

  ย้ายข้อมูลคอมโพเนนต์ Angular ไปยังคอมโพเนนต์เริ่มต้นของ Adobe Experience Manager (AEM) เพื่อปรับปรุงประสิทธิภาพและความสามารถในการบำรุงรักษา รวมถึงลดความซับซ้อนของสถาปัตยกรรม

• การเพิ่มประสิทธิภาพหน้า Landing Page ที่สําคัญ

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

• การลดข้อผิดพลาดใน API

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

ปลูกฝังวัฒนธรรมด้านประสิทธิภาพของเว็บด้วยการทำให้ข้อมูลเข้าถึงได้

T-Mobile ได้นํามาตรการหลักหลายประการมาใช้ทั่วทั้งองค์กรเพื่อให้แน่ใจว่ายังคงมุ่งมั่นที่จะมอบประสิทธิภาพของเว็บที่ยอดเยี่ยม โครงการริเริ่มเหล่านี้ออกแบบมาเพื่อเปิดโอกาสให้ทุกคนเข้าถึงข้อมูลประสิทธิภาพ เพิ่มความรู้และดึงดูดให้ทีมของเรามีส่วนร่วม ตรวจสอบ Core Web Vitals อย่างสม่ำเสมอ และบังคับใช้มาตรฐานประสิทธิภาพสำหรับรุ่นโค้ดทั้งหมด กลยุทธ์ต่อไปนี้จะอธิบายวิธีที่บริษัทเหล่านี้ปลูกฝังวัฒนธรรมด้านประสิทธิภาพของเว็บด้วยการทำให้เข้าถึงข้อมูลได้ ส่งเสริมการเรียนรู้อย่างต่อเนื่อง และสร้างแนวทางการกํากับดูแลที่มีประสิทธิภาพ

• การทำให้ข้อมูล Core Web Vitals เข้าถึงได้แบบทั่วถึง

  T-Mobile ใช้แดชบอร์ด Looker Studio ที่มีประสิทธิภาพเพื่อให้สมาชิกทุกคนในองค์กรเข้าถึงข้อมูลประสิทธิภาพได้ นอกจากนี้ วิกิประสิทธิภาพเว็บที่ครอบคลุมยังแนะนําสมาชิกในทีมให้ตีความและใช้รายงาน Core Web Vitals ได้อย่างมีประสิทธิภาพ

  

  จากซ้ายไปขวา ข้อมูลจะแสดงดังนี้

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

• การศึกษาและการมีส่วนร่วมอย่างต่อเนื่อง

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

• ระบบการแจ้งเตือนสําหรับ Core Web Vitals

  เราได้สร้างระบบการแจ้งเตือนเพื่อตรวจสอบ Core Web Vitals สําหรับกลุ่มหน้าเว็บต่างๆ เมื่อ Core Web Vitals มีค่าถึงเกณฑ์พื้นฐานที่กำหนด ระบบจะส่งการแจ้งเตือนทางอีเมลไปยังผู้มีส่วนเกี่ยวข้องที่เกี่ยวข้องโดยอัตโนมัติ

• ข้อกำหนดด้านประสิทธิภาพสำหรับการเผยแพร่โค้ด

  นอกจากนี้ T-Mobile ยังมีข้อกำหนดด้านประสิทธิภาพสำหรับการเผยแพร่โค้ดด้วย หน้าเว็บต้องเป็นไปตามระดับประสิทธิภาพที่เฉพาะเจาะจงใน Lighthouse ก่อนจึงจะเปิดตัวได้ เพื่อให้มั่นใจว่าเว็บมีประสิทธิภาพตามมาตรฐานสูง

การใช้มาตรการเหล่านี้ช่วยให้ T-Mobile มั่นใจได้ว่าประสิทธิภาพของเว็บจะยังคงมีความสำคัญและยังคงส่งเสริมวัฒนธรรมการปรับปรุงอย่างต่อเนื่อง

ขอขอบคุณ

ขอขอบคุณผู้ทํางานเกี่ยวกับประสิทธิภาพของเว็บไซต์และกรณีศึกษานี้ของ T-Mobile ได้แก่ Kevin Lau, Monique Misrahi, Bill Dinger, Laura Mathisen, Suresh Gundu, Duke Fong, Amir Mohammadi, Liang Yeh, Jennifer Panke, Julia Edgar, Ejaz Malik, Damon Jochum, Will Fraley, Gene McKenna, Vinayak Hegde และ Warren McNeel

กรณีศึกษานี้พัฒนาขึ้นจากความร่วมมือระหว่าง T-Mobile กับพาร์ทเนอร์โซลูชันลูกค้าของ Google อย่าง Ilya Motamedi, Dakota Deady และ Christine Zanedis ซึ่งข้อมูลเชิงลึกและการสนับสนุนของพาร์ทเนอร์เหล่านี้ช่วยให้โครงการริเริ่มนี้ประสบความสําเร็จ